mandatory.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  1. <template>
  2. <view class="container">
  3. <view class="content">
  4. <view class="cell flex flex-y-center">
  5. <view class="title-block requsired">
  6. <text>是否开启外卖:</text>
  7. </view>
  8. <view class="desc">
  9. <view class="flex-center">
  10. <view class="checklist-box " @click="choicepay(item.type)" v-for="(item,index) of integral_arr"
  11. :key='index' :class="is_integral==item.type?'actt':''">
  12. <view class="radio__inner" :class="is_integral==item.type?'act_border':''">
  13. <view :class="is_integral==item.type?'is-default-checked':''"
  14. class="radio__inner-icon radio__inner-icon ">
  15. </view>
  16. </view>
  17. <text class="checklist-text">{{item.name}}</text>
  18. </view>
  19. </view>
  20. </view>
  21. </view>
  22. <view class="cell flex flex-y-center">
  23. <view class="title-block requsired">
  24. <text>是否开启堂食:</text>
  25. </view>
  26. <view class="desc">
  27. <view class="flex-center">
  28. <view class="checklist-box " @click="choicepayTs(item.type)"
  29. v-for="(item,index) of integral_arr_add" :key='index'
  30. :class="is_integral_add==item.type?'actt':''">
  31. <view class="radio__inner" :class="is_integral_add==item.type?'act_border':''">
  32. <view :class="is_integral_add==item.type?'is-default-checked':''"
  33. class="radio__inner-icon radio__inner-icon ">
  34. </view>
  35. </view>
  36. <text class="checklist-text">{{item.name}}</text>
  37. </view>
  38. </view>
  39. </view>
  40. </view>
  41. </view>
  42. <view class="footer-bar" @click="onSubmit">
  43. <view class="content flex flex-center" style="background: none;">
  44. <button class="btn" hover-class="none" form-type="submit">
  45. 提交
  46. </button>
  47. </view>
  48. </view>
  49. </view>
  50. </view>
  51. </template>
  52. <script>
  53. export default {
  54. data() {
  55. return {
  56. integral_arr: [{
  57. type: 1,
  58. name: "开启",
  59. }, {
  60. type: 2,
  61. name: "关闭",
  62. }, ],
  63. is_integral: 1,
  64. integral_arr_add: [{
  65. type: 1,
  66. name: "开启",
  67. }, {
  68. type: 2,
  69. name: "关闭",
  70. }, ],
  71. is_integral_add: 1,
  72. store_id: '',
  73. obj:{},
  74. id:'',
  75. }
  76. },
  77. onLoad(e) {
  78. this.store_id = uni.getStorageSync("store_id");
  79. this.less()
  80. },
  81. methods: {
  82. less(){
  83. let params = {
  84. store_id:this.store_id,
  85. }
  86. this.request({
  87. url: "xcx/siteConfigFind",
  88. data: params
  89. }).then(res => {
  90. if (res.code == 200||res.code == '200') {
  91. this.id=res.data.id;
  92. this.is_integral=res.data.outside==1?1:2;
  93. this.is_integral_add=res.data.canteen==1?1:2;
  94. }
  95. }).catch((res) => {
  96. uni.showToast({
  97. title: res.message,
  98. icon: 'none'
  99. })
  100. });
  101. },
  102. choicepay(index) {
  103. this.is_integral = index;
  104. },
  105. choicepayTs(index) {
  106. this.is_integral_add = index;
  107. },
  108. onSubmit(e) {
  109. let params = {
  110. outside: this.is_integral == 1 ? 1 : 5,
  111. canteen: this.is_integral_add == 1 ? 1 :5,
  112. store_id:this.store_id,
  113. id:this.id,
  114. }
  115. this.request({
  116. url: "xcx/siteConfigFind",
  117. data: params
  118. }).then(res => {
  119. if (res.code == 200) {
  120. uni.showToast({
  121. title: res.message,
  122. icon: 'none'
  123. })
  124. setTimeout(() => {
  125. uni.navigateBack()
  126. }, 2000)
  127. }
  128. }).catch((res) => {
  129. uni.showToast({
  130. title: res.message,
  131. icon: 'none'
  132. })
  133. });
  134. },
  135. }
  136. }
  137. </script>
  138. <style>
  139. @import url("./static/css/common.css");
  140. page {
  141. background-color: #F4F5F7;
  142. }
  143. page .content {
  144. background-color: #F4F5F7;
  145. padding: 0;
  146. }
  147. page .content .cell {
  148. background-color: #FFF;
  149. padding: 25rpx;
  150. }
  151. .title-block {
  152. margin-right: 20rpx;
  153. }
  154. .checklist-box {
  155. display: -webkit-box;
  156. display: -webkit-flex;
  157. display: flex;
  158. -webkit-box-orient: horizontal;
  159. -webkit-box-direction: normal;
  160. -webkit-flex-direction: row;
  161. flex-direction: row;
  162. -webkit-box-align: center;
  163. -webkit-align-items: center;
  164. align-items: center;
  165. margin: 5px 0;
  166. margin-right: 22px;
  167. }
  168. .radio__inner {
  169. -webkit-flex-shrink: 0;
  170. flex-shrink: 0;
  171. display: -webkit-box;
  172. display: -webkit-flex;
  173. display: flex;
  174. -webkit-box-pack: center;
  175. -webkit-justify-content: center;
  176. justify-content: center;
  177. -webkit-box-align: center;
  178. -webkit-align-items: center;
  179. align-items: center;
  180. position: relative;
  181. border: 1px solid #DCDFE6;
  182. border-radius: 2px;
  183. box-sizing: border-box;
  184. width: 16px;
  185. height: 16px;
  186. border-radius: 16px;
  187. background-color: #fff;
  188. z-index: 1;
  189. -webkit-transition: border-color .3s;
  190. transition: border-color .3s;
  191. }
  192. .radio__inner-icon {
  193. width: 8px;
  194. height: 8px;
  195. border-radius: 10px;
  196. opacity: 0;
  197. -webkit-transition: -webkit-transform .3s;
  198. transition: -webkit-transform .3s;
  199. transition: transform .3s;
  200. transition: transform .3s, -webkit-transform .3s;
  201. }
  202. .is-default-checked {
  203. opacity: 1;
  204. background-color: #007aff;
  205. -webkit-transform: rotate(45deg) scaleY(1);
  206. transform: rotate(45deg) scaleY(1);
  207. }
  208. .checklist-text {
  209. font-size: 28rpx;
  210. margin-left: 5px;
  211. -webkit-transition: color 0.2s;
  212. transition: color 0.2s;
  213. color: #000;
  214. }
  215. .act_border {
  216. border: 1rpx solid #007aff;
  217. }
  218. </style>