SystemSet.vue 9.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403
  1. <template>
  2. <view class="container">
  3. <form @submit="onSubmit">
  4. <view class="page-block">
  5. <view class="page-title-block">
  6. </view>
  7. <view class="content">
  8. <view class="cell flex flex-y-center">
  9. <view class="title-block required">
  10. <text>商家id</text>
  11. </view>
  12. <view class="desc">
  13. <input type="text" disabled :value="info.admin_id" class="input-box"
  14. placeholder-class="desc-placeholder">
  15. </view>
  16. </view>
  17. <view class="cell flex flex-y-center">
  18. <view class="title-block required">
  19. <text>平台名称</text>
  20. </view>
  21. <view class="desc">
  22. <input type="text" :value="info.name" name="name" class="input-box" placeholder="请输入"
  23. placeholder-class="desc-placeholder">
  24. </view>
  25. </view>
  26. <view class="cell flex flex-y-center">
  27. <view class="title-block required">
  28. <text>平台风格颜色</text>
  29. </view>
  30. <view class="desc flex-y-center box-pack-between">
  31. <input type="text" @input="bindColor" :value="info.color" name="color" class="input-box" placeholder="请输入"
  32. placeholder-class="desc-placeholder">
  33. <view class="rund" :style="{background:setColor}"></view>
  34. </view>
  35. </view>
  36. <view class="cell flex flex-y-center">
  37. <view class="title-block required">
  38. <text>联系电话</text>
  39. </view>
  40. <view class="desc">
  41. <input type="text" :value="info.tel" name="tel" class="input-box" placeholder="请输入"
  42. placeholder-class="desc-placeholder">
  43. </view>
  44. </view>
  45. </view>
  46. </view>
  47. <view class="page-block">
  48. <view class="page-title-block">
  49. <view class="title">达达配送信息</view>
  50. </view>
  51. <view class="content">
  52. <view class="cell flex flex-y-center">
  53. <view class="title-block">
  54. <text>达达key</text>
  55. </view>
  56. <view class="desc">
  57. <input type="text" name="app_key" :value="info.app_key" class="input-box" placeholder="请输入"
  58. placeholder-class="desc-placeholder">
  59. </view>
  60. </view>
  61. <view class="cell flex flex-y-center">
  62. <view class="title-block">
  63. <text>达达secret</text>
  64. </view>
  65. <view class="desc">
  66. <input type="text" name="app_secret" :value="info.app_secret" class="input-box"
  67. placeholder="请输入" placeholder-class="desc-placeholder">
  68. </view>
  69. </view>
  70. <view class="red" @click="copyText(1)">
  71. *点击复制去http://newopen.imdada.cn申请
  72. </view>
  73. <view class="cell flex flex-y-center">
  74. <view class="title-block">
  75. <text>高德地图key</text>
  76. </view>
  77. <view class="desc">
  78. <input type="text" name="map_key" :value="info.map_key" class="input-box" placeholder="请输入"
  79. placeholder-class="desc-placeholder">
  80. </view>
  81. </view>
  82. <view class="red" @click="copyText(2)">
  83. *点击复制去https://lbs.amap.com/申请
  84. </view>
  85. </view>
  86. </view>
  87. <view class="page-block" >
  88. <view class="page-title-block">
  89. <view class="title">支付宝消费券</view>
  90. </view>
  91. <view class="content">
  92. <view class="cell flex flex-y-center">
  93. <view class="title-block">
  94. <text>支付宝消费券</text>
  95. </view>
  96. <view class="desc flex-center ">
  97. <view class="checklist-box " @click="choicemenber(index)"
  98. v-for="(item,index) of ali_arr" :key='index' :class="is_coupon==index?'actt':''">
  99. <view class="radio__inner" :class="is_coupon==index?'act_border':''">
  100. <view :class="is_coupon==index?'is-default-checked':''"
  101. class="radio__inner-icon radio__inner-icon ">
  102. </view>
  103. </view>
  104. <text class="checklist-text">{{item}}</text>
  105. </view>
  106. </view>
  107. </view>
  108. <view class="cell flex flex-y-center" v-if="is_coupon==1">
  109. <view class="title-block">
  110. <text>支付宝领取权益ID</text>
  111. </view>
  112. <view class="desc">
  113. <input type="text" name="app_secret" :value="info.consumer_coupon" class="input-box"
  114. placeholder="请输入" placeholder-class="desc-placeholder">
  115. </view>
  116. </view>
  117. <view class="red" @click="copyText(3)">
  118. *点击复制去https://opendocs.alipay.com/mini/operation/benefit-plugin报名开通
  119. </view>
  120. </view>
  121. </view>
  122. <view class="page-block" >
  123. <view class="page-title-block">
  124. <view class="title">花呗分期</view>
  125. </view>
  126. <view class="content">
  127. <view class="cell flex flex-y-center">
  128. <view class="title-block">
  129. <text>商家承担花呗分期手续费</text>
  130. </view>
  131. <view class="desc flex-center ">
  132. <view class="checklist-box " @click="choiceFlowers(index)"
  133. v-for="(item,index) of flowers_arr" :key='index' :class="cost==index?'actt':''">
  134. <view class="radio__inner" :class="cost==index?'act_border':''">
  135. <view :class="cost==index?'is-default-checked':''"
  136. class="radio__inner-icon radio__inner-icon ">
  137. </view>
  138. </view>
  139. <text class="checklist-text">{{item}}</text>
  140. </view>
  141. </view>
  142. </view>
  143. <view class="cell flex flex-y-center" >
  144. <view class="title-block">
  145. <text>花呗分期金额门槛</text>
  146. </view>
  147. <view class="desc">
  148. <input type="digit" name="money" :value="info.money" class="input-box"
  149. placeholder="请输入" placeholder-class="desc-placeholder">
  150. </view>
  151. </view>
  152. </view>
  153. </view>
  154. <button class="sub-btn" hover-class="none" form-type="submit">
  155. 立即提交
  156. </button>
  157. <!-- <view class="sub-btn">立即提交</view> -->
  158. </form>
  159. </view>
  160. </template>
  161. <script>
  162. export default {
  163. data() {
  164. return {
  165. info: {},
  166. ali_arr: [
  167. '关闭', '开启'
  168. ],
  169. is_coupon:0,
  170. setColor:"",
  171. flowers_arr:['关闭', '开启'],
  172. cost:0,
  173. }
  174. },
  175. onLoad() {
  176. this.getdata();
  177. },
  178. methods: {
  179. bindColor(e){
  180. this.setColor=e.detail.value;
  181. },
  182. choicemenber(index) {
  183. this.is_coupon = index;
  184. },
  185. choiceFlowers(index) {
  186. this.cost = index;
  187. },
  188. getdata(e) {
  189. this.request({
  190. url: "Smdcshop/setting_index",
  191. data: {
  192. admin_id: uni.getStorageSync("admin_id")
  193. },
  194. }).then(res => {
  195. console.log(res, "res")
  196. if (res.code === '200') {
  197. this.info = res.data;
  198. this.is_coupon=res.data.is_coupon;
  199. this.setColor=res.data.color;
  200. this.cost=res.data.cost;
  201. }
  202. });
  203. },
  204. copyText(e) {
  205. let a = e == 1 ? 'http://newopen.imdada.cn' : e==3?'https://opendocs.alipay.com/mini/operation/benefit-plugin':'https://lbs.amap.com';
  206. uni.setClipboardData({
  207. data: a,
  208. success: function() {
  209. console.log('success');
  210. }
  211. });
  212. },
  213. onSubmit(e) {
  214. let data = e.detail.value;
  215. data.admin_id = uni.getStorageSync("admin_id");
  216. data.id = this.info.id;
  217. data.is_coupon=this.is_coupon;
  218. data.cost=this.cost;
  219. uni.showModal({
  220. title: '提示',
  221. content: '是否要修改?',
  222. showCancel: true,
  223. cancelText: '取消',
  224. confirmText: '确定',
  225. success: r => {
  226. if (r.confirm) {
  227. this.request({
  228. url: "Smdcshop/setting_update",
  229. data: data,
  230. }).then(res => {
  231. if (res.code == 200) {
  232. uni.showToast({
  233. title: res.message,
  234. icon: 'none'
  235. })
  236. setTimeout(() => {
  237. uni.navigateBack()
  238. }, 2000)
  239. }
  240. }).catch((res) => {
  241. uni.showToast({
  242. title: res.message,
  243. icon: 'none'
  244. })
  245. })
  246. }
  247. }
  248. });
  249. }
  250. }
  251. }
  252. </script>
  253. <style>
  254. @import url("../static/css/common.css");
  255. page .page-block .content {
  256. background-color: #F4F5F7;
  257. padding: 0;
  258. }
  259. page .page-block .cell {
  260. background-color: #FFF;
  261. padding: 0 25rpx;
  262. }
  263. .rund{
  264. width: 40rpx;
  265. height: 40rpx;
  266. }
  267. .red {
  268. color: red;
  269. padding: 10rpx 25rpx;
  270. font-size: 26rpx;
  271. }
  272. page {
  273. background-color: #F4F5F7;
  274. }
  275. .sub-btn {
  276. width: 690rpx;
  277. height: 100rpx;
  278. background: linear-gradient(315deg, #3387ff 2%, #569bff 99%);
  279. border-radius: 8rpx;
  280. box-shadow: 0px 0px 8rpx 0px rgba(51, 135, 255, 0.20);
  281. text-align: center;
  282. line-height: 100rpx;
  283. color: #fff;
  284. font-size: 36rpx;
  285. font-weight: bold;
  286. /* position: fixed; */
  287. /* left: 50%;
  288. bottom: 70rpx; */
  289. /* transform: translateX(-50%); */
  290. margin: 0 auto;
  291. margin-top: 30px;
  292. }
  293. .checklist-box {
  294. display: -webkit-box;
  295. display: -webkit-flex;
  296. display: flex;
  297. -webkit-box-orient: horizontal;
  298. -webkit-box-direction: normal;
  299. -webkit-flex-direction: row;
  300. flex-direction: row;
  301. -webkit-box-align: center;
  302. -webkit-align-items: center;
  303. align-items: center;
  304. margin: 5px 0;
  305. margin-right: 22px;
  306. }
  307. .radio__inner {
  308. -webkit-flex-shrink: 0;
  309. flex-shrink: 0;
  310. display: -webkit-box;
  311. display: -webkit-flex;
  312. display: flex;
  313. -webkit-box-pack: center;
  314. -webkit-justify-content: center;
  315. justify-content: center;
  316. -webkit-box-align: center;
  317. -webkit-align-items: center;
  318. align-items: center;
  319. position: relative;
  320. border: 1px solid #DCDFE6;
  321. border-radius: 2px;
  322. box-sizing: border-box;
  323. width: 16px;
  324. height: 16px;
  325. border-radius: 16px;
  326. background-color: #fff;
  327. z-index: 1;
  328. -webkit-transition: border-color .3s;
  329. transition: border-color .3s;
  330. }
  331. .radio__inner-icon {
  332. width: 8px;
  333. height: 8px;
  334. border-radius: 10px;
  335. opacity: 0;
  336. -webkit-transition: -webkit-transform .3s;
  337. transition: -webkit-transform .3s;
  338. transition: transform .3s;
  339. transition: transform .3s, -webkit-transform .3s;
  340. }
  341. .is-default-checked {
  342. opacity: 1;
  343. background-color: #007aff;
  344. -webkit-transform: rotate(45deg) scaleY(1);
  345. transform: rotate(45deg) scaleY(1);
  346. }
  347. .act_border{
  348. border:1rpx solid #007aff;
  349. }
  350. .checklist-text {
  351. font-size: 28rpx;
  352. margin-left: 5px;
  353. -webkit-transition: color 0.2s;
  354. transition: color 0.2s;
  355. color: #000;
  356. }
  357. </style>