您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

interestsList.vue 6.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. <template>
  2. <view class="content" style="padding-top: 12rpx;overflow: hidden;">
  3. <view @click="addInterestsList(item)" class="ul-item" v-for="(item, index) in state.list" :key="index">
  4. <image style="width: 100%; height: 170rpx; border-radius: 20rpx"
  5. :src="`${$imgUrl}applyCard/product-bg.png`"></image>
  6. <view class="item-value">
  7. <image class="icon-tip"
  8. :src="state.sysType === 'WECHAT'?`${$imgUrl}applyCard/wechat.png` : `${$imgUrl}applyCard/alibaba.png`">
  9. </image>
  10. <view class="content">
  11. <view class="title">
  12. {{ item.productName }}
  13. </view>
  14. </view>
  15. <view class="money">
  16. ¥:{{ item.discountPrice * 0.01 }}
  17. </view>
  18. </view>
  19. </view>
  20. </view>
  21. </template>
  22. <script setup lang="ts">
  23. import { onLoad, onShow } from "@dcloudio/uni-app";
  24. import { reactive } from "vue";
  25. import { equityProductsApi } from "@/utils/network/api.js";
  26. import { stringToJson } from "@/utils/network/encryption";
  27. import { request } from "@/utils/network/request";
  28. import { fileURL } from "@/datas/fileURL.js";
  29. import navBar from "@/components/nav-bar/nav-bar2.vue";
  30. import navBgCar from "./components/nav-bg-car4";
  31. import { msg, navTo } from "@/utils/utils";
  32. import {
  33. checkOrderStatus,
  34. wechatAppID,
  35. wechatPayConfigId,
  36. wechatSecret,
  37. addProduct,
  38. queryDetails,
  39. getOpenidApi
  40. } from "@/utils/network/api";
  41. import {
  42. getItem,
  43. StorageKeys,
  44. setItem
  45. } from "@/utils/storage";
  46. const imgURL = `${fileURL}image/`;
  47. const state = reactive({
  48. openid: "",
  49. id: "",
  50. clientFee: "",
  51. list: [], //权益数据
  52. choiceValue: [], //选择的权益数据的下标
  53. choiceValueComplete: [], //选择的权益数据的具体数据
  54. isValueCard: "",
  55. type: 0,
  56. userType: 0,
  57. promoteId: "", //产品id
  58. totalAmount: 0, //产品+权益产品金额
  59. changeCardType: "",//储值卡转记账卡选权益产品
  60. applyId: "",
  61. orderId: "",
  62. sysType: ""
  63. })
  64. onLoad((option : any) => {
  65. // #ifdef MP-ALIPAY
  66. state.sysType = 'ALI';
  67. // #endif
  68. // #ifdef MP-WEIXIN
  69. state.sysType = 'WECHAT';
  70. // #endif
  71. console.log("promoteId", option)
  72. state.clientFee = option.clientFee;
  73. state.userType = option.userType;
  74. state.type = option.type;
  75. state.isValueCard = option.isValueCard;
  76. state.promoteId = option.promoteId;
  77. state.totalAmount = option.fee;
  78. // 储值卡转记账卡传过来的参数
  79. state.changeCardType = option.changeCardType;
  80. state.applyId = option.applyId;
  81. state.orderId = option.orderId;
  82. getList();
  83. getOpenID();
  84. console.log("option", option)
  85. })
  86. const addInterestsList = (item) => {
  87. console.log("item", item)
  88. state.totalAmount = Number(state.totalAmount) + Number(item.discountPrice)
  89. if (state.changeCardType == "1") {
  90. navTo(
  91. `/subpackage/after-sale/to-bookkeeping-card/mailing_information?orderId=${state.orderId}&&applyId=${state.applyId}&&productId=${state.promoteId}&&totalAmount=${state.totalAmount}&&equityId=${item.equityId}`
  92. )
  93. } else {
  94. // 正常流程
  95. uni.redirectTo({
  96. url: `/subpackage/orders/essential-information?promoteId=${getItem("promoteId")}&userType=${state.userType}&type=${state.type}&isValueCard=${state.isValueCard}&totalAmount=${state.totalAmount}&equityId=${item.equityId}`,
  97. });
  98. }
  99. }
  100. const getList = () => {
  101. const options = {
  102. type: 2,
  103. data: {
  104. "promoteId": state.promoteId,
  105. },
  106. method: 'POST',
  107. showLoading: true,
  108. }
  109. request(equityProductsApi, options).then((res) => {
  110. const data = stringToJson(res.bizContent);
  111. for (var i = 0; i < data.data.length; i++) {
  112. data.data[i]['isShow'] = false;
  113. }
  114. state.list = data.data
  115. console.log("222", data.data)
  116. })
  117. }
  118. const change = (e) => {
  119. console.log(e);
  120. }
  121. //获取微信小程序openid
  122. const getOpenID = () => {
  123. // #ifdef MP-WEIXIN
  124. uni.login({
  125. provider: "weixin",
  126. success: function (e) {
  127. console.log(e);
  128. getOpenid(e.code);
  129. },
  130. });
  131. //#endif
  132. };
  133. const getOpenid = (code) => {
  134. const options = {
  135. type: 2,
  136. data: {
  137. "jsCode": code
  138. },
  139. method: "POST",
  140. showLoading: true,
  141. };
  142. // #ifdef MP-WEIXIN
  143. request(getOpenidApi, options).then((res) => {
  144. const result = stringToJson(res.bizContent);
  145. console.log("获取微信小程序openid", result);
  146. const openidData = stringToJson(result.data);
  147. state.openid = openidData.openid;
  148. setItem("QYorder", state);
  149. });
  150. // #endif
  151. }
  152. const changeIsShow = (index) => {
  153. console.log(index, state.list[index]['isShow'], !state.list[index]['isShow'])
  154. state.list[index]['isShow'] = !state.list[index]['isShow']
  155. console.log("state.list", state.list)
  156. }
  157. const getValue = (value) => {
  158. if (state.choiceValue.length == 0) {
  159. console.log("第一次")
  160. state.choiceValue.push(value)
  161. console.log("state.choiceValue", state.choiceValue)
  162. } else {
  163. var index = state.choiceValue.indexOf(value);
  164. if (index > -1) {//大于0 代表存在,
  165. state.choiceValue.splice(index, 1);//存在就删除
  166. } else {
  167. state.choiceValue.push(value)
  168. }
  169. console.log("state.choiceValue", state.choiceValue)
  170. }
  171. }
  172. </script>
  173. <style scoped lang="scss">
  174. .imageDefault {
  175. height: 40rpx;
  176. width: 40rpx;
  177. transform: rotate(270deg);
  178. margin-right: 12rpx;
  179. color: white;
  180. }
  181. .imageChange {
  182. height: 40rpx;
  183. width: 40rpx;
  184. transform: rotate(90deg);
  185. margin-right: 12rpx;
  186. color: white;
  187. }
  188. .item {
  189. width: 90%;
  190. margin: 20rpx auto;
  191. background-color: rgb(41, 199, 207);
  192. border-radius: 20rpx;
  193. padding: 20rpx;
  194. box-sizing: border-box;
  195. color: white;
  196. font-size: 32rpx;
  197. }
  198. .item>.title {
  199. width: 100%;
  200. display: flex;
  201. justify-content: space-between;
  202. align-items: center;
  203. }
  204. .children {
  205. margin-left: 50rpx;
  206. margin-top: 16rpx;
  207. }
  208. .children>view {
  209. height: 50rpx;
  210. line-height: 50rpx;
  211. }
  212. .show {
  213. display: inline-block;
  214. }
  215. .hide {
  216. display: none;
  217. }
  218. .ul-item {
  219. padding: 5px 20rpx;
  220. display: flex;
  221. align-items: center;
  222. .item-value {
  223. padding: 20rpx;
  224. position: absolute;
  225. display: flex;
  226. align-items: center;
  227. width: 80%;
  228. .content {
  229. width: 51%;
  230. .title {
  231. font-size: 32rpx;
  232. font-family: Microsoft YaHei;
  233. font-weight: 400;
  234. color: #ffffff;
  235. }
  236. .tip {
  237. font-size: 24rpx;
  238. font-family: Microsoft YaHei;
  239. font-weight: 400;
  240. color: #ffffff;
  241. }
  242. }
  243. }
  244. .icon-tip {
  245. width: 100rpx;
  246. height: 100rpx;
  247. }
  248. .content {
  249. margin-left: 40rpx;
  250. }
  251. }
  252. .money {
  253. color: white;
  254. }
  255. </style>