codeAdd.vue 8.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340
  1. <template>
  2. <view class="container">
  3. <form @submit="onSubmit">
  4. <view class="page-block">
  5. <view class="content">
  6. <view class="cell flex flex-y-center">
  7. <view class="title-block required">
  8. <text>活动标题</text>
  9. </view>
  10. <view class="desc">
  11. <input type="text" :value="info.name" name="name" class="input-box" placeholder="请输入活动标题"
  12. placeholder-class="desc-placeholder">
  13. </view>
  14. </view>
  15. <view class="cell flex flex-y-center">
  16. <view class="title-block ">
  17. <text>活动类型</text>
  18. </view>
  19. <view class="title-block">
  20. 实体大转盘
  21. </view>
  22. </view>
  23. <view class="box-pack-between ft32 cell flex-y-center">
  24. <text class="item_name ft28">选择活动<text style="color:red">*</text></text>
  25. <picker class="ft28" :range="game_list" range-key="name" @change="bindGame">
  26. <view class="flex-y-center">
  27. <!-- <view v-if="game_index<=-1">{{game_name}}</view> -->
  28. <view>{{game_list[0].name}}</view>
  29. <text class="iconfont icon-prev"></text>
  30. </view>
  31. </picker>
  32. </view>
  33. <view class="cell flex flex-y-center">
  34. <view class="title-block ">
  35. <text>跳转类型</text>
  36. </view>
  37. <view class="desc">
  38. <view class="flex-center">
  39. <view class="checklist-box " @click="choicepay(item.num)"
  40. v-for="(item,index) of integral_arr" :key='index'
  41. :class="is_integral==item.num?'actt':''">
  42. <view class="radio__inner" :class="is_integral==item.num?'act_border':''">
  43. <view :class="is_integral==item.num?'is-default-checked':''"
  44. class="radio__inner-icon radio__inner-icon ">
  45. </view>
  46. </view>
  47. <text class="checklist-text">{{item.name}}</text>
  48. </view>
  49. </view>
  50. </view>
  51. </view>
  52. <view class="flex cell desc-title" @click="ChooseImage" v-if="is_integral==1">
  53. <view class="">
  54. 加群二维码
  55. </view>
  56. <image v-if="thumb" class="logo-img" :src="URL+''+thumb">
  57. </image>
  58. <image v-else class="desc-img" src="../static/images/icon_6.png" mode=""></image>
  59. </view>
  60. <view class="" v-if="is_integral==2">
  61. <view class="cell flex flex-y-center">
  62. <view class="title-block required">
  63. <text>微信小程序AppID</text>
  64. </view>
  65. <view class="desc">
  66. <input type="text" :value="info.name" name="name" class="input-box"
  67. placeholder="请输入小程序AppID" placeholder-class="desc-placeholder">
  68. </view>
  69. </view>
  70. <view class="cell flex flex-y-center">
  71. <view class="title-block required">
  72. <text>微信小程序路径</text>
  73. </view>
  74. <view class="desc">
  75. <input type="text" :value="info.name" name="name" class="input-box"
  76. placeholder="请输入跳转路径" placeholder-class="desc-placeholder">
  77. </view>
  78. </view>
  79. <view class="cell flex flex-y-center">
  80. <view class="title-block required">
  81. <text>支付宝小程序AppID</text>
  82. </view>
  83. <view class="desc">
  84. <input type="text" :value="info.name" name="name" class="input-box"
  85. placeholder="请输入小程序AppID" placeholder-class="desc-placeholder">
  86. </view>
  87. </view>
  88. <view class="cell flex flex-y-center">
  89. <view class="title-block required">
  90. <text>支付宝小程序路径</text>
  91. </view>
  92. <view class="desc">
  93. <input type="text" :value="info.name" name="name" class="input-box"
  94. placeholder="请输入跳转路径" placeholder-class="desc-placeholder">
  95. </view>
  96. </view>
  97. </view>
  98. </view>
  99. </view>
  100. <view class="footer-bar">
  101. <view class="content flex flex-center" style="background: none;">
  102. <!-- <view class="btn">立即添加</view> -->
  103. <button class="btn" hover-class="none" form-type="submit">
  104. {{info.id?'修改类型':'立即添加'}}
  105. </button>
  106. </view>
  107. </view>
  108. </form>
  109. </view>
  110. </template>
  111. <script>
  112. export default {
  113. data() {
  114. return {
  115. URL: getApp().globalData.URL,
  116. tableTypeList: ['大桌', '中桌', '小桌'],
  117. tableType: "",
  118. store_id: "",
  119. info: {},
  120. is_integral: 1,
  121. game_list: [],
  122. integral_arr: [{
  123. num: 0,
  124. name: "不跳转"
  125. },
  126. {
  127. num: 1,
  128. name: "加群码"
  129. },
  130. {
  131. num: 2,
  132. name: "小程序"
  133. }
  134. ],
  135. thumb:""
  136. }
  137. },
  138. onLoad(e) {
  139. if (e.id) {
  140. // this.info=e;
  141. this.getData(e.id)
  142. }
  143. this.store_id = uni.getStorageSync("store_id");
  144. },
  145. methods: {
  146. ChooseImage(e) {
  147. // let type = e.currentTarget.dataset.type;
  148. uni.chooseImage({
  149. count: 1, //默认9
  150. sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
  151. sourceType: ['album'], //从相册选择
  152. success: (res) => {
  153. console.log(res)
  154. // var tempFilesSize = res.tempFiles[0].size;//获取图片的大小,单位B
  155. res.tempFilePaths.forEach((v, i) => {
  156. // console.log(v)
  157. this.Upload({
  158. url: "Smdcshop/upload",
  159. data: {
  160. url: v,
  161. type: "",
  162. token: "",
  163. admin_id: uni.getStorageSync("admin_id")
  164. }
  165. }).then(res => {
  166. console.log(res, "res")
  167. this.imgid = res.id;
  168. this.thumb = res.src;
  169. }).catch(err => {
  170. uni.showToast({
  171. title: err.message,
  172. icon: 'none'
  173. })
  174. });
  175. })
  176. },
  177. });
  178. },
  179. choicepay(e) {
  180. this.is_integral = e;
  181. },
  182. getData(id) {
  183. this.request({
  184. url: 'Smdcshop/table_type_update_info',
  185. data: {
  186. id: id
  187. }
  188. }).then(res => {
  189. if (res.code == "200") {
  190. this.info = res.data
  191. } else {
  192. this.is_bottom = true
  193. }
  194. })
  195. },
  196. onSubmit(e) {
  197. let params = {
  198. admin_id: uni.getStorageSync("admin_id"),
  199. store_id: this.store_id,
  200. name: e.detail.value.name,
  201. num: e.detail.value.num,
  202. source: 0,
  203. mark: e.detail.value.mark,
  204. content: e.detail.value.content,
  205. },
  206. url;
  207. if (this.info.id) {
  208. params.id = this.info.id
  209. url = "Smdcshop/table_type_update"
  210. } else {
  211. url = 'Smdcshop/table_type_add'
  212. }
  213. if (params.name == "") {
  214. uni.showToast({
  215. title: "请输入名称",
  216. icon: 'none'
  217. })
  218. return false
  219. }
  220. this.request({
  221. url,
  222. data: params
  223. }).then(res => {
  224. if (res.code == 200) {
  225. uni.showToast({
  226. title: res.message,
  227. icon: 'none'
  228. })
  229. setTimeout(() => {
  230. uni.navigateBack()
  231. }, 2000)
  232. }
  233. }).catch((res) => {
  234. uni.showToast({
  235. title: res.message,
  236. icon: 'none'
  237. })
  238. });
  239. },
  240. }
  241. }
  242. </script>
  243. <style>
  244. @import url("../static/css/common.css");
  245. page {
  246. background-color: #F4F5F7;
  247. }
  248. .desc-title {
  249. font-size: 26rpx;
  250. padding: 20rpx 0;
  251. }
  252. .desc-img {
  253. width: 150rpx;
  254. height: 150rpx;
  255. margin-left: 30rpx;
  256. }
  257. .checklist-box {
  258. display: -webkit-box;
  259. display: -webkit-flex;
  260. display: flex;
  261. -webkit-box-orient: horizontal;
  262. -webkit-box-direction: normal;
  263. -webkit-flex-direction: row;
  264. flex-direction: row;
  265. -webkit-box-align: center;
  266. -webkit-align-items: center;
  267. align-items: center;
  268. margin: 5px 0;
  269. margin-right: 22px;
  270. }
  271. .radio__inner {
  272. -webkit-flex-shrink: 0;
  273. flex-shrink: 0;
  274. display: -webkit-box;
  275. display: -webkit-flex;
  276. display: flex;
  277. -webkit-box-pack: center;
  278. -webkit-justify-content: center;
  279. justify-content: center;
  280. -webkit-box-align: center;
  281. -webkit-align-items: center;
  282. align-items: center;
  283. position: relative;
  284. border: 1px solid #DCDFE6;
  285. border-radius: 2px;
  286. box-sizing: border-box;
  287. width: 16px;
  288. height: 16px;
  289. border-radius: 16px;
  290. background-color: #fff;
  291. z-index: 1;
  292. -webkit-transition: border-color .3s;
  293. transition: border-color .3s;
  294. }
  295. .radio__inner-icon {
  296. width: 8px;
  297. height: 8px;
  298. border-radius: 10px;
  299. opacity: 0;
  300. -webkit-transition: -webkit-transform .3s;
  301. transition: -webkit-transform .3s;
  302. transition: transform .3s;
  303. transition: transform .3s, -webkit-transform .3s;
  304. }
  305. .is-default-checked {
  306. opacity: 1;
  307. background-color: #007aff;
  308. -webkit-transform: rotate(45deg) scaleY(1);
  309. transform: rotate(45deg) scaleY(1);
  310. }
  311. .checklist-text {
  312. font-size: 28rpx;
  313. margin-left: 5px;
  314. -webkit-transition: color 0.2s;
  315. transition: color 0.2s;
  316. color: #000;
  317. }
  318. .act_border {
  319. border: 1rpx solid #007aff;
  320. }
  321. </style>