cashCouponDetail.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517
  1. <template>
  2. <view class="content">
  3. <view class="headerGetbg"></view>
  4. <view class="bgf mar-24 home-content">
  5. <view class="box-pack-between list flex-y-center br">
  6. <text class="ft32 list-title">基本信息</text>
  7. <view class="flex-y-center">
  8. <view @click="enit" class="flex-y-center" style="margin-right: 20rpx;color: #1296db;">
  9. <image src="../static/images/gx.png" class="list-icon" mode=""></image> 更新
  10. </view>
  11. <view @click="del" class="flex-y-center" style="margin-right: 0rpx;color: #FF5722;">
  12. <image src="../static/images/fj.png" class="list-icon" mode=""></image> 发劵
  13. </view>
  14. </view>
  15. </view>
  16. <view class="flex-y-center home-content-item" style="padding-top: 24rpx;">
  17. <text class="home-left-name">名称:</text>
  18. <view style="word-break:break-all;">{{info.brand_name}}</view>
  19. </view>
  20. <view class="flex-y-center home-content-item">
  21. <text class="home-left-name">模板ID:</text>
  22. <text>{{info.template_id}}</text>
  23. </view>
  24. <view class="flex-y-center home-content-item">
  25. <text class="home-left-name">总金额:</text>
  26. <text>{{info.total_amount}}</text>
  27. </view>
  28. <view class="flex-y-center home-content-item">
  29. <text class="home-left-name">使用门槛:</text>
  30. <text>{{info.floor_amount}}</text>
  31. </view>
  32. <view class="flex-y-center home-content-item">
  33. <text class="home-left-name">已领取:</text>
  34. <text>{{info.publish_count}}</text>
  35. </view>
  36. <view class="flex-y-center home-content-item">
  37. <text class="home-left-name">已领金额:</text>
  38. <text>{{info.publish_amount}}</text>
  39. </view>
  40. <view class="flex-y-center home-content-item">
  41. <text class="home-left-name">已使用:</text>
  42. <text>{{info.used_count}}</text>
  43. </view>
  44. <view class="flex-y-center home-content-item">
  45. <text class="home-left-name">已用金额:</text>
  46. <text>{{info.used_amount}}</text>
  47. </view>
  48. <view class="flex-y-center home-content-item">
  49. <text class="home-left-name">已退金额:</text>
  50. <text>{{info.recycle_amount}}</text>
  51. </view>
  52. <view class="flex-y-center home-content-item">
  53. <text class="home-left-name">状态:</text>
  54. <text> {{info.status=='I'?'未生效':info.status=='S'?'已生效':info.status=='D'?'已删除':'已过期'}}</text>
  55. </view>
  56. <view class="flex-y-center home-content-item">
  57. <text class="home-left-name">发放时间:</text>
  58. <text>{{ info.publish_start_time+"至"+info.publish_end_time}}</text>
  59. </view>
  60. <view class="flex-y-center home-content-item">
  61. <text class="home-left-name">使用时间:</text>
  62. <text>{{info.expire_start_time+"至"+info.expire_end_time}}</text>
  63. </view>
  64. </view>
  65. <!--
  66. <view class="bgf home-content br">
  67. <view @click="addlabel" class="box-pack-between list flex-y-center br">
  68. <text class="ft32">文件预览</text>
  69. </view>
  70. </view>
  71. -->
  72. <!-- <view style="height: 75px;"></view> -->
  73. <!-- <view style="margin-bottom:0" class="bottom-bar flex-center" @click="videoStatus(info.status)">
  74. <button formType="submit" class="flex-center ft28">{{info.status==1?'下架':'上架'}}</button>
  75. </view> -->
  76. <view class="model flex-center" v-if="is_model" @click="bindno">
  77. <view class="model-home" @click.stop="gg">
  78. <form @submit="onSubmit">
  79. <view class="flex-y-center border-b">
  80. 模板ID: <input type="text" disabled name="template_id" :value="info.template_id" />
  81. </view>
  82. <!-- <view class="flex-y-center border-b">
  83. 选择类型:<picker mode="selector" :range="printerAddrList" @change="onPrinterAddrChange">
  84. <view :class="[printerAddr?'':'desc-placeholder','input-box']">{{printerAddr || '请选择'}}
  85. </view>
  86. </picker>
  87. </view> -->
  88. <view class="cell flex-y-center border-b box-pack-between">
  89. <view class="title-block required">
  90. <text>选择类型</text>
  91. </view>
  92. <view class="desc ">
  93. <picker mode="selector" :range="printerAddrList" @change="onPrinterAddrChange">
  94. <view class="flex-y-center" :class="[printerAddr?'':'desc-placeholder','input-box']">
  95. {{printerAddr || '请选择'}}
  96. <text class="iconfont icongengduo ft24"></text>
  97. </view>
  98. </picker>
  99. </view>
  100. </view>
  101. <navigator v-if="device_type==1" url="choiceUser" class="flex-y-center border-b box-pack-between">
  102. <view style="min-width: 100rpx;">
  103. 多选用户:
  104. </view>
  105. <view class="flex-y-center">
  106. <view style="word-break: break-all;">
  107. <text v-for="(item,index) of goodStudentType" :key='index'>{{item.id}},</text>
  108. </view>
  109. <text class="iconfont icongengduo ft24"></text>
  110. </view>
  111. </navigator>
  112. <view v-if="device_type==3" class="flex-y-center border-b">
  113. 发放用户: <input type="text" name="login_id" placeholder="输入支付宝用户账号" />
  114. </view>
  115. <view v-if="device_type==2" class="flex-y-center border-b">
  116. <view class="" style="min-width: 100rpx;">
  117. 等级发放:
  118. </view>
  119. <view class="">
  120. <view class="goodsList flex-y-center box-pack-between"
  121. v-for="(item,index) of levelArr" @click="choice(index)" :key='index'>
  122. <view class="flex-center">
  123. <view class="rund flex-center">
  124. <block v-if="item.checked">
  125. <icon type="success_no_circle" size="13"></icon>
  126. </block>
  127. </view>
  128. <text class="ft28">{{item.name}}</text>
  129. </view>
  130. </view>
  131. </view>
  132. </view>
  133. <view class="flex-y-center border-b">
  134. 发放金额: <input name="amount" type="digit" />
  135. </view>
  136. <button formType="submit" class="flex-center ft28">发放</button>
  137. </form>
  138. </view>
  139. </view>
  140. </view>
  141. </template>
  142. <script>
  143. export default {
  144. data() {
  145. return {
  146. info: {},
  147. id: '',
  148. is_enit: false,
  149. URL: getApp().globalData.URL,
  150. is_play: false,
  151. is_model: false,
  152. printerAddrList: ['多选用户发劵', '根据等级发劵', '单选用户发劵', ],
  153. printerAddr: '多选用户发劵',
  154. device_type: 1,
  155. goodStudentType: [],
  156. levelArr: [],
  157. levelSrr:[],
  158. }
  159. },
  160. onLoad(e) {
  161. this.id = e.id;
  162. this.http();
  163. this.getData();
  164. },
  165. onShow(e) {
  166. let goodStudentType = uni.getStorageSync("goodStudentType") || '';
  167. if (goodStudentType.length > 0) {
  168. this.goodStudentType = goodStudentType;
  169. }
  170. },
  171. onUnload() {
  172. uni.removeStorageSync("goodStudentType")
  173. },
  174. onHide() {
  175. uni.removeStorageSync("goodStudentType")
  176. },
  177. methods: {
  178. choice(index) {
  179. this.levelArr[index].checked = !this.levelArr[index].checked;
  180. this.levelSrr = this.levelArr.filter((v, i) => v.checked == true);
  181. },
  182. getData() {
  183. this.request({
  184. url: "Smdcshop/coupon_level",
  185. data: {
  186. admin_id: uni.getStorageSync("admin_id"),
  187. },
  188. }).then(res => {
  189. console.log(res, "res")
  190. if (res.code === '200') {
  191. this.levelArr = res.data;
  192. }
  193. }).catch((res) => {
  194. uni.showToast({
  195. title: res.message,
  196. icon: 'none',
  197. duration: 2000,
  198. success: (res) => {},
  199. })
  200. });
  201. },
  202. onPrinterAddrChange(e) {
  203. this.printerAddr = this.printerAddrList[e.detail.value];
  204. this.device_type = Number(e.detail.value) + 1;
  205. },
  206. bindno() {
  207. this.is_model = false;
  208. },
  209. gg() {
  210. },
  211. http() {
  212. this.request({
  213. url: "Smdcshop/alipaycoupon_info",
  214. data: {
  215. id: this.id,
  216. },
  217. }).then(res => {
  218. console.log(res, "res")
  219. if (res.code === '200') {
  220. this.info = res.data;
  221. }
  222. }).catch((res) => {
  223. uni.showToast({
  224. title: res.message,
  225. icon: 'none',
  226. duration: 2000,
  227. success: (res) => {},
  228. })
  229. });
  230. },
  231. del() {
  232. this.is_model = true;
  233. },
  234. enit() {
  235. let data = {
  236. id: this.id,
  237. admin_id: uni.getStorageSync("admin_id")
  238. }
  239. this.request({
  240. url: "Smdcshop/selectNomoneyTemStatus",
  241. data,
  242. }).then(res => {
  243. console.log(res, "res")
  244. if (res.code === '200') {
  245. uni.showToast({
  246. title: res.message,
  247. icon: 'none',
  248. duration: 1000,
  249. success: (res) => {
  250. setTimeout(() => {
  251. uni.navigateBack();
  252. }, 2e3)
  253. },
  254. })
  255. }
  256. }).catch((res) => {
  257. uni.showToast({
  258. title: res.message,
  259. icon: 'none',
  260. duration: 2000,
  261. success: (res) => {},
  262. })
  263. });
  264. },
  265. onSubmit(e) {
  266. let data = e.detail.value;
  267. data.coupon_type = 2;
  268. data.id = this.id;
  269. data.admin_id = uni.getStorageSync("admin_id");
  270. data.typea=this.device_type;
  271. let arr= this.levelSrr.map(item => item.id);
  272. let goods=this.goodStudentType.map(item => item.user_id);
  273. data.level_id= arr.join(",");
  274. data.user_id= goods.join(",");
  275. this.request({
  276. url: "Smdcshop/fa_alipaycoupon",
  277. data,
  278. }).then(res => {
  279. console.log(res, "res")
  280. if (res.code === '200') {
  281. uni.showToast({
  282. title: res.message,
  283. icon: 'none',
  284. duration: 1000,
  285. success: (res) => {
  286. setTimeout(() => {
  287. this.is_model = false;
  288. }, 2e3)
  289. },
  290. })
  291. }
  292. }).catch((res) => {
  293. uni.showToast({
  294. title: res.message,
  295. icon: 'none',
  296. duration: 2000,
  297. success: (res) => {},
  298. })
  299. });
  300. },
  301. },
  302. }
  303. </script>
  304. <style lang="scss">
  305. page {
  306. background: #F5F7FA;
  307. }
  308. .goodsList {
  309. display: inline-block;
  310. margin-right: 10rpx;
  311. margin-bottom: 10rpx;
  312. }
  313. .rund {
  314. width: 45rpx;
  315. height: 45rpx;
  316. border: 1px solid #ccc;
  317. margin-right: 20rpx;
  318. }
  319. .model {
  320. position: fixed;
  321. top: 0;
  322. left: 0;
  323. background: rgba(0, 0, 0, 0.5);
  324. width: 100%;
  325. height: 100%;
  326. }
  327. .model-home {
  328. background: #FFFFFF;
  329. width: 635rpx;
  330. // height: 700rpx;
  331. padding: 40rpx 30rpx;
  332. border-radius: 10rpx;
  333. font-size: 26rpx;
  334. }
  335. .model-home button {
  336. text-align: center;
  337. width: 80%;
  338. height: 90rpx;
  339. background: linear-gradient(132deg, #3387FF 0%, #3387FF 100%);
  340. box-shadow: 0px 2rpx 12rpx #3387FF;
  341. opacity: 1;
  342. border-radius: 8rpx;
  343. color: #fff;
  344. margin-top: 40rpx;
  345. }
  346. .border-b {
  347. border-bottom: 1rpx solid #F1F1F1;
  348. padding-top: 40rpx;
  349. padding-bottom: 20rpx;
  350. }
  351. .bottom-bar {
  352. position: fixed;
  353. bottom: 0px;
  354. width: 100%;
  355. z-index: 1000;
  356. background: #FFFFFF;
  357. padding: 30rpx 0;
  358. }
  359. .bottom-bar button {
  360. text-align: center;
  361. width: 690rpx;
  362. height: 90rpx;
  363. background: linear-gradient(132deg, #3387FF 0%, #3387FF 100%);
  364. box-shadow: 0px 2rpx 12rpx #3387FF;
  365. opacity: 1;
  366. border-radius: 8rpx;
  367. color: #fff;
  368. }
  369. .home-content {
  370. width: 690rpx;
  371. opacity: 1;
  372. background: #ffffff;
  373. border-radius: 14rpx;
  374. box-shadow: 0rpx 8rpx 16rpx 0rpx rgba(204, 215, 230, 0.08);
  375. margin: 0 auto;
  376. position: relative;
  377. font-size: 28rpx;
  378. padding: 0 24rpx;
  379. margin-top: 30rpx;
  380. .list {
  381. height: 100rpx;
  382. color: #999999;
  383. .list-title {
  384. color: #000000;
  385. font-size: 30rpx;
  386. }
  387. .list-icon {
  388. width: 29rpx;
  389. height: 29rpx;
  390. margin-right: 6rpx;
  391. }
  392. }
  393. .home-content-item {
  394. padding-bottom: 24rpx;
  395. .home-left-name {
  396. opacity: 1;
  397. font-size: 28rpx;
  398. font-family: PingFang SC, PingFang SC-Regular;
  399. font-weight: 400;
  400. text-align: left;
  401. color: #99a0ad;
  402. min-width: 160rpx;
  403. }
  404. .home-left-input {
  405. border: 1rpx solid #ccc;
  406. padding: 10rpx;
  407. word-break: break-all;
  408. flex: 1;
  409. }
  410. }
  411. }
  412. .info-group {
  413. color: #999999;
  414. display: inline-block;
  415. border: 1rpx solid #F1F1F1;
  416. padding: 10rpx 20rpx;
  417. margin: 20rpx 20rpx;
  418. font-size: 30rpx;
  419. border-radius: 4rpx;
  420. }
  421. .video_path {
  422. width: 98%;
  423. display: block;
  424. margin: 0 auto;
  425. }
  426. .code-img {
  427. // display: block;
  428. // width: 200rpx;
  429. // height: 200rpx;
  430. margin: 60rpx auto;
  431. text-align: center;
  432. }
  433. .code-img image {
  434. width: 100rpx;
  435. height: 100rpx;
  436. margin-bottom: 20rpx;
  437. }
  438. .logo {
  439. width: 100rpx;
  440. height: 100rpx;
  441. }
  442. </style>