Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.

order_payment.vue 19KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799
  1. <template>
  2. <navBar title="订单支付" :scrollTop="scrollTop" :orderId="state.orderId" navbgClass="nav-bgXin" fontColor='#fff'>
  3. </navBar>
  4. <navBgCar :activeNum='5'></navBgCar>
  5. <view class="content-value">
  6. <view class="t-card">
  7. <view @click="savaHandle(item)" class="ul-item" v-for="(item, index) in state.dataArray" :key="index">
  8. <image style="width: 100%; height: 146rpx;" :src="`${$imgUrl}issuance/equity-bg.png`"
  9. mode='scaleToFill'>
  10. </image>
  11. <view class="item-value">
  12. <view class="money">
  13. <text class='unit'>¥</text>
  14. <text>{{ item.fee * 0.01 }}</text>
  15. </view>
  16. <view class="content">
  17. <view class="title">
  18. {{ item.payName }}
  19. </view>
  20. </view>
  21. <view class="r-btn">
  22. {{ item.payStatusName }}
  23. </view>
  24. </view>
  25. </view>
  26. </view>
  27. </view>
  28. </template>
  29. <script setup lang="ts">
  30. import { onLoad, onPageScroll,onShow } from "@dcloudio/uni-app";
  31. import { reactive, ref } from "vue";
  32. import {
  33. PAYMENTORDERAPPLY,
  34. aliPayConfigIdTwo,
  35. obtainUserId,
  36. getOpenId, payApply, payQuery,orderQueryDetail
  37. } from "@/utils/network/api.js";
  38. import { request, requestNew } from "@/utils/network/request.js";
  39. import { stringToJson } from "@/utils/network/encryption";
  40. import { fileURL } from "@/datas/fileURL.js";
  41. import navBgCar from "./components/nav-bg-car1";
  42. import navBar from "@/components/nav-bar/nav-bar2.vue";
  43. const imgURL = `${fileURL}image/`;
  44. import { confirm, navTo } from "@/utils/utils";
  45. import {
  46. OrderStatus
  47. } from "@/datas/enum";
  48. import useOrderSkip from "@/composables/order/useOrderSkip";
  49. const { gotoActiveOrder } = useOrderSkip();
  50. import {
  51. setItem
  52. } from "@/utils/storage";
  53. const tools = require("../../static/etcUtil/tools.js");
  54. let imageUrl = ""
  55. let logo
  56. const scrollTop = ref(0); //滚动距离
  57. var counter = 0;
  58. const dingwei=(func)=>{
  59. uni.getLocation({
  60. type: 'gcj02',
  61. success: function (res) {
  62. console.log("经纬福", res)
  63. state.longitude = res.longitude;
  64. state.latitude = res.latitude;
  65. func()
  66. },
  67. fail: function (res) {
  68. console.log("拒绝获取定位失败回调")
  69. // 拒绝获取定位失败回调
  70. state.isclick = true
  71. uni.showModal({
  72. title: '提示',
  73. content: '请手动开启定位权限',
  74. showCancel: false,
  75. success: () => {
  76. uni.openSetting({
  77. success: (settingdata) => {
  78. if (settingdata.authSetting['scope.userLocation']) {
  79. console.log('用户重新授权');
  80. } else {
  81. console.log('用户仍未授权');
  82. }
  83. }
  84. });
  85. }
  86. });
  87. },
  88. })
  89. }
  90. function myFunc() {
  91. counter++;
  92. console.log("====")
  93. if (counter == 2) {
  94. clearInterval(intervalId);
  95. state.isclick = true
  96. console.log("改为true");
  97. }
  98. }
  99. var intervalId = setInterval(myFunc, 2000);
  100. const savaHandle = (val) => {
  101. console.log("val", val, state.isclick)
  102. if (state.isclick) {
  103. if (val.payStatus == "SUCCESS") {
  104. return;
  105. }
  106. state.isclick = false
  107. console.log("state.isclick", state.isclick, val.payStatus)
  108. if(state.xianxia=='1'){
  109. dingwei(function (res) {
  110. payMethods(val)
  111. });
  112. }else{
  113. payMethods(val)
  114. }
  115. }
  116. };
  117. const payMethods=(val)=>{
  118. console.log("val===",val)
  119. if (val.payStatus === 'UNPAY') {
  120. myFunc()
  121. // #ifdef MP-ALIPAY
  122. my.getAuthCode({
  123. scopes: 'auth_base',
  124. success: res => {
  125. const optionsUser = {
  126. type: 2,
  127. data: {
  128. payConfigId: aliPayConfigIdTwo,
  129. code: res.authCode
  130. },
  131. method: "POST",
  132. showLoading: true,
  133. };
  134. console.log('支付宝用户编号请求:', optionsUser)
  135. requestNew(obtainUserId, optionsUser).then((res) => {
  136. console.log('支付宝用户编号返回:', res)
  137. const data = res;
  138. const optionsali = {
  139. type: 2,
  140. data: {
  141. orderId: state.orderId,
  142. wxOpenid: data.openId ? data.openId : data.alipayUserId,
  143. payType: val.payType
  144. },
  145. method: "POST",
  146. showLoading: true,
  147. };
  148. console.log('支付下单请求:', optionsali)
  149. requestNew(PAYMENTORDERAPPLY, optionsali).then((res) => {
  150. const data = res;
  151. console.log('支付下单返回:', data)
  152. my.tradePay({
  153. // 调用统一收单交易创建接口(alipay.trade.create),获得返回字段支付宝交易号 trade_no
  154. tradeNO: data.tranPackage,
  155. success: res => {
  156. console.log("支付成功", res);
  157. refresh();
  158. },
  159. fail: res => {
  160. console.log("支付失败", res);
  161. },
  162. });
  163. },
  164. (err) => {
  165. state.isclick = true
  166. console.log("err")
  167. }
  168. );
  169. });
  170. },
  171. fail: err => {
  172. console.log('my.getAuthCode 调用失败', err)
  173. state.isclick = true
  174. }
  175. });
  176. // #endif
  177. // #ifdef MP-WEIXIN
  178. const options = {
  179. type: 2,
  180. data: {
  181. orderId: state.orderId,
  182. wxOpenId: state.openidData.openid,
  183. payType: val.payType,
  184. longitude: state.longitude, //经度
  185. latitude: state.latitude //纬度
  186. },
  187. method: "POST",
  188. showLoading: true,
  189. };
  190. requestNew(payApply, options).then((res) => {
  191. const data = res;
  192. console.log("data======111", data)
  193. if (data) {
  194. console.log("进来了")
  195. uni.requestPayment({
  196. provider: "wxpay",
  197. orderInfo: "",
  198. timeStamp: data.timestamp,
  199. nonceStr: data.noncestr,
  200. package: data.wxPackage ? data.wxPackage : "",
  201. signType: data.signType,
  202. paySign: data.sign,
  203. success: function (e) {
  204. console.log("支付成功", res);
  205. refresh();
  206. },
  207. fail: function (err) {
  208. state.isclick = true
  209. confirm(err, () => { }, "支付失败", false);
  210. },
  211. });
  212. } else {
  213. state.isclick = true
  214. console.log("state.isclick", state.isclick)
  215. }
  216. },
  217. (err) => {
  218. state.isclick = true
  219. console.log("err")
  220. }
  221. );
  222. // #endif
  223. }
  224. }
  225. const refresh = () => {
  226. state.isclick = true
  227. let source = ""
  228. // #ifdef MP-ALIPAY
  229. source = "ALI"
  230. // #endif
  231. // #ifdef MP-WEIXIN
  232. source = "WECHAT"
  233. // #endif
  234. var data = {
  235. orderId: state.orderId,
  236. wxOpenId: state.openidData.openid,
  237. };
  238. const options = {
  239. type: 2,
  240. data: data,
  241. method: "POST",
  242. showLoading: true,
  243. };
  244. console.log("输出内容", options);
  245. requestNew(payQuery, options).then((res) => {
  246. console.log("res====", res)
  247. const data = res;
  248. console.log(data);
  249. if (data.paymentStatus == 'ALLSUCCESS') {
  250. gotoEditUserOrUnitInfo()
  251. }
  252. state.dataArray = data.datas;
  253. for (let i = 0; i < state.dataArray.length; i++) {
  254. if (state.dataArray[i].payType === 'HANDLE') {
  255. state.dataArray[i].payName = '权益金'
  256. } else if (state.dataArray[i].payType === 'MARGIN') {
  257. state.dataArray[i].payName = '保证金'
  258. } else if (state.dataArray[i].payType === 'PRESTORE') {
  259. state.dataArray[i].payName = '预存金'
  260. } else if (state.dataArray[i].payType === 'EQUITY') {
  261. state.dataArray[i].payName = '权益费'
  262. } else if (state.dataArray[i].payType === 'REPAIROBU') {
  263. state.dataArray[i].payName = '增补obu'
  264. } else if (state.dataArray[i].payType === 'CHANGECARD') {
  265. state.dataArray[i].payName = '更换卡'
  266. } else if (state.dataArray[i].payType === 'CHANGEOBU') {
  267. state.dataArray[i].payName = '更换签'
  268. } else if (state.dataArray[i].payType === 'CHANGEALL') {
  269. state.dataArray[i].payName = '更换卡签'
  270. } else {
  271. state.dataArray[i].payName = '未知费'
  272. }
  273. if (state.dataArray[i].payStatus === 'SUCCESS') {
  274. state.dataArray[i].payStatusName = '已支付'
  275. } else if (state.dataArray[i].payStatus === 'PAYING') {
  276. state.dataArray[i].payStatusName = '支付中'
  277. } else if (state.dataArray[i].payStatus === 'FAILED') {
  278. state.dataArray[i].payStatusName = '支付失败'
  279. } else if (state.dataArray[i].payStatus === 'UNPAY') {
  280. state.dataArray[i].payStatusName = '未支付'
  281. } else if (state.dataArray[i].payStatus === 'CLOSED') {
  282. state.dataArray[i].payStatusName = '已关闭'
  283. } else if (state.dataArray[i].payStatus === 'CANCELED') {
  284. state.dataArray[i].payStatusName = '已撤销'
  285. } else if (state.dataArray[i].payStatus === 'REFUND') {
  286. state.dataArray[i].payStatusName = '转入退费'
  287. } else {
  288. state.dataArray[i].payStatusName = '未知'
  289. }
  290. }
  291. console.log("state.dataArray", state.dataArray)
  292. });
  293. }
  294. onShow(()=>{
  295. if(state.continue=1){
  296. orderDetail(state.orderId)
  297. }
  298. })
  299. // 车辆详情
  300. const orderDetail = (orderNo) => {
  301. const options = {
  302. type: 2,
  303. data: {
  304. orderNo
  305. },
  306. method: "POST",
  307. showLoading: true,
  308. };
  309. requestNew(orderQueryDetail, options).then((res) => {
  310. console.log("orderQueryDetail", res)
  311. if (res['orderStep'] == OrderStatus['待激活']) {
  312. // 待激活
  313. gotoActiveOrder(res)
  314. }
  315. })
  316. }
  317. onLoad((option : any) => {
  318. console.log("传递过来的到支付页面", option)
  319. state.orderId = option.orderId;
  320. state.isValueCard = option.isValueCard;
  321. state.vehicleId = option.vehicleId;
  322. state.orderQuery = option.orderQuery;
  323. state.qdSignUrl = option.qdSignUrl;
  324. state.qdSignAppId = option.qdSignAppId;
  325. state.qtSign = option.qtSign;
  326. state.xianxia = option.xianxia;
  327. // #ifdef MP-WEIXIN
  328. uni.login({
  329. provider: "weixin",
  330. success: function (e) {
  331. const options1 = {
  332. type: 2,
  333. data: {
  334. "jsCode": e.code
  335. },
  336. method: "POST",
  337. showLoading: true,
  338. };
  339. requestNew(getOpenId, options1).then((res) => {
  340. const result = res;
  341. state.openidData = stringToJson(result.data);
  342. refreshFirst()
  343. })
  344. },
  345. })
  346. // #endif
  347. // #ifdef MP-ALIPAY
  348. refreshFirst()
  349. // #endif
  350. });
  351. const refreshFirst = () => {
  352. let source = ""
  353. // #ifdef MP-ALIPAY
  354. imageUrl = imgURL + "applyCard/alibaba.png";
  355. source = "ALI"
  356. // #endif
  357. // #ifdef MP-WEIXIN
  358. imageUrl = imgURL + "applyCard/wechat.png";
  359. source = "WECHAT"
  360. // #endif
  361. var data = {
  362. orderId: state.orderId,
  363. wxOpenId: state.openidData.openid,
  364. };
  365. const options = {
  366. type: 2,
  367. data: data,
  368. method: "POST",
  369. showLoading: true,
  370. };
  371. console.log("输出内容", options);
  372. requestNew(payQuery, options).then((res) => {
  373. const data = res;
  374. console.log(data);
  375. if (data.paymentStatus == 'ALLSUCCESS') {
  376. // isValueCard 1 储值卡 2 记账卡
  377. if (state.orderQuery == '1') {
  378. console.log("state.qtSign",state.qtSign,state.qtSign=='0')
  379. if(state.qtSign=='0'){
  380. if(state.qdSignAppId){
  381. uni.navigateToMiniProgram({
  382. appId: state.qdSignAppId,
  383. path: state.qdSignUrl,
  384. extraData: {},
  385. envVersion:'trial',
  386. success(res) {
  387. state.continue=1
  388. console.log(res);
  389. },
  390. complete(res) {
  391. console.log(res);
  392. },
  393. fail(res) {
  394. console.log(res);
  395. // 未成功跳转到车主小程序
  396. },
  397. });
  398. }else{
  399. const params = encodeURIComponent(JSON.stringify(state.qdSignUrl))
  400. tools.toUrl(`/subpackage/personal-center/webview?url=` + params)
  401. }
  402. }else{
  403. // 签约
  404. navTo(
  405. `/subpackage/orders/release-products?orderId=${state.orderId}&orderQuery=${state.orderQuery}`,
  406. );
  407. }
  408. }else{
  409. if (state.isValueCard == 1) {
  410. // 不签约
  411. uni.switchTab({
  412. url: "/pages/order/order"
  413. })
  414. } else {
  415. // 签约
  416. navTo(
  417. `/subpackage/orders/release-products?orderId=${state.orderId}&orderQuery=${state.orderQuery}`,
  418. );
  419. }
  420. }
  421. }
  422. state.dataArray = data.datas;
  423. for (let i = 0; i < state.dataArray.length; i++) {
  424. if (state.dataArray[i].payType === 'HANDLE') {
  425. state.dataArray[i].payName = '权益金'
  426. } else if (state.dataArray[i].payType === 'MARGIN') {
  427. state.dataArray[i].payName = '保证金'
  428. } else if (state.dataArray[i].payType === 'PRESTORE') {
  429. state.dataArray[i].payName = '预存金'
  430. } else if (state.dataArray[i].payType === 'EQUITY') {
  431. state.dataArray[i].payName = '权益费'
  432. } else if (state.dataArray[i].payType === 'REPAIROBU') {
  433. state.dataArray[i].payName = '增补obu'
  434. } else if (state.dataArray[i].payType === 'CHANGECARD') {
  435. state.dataArray[i].payName = '更换卡'
  436. } else if (state.dataArray[i].payType === 'CHANGEOBU') {
  437. state.dataArray[i].payName = '更换签'
  438. } else if (state.dataArray[i].payType === 'CHANGEALL') {
  439. state.dataArray[i].payName = '更换卡签'
  440. } else {
  441. state.dataArray[i].payName = '未知费'
  442. }
  443. if (state.dataArray[i].payStatus === 'SUCCESS') {
  444. state.dataArray[i].payStatusName = '已支付'
  445. } else if (state.dataArray[i].payStatus === 'PAYING') {
  446. state.dataArray[i].payStatusName = '支付中'
  447. } else if (state.dataArray[i].payStatus === 'FAILED') {
  448. state.dataArray[i].payStatusName = '支付失败'
  449. } else if (state.dataArray[i].payStatus === 'UNPAY') {
  450. state.dataArray[i].payStatusName = '未支付'
  451. } else if (state.dataArray[i].payStatus === 'CLOSED') {
  452. state.dataArray[i].payStatusName = '已关闭'
  453. } else if (state.dataArray[i].payStatus === 'CANCELED') {
  454. state.dataArray[i].payStatusName = '已撤销'
  455. } else if (state.dataArray[i].payStatus === 'REFUND') {
  456. state.dataArray[i].payStatusName = '转入退费'
  457. } else {
  458. state.dataArray[i].payStatusName = '未知'
  459. }
  460. }
  461. console.log("state.dataArray", state.dataArray)
  462. });
  463. }
  464. //解析URL获取参数
  465. const getRequest = (urlStr) => {
  466. if (typeof urlStr == "undefined") {
  467. // 获取url中"?"符后的字符串
  468. var url = decodeURI(location.search);
  469. } else {
  470. var url = "?" + urlStr.split("?")[1];
  471. }
  472. var theRequest = new Object();
  473. if (url.indexOf("?") != -1) {
  474. var str = url.substr(1);
  475. var strs = str.split("&");
  476. for (var i = 0; i < strs.length; i++) {
  477. theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
  478. }
  479. }
  480. return theRequest;
  481. };
  482. //监听页面滚动
  483. onPageScroll((e) => {
  484. scrollTop.value = e.scrollTop;
  485. });
  486. // isValueCard 1 储值卡 2 记账卡
  487. const gotoEditUserOrUnitInfo = () => {
  488. if (state.orderQuery == '1') {
  489. if(state.qtSign=='0'){
  490. if(state.qdSignAppId){
  491. uni.navigateToMiniProgram({
  492. appId: state.qdSignAppId,
  493. path: state.qdSignUrl,
  494. extraData: {},
  495. envVersion:'trial',
  496. success(res) {
  497. state.continue=1
  498. console.log(res);
  499. },
  500. complete(res) {
  501. console.log(res);
  502. },
  503. fail(res) {
  504. console.log(res);
  505. // 未成功跳转到车主小程序
  506. },
  507. });
  508. }else{
  509. const params = encodeURIComponent(JSON.stringify(state.qdSignUrl))
  510. tools.toUrl(`/subpackage/personal-center/webview?url=` + params)
  511. }
  512. }else{
  513. // 签约
  514. navTo(
  515. `/subpackage/orders/release-products?orderId=${state.orderId}&orderQuery=${state.orderQuery}`,
  516. );
  517. }
  518. }else{
  519. if (state.isValueCard == 1) {
  520. // 不签约
  521. uni.switchTab({
  522. url: "/pages/order/order"
  523. })
  524. } else {
  525. // 签约
  526. navTo(
  527. `/subpackage/orders/release-products?orderId=${state.orderId}&orderQuery=${state.orderQuery}`,
  528. );
  529. }
  530. }
  531. }
  532. const state = reactive({
  533. isValueCard: 1, //卡的类型
  534. radiolist1: [], //选择卡的数据列表
  535. choiceCardShow: false, //选择卡的弹出框
  536. isSign: '',
  537. id: "",
  538. orderId: "",
  539. userType: 1, //1 个人 2单位
  540. type: 0, //0 客车 1货车
  541. vehiclePlateColor: "",
  542. data: {
  543. show: false,
  544. src: imgURL + "applyCard/edit.png",
  545. },
  546. dataArray: [],
  547. list: [
  548. {
  549. bg: imgURL + "applyCard/product-bg.png",
  550. icon: imgURL + "applyCard/wechat.png",
  551. title: "【货车】微信车主服务",
  552. tip: "绑定微信支付,无需绑定银行卡",
  553. },
  554. ],
  555. openid: "",
  556. isclick: true,//防止重复点击
  557. vehicleId: "",
  558. orderQuery: "0",
  559. longitude: "",
  560. latitude: "",
  561. openidData: {},
  562. qdSignUrl:"",
  563. qdSignAppId:"",
  564. qtSign:"",
  565. continue:0,//继续执行,不需要点击
  566. xianxia:"",//线下订单 1
  567. });
  568. </script>
  569. <style lang="scss" scoped>
  570. ::v-deep .u-radio {
  571. display: flex !important;
  572. align-items: center !important;
  573. float: none !important;
  574. }
  575. ::v-deep .u-icon__icon {
  576. top: -4px !important;
  577. }
  578. .bottomTip {
  579. margin-top: 100rpx;
  580. text-align: center;
  581. font-size: 28rpx;
  582. font-family: Microsoft YaHei;
  583. font-weight: 400;
  584. color: #b3b3b3;
  585. }
  586. .content-value {
  587. position: absolute;
  588. top: 370rpx;
  589. width: 100%;
  590. min-height: calc(100% - 370rpx);
  591. box-sizing: border-box;
  592. padding: 0 30rpx 210rpx;
  593. .t-card {
  594. background-color: #fff;
  595. padding: 40rpx 30rpx;
  596. border-radius: 12rpx;
  597. }
  598. .img-pos {
  599. position: absolute;
  600. left: 500rpx;
  601. top: -38rpx;
  602. right: 50rpx;
  603. .img-flex {
  604. display: flex;
  605. justify-content: space-between;
  606. align-items: center;
  607. .car-img {
  608. width: 86rpx;
  609. height: 42rpx;
  610. }
  611. .flag-img {
  612. width: 30rpx;
  613. height: 35rpx;
  614. }
  615. }
  616. }
  617. }
  618. .flex {
  619. display: flex;
  620. align-items: center;
  621. }
  622. .action {
  623. margin-top: 30rpx;
  624. padding-left: 20rpx;
  625. padding-right: 20rpx;
  626. padding-bottom: 30rpx;
  627. .button {
  628. height: 80rpx;
  629. background: linear-gradient(-90deg, #43a1e0 0%, #13e7c1 100%);
  630. border-radius: 40rpx;
  631. font-size: 32rpx;
  632. font-weight: 400;
  633. color: #ffffff;
  634. line-height: 80rpx;
  635. }
  636. }
  637. .action-btn {
  638. margin-left: 45rpx;
  639. width: 121rpx;
  640. height: 61rpx;
  641. border: 1px solid rgba(255, 255, 255, 1);
  642. border-radius: 30rpx;
  643. background: rgba(255, 255, 255, 0.2);
  644. text-align: center;
  645. font-size: 30rpx;
  646. font-family: Microsoft YaHei;
  647. font-weight: 400;
  648. color: #ffffff;
  649. line-height: 61rpx;
  650. }
  651. .tag1 {
  652. padding: 5rpx;
  653. background: rgba(0, 179, 139, 0.5);
  654. border-radius: 6rpx;
  655. font-size: 22rpx;
  656. font-family: Microsoft YaHei;
  657. font-weight: 400;
  658. color: #ffffff;
  659. }
  660. .tag3 {
  661. padding: 5rpx;
  662. background: rgba(139, 112, 228, 0.5);
  663. border-radius: 6rpx;
  664. font-size: 22rpx;
  665. font-family: Microsoft YaHei;
  666. font-weight: 400;
  667. color: #ffffff;
  668. }
  669. .tag2 {
  670. padding: 5rpx;
  671. background: rgba(249, 97, 60, 0.5);
  672. border-radius: 6rpx;
  673. font-size: 22rpx;
  674. font-family: Microsoft YaHei;
  675. font-weight: 400;
  676. color: #ffffff;
  677. }
  678. .ul-item {
  679. display: flex;
  680. align-items: center;
  681. &:nth-child(n+2) {
  682. margin-top: 30rpx;
  683. }
  684. .item-value {
  685. padding: 20rpx;
  686. position: absolute;
  687. display: flex;
  688. align-items: center;
  689. width: 81%;
  690. box-sizing: border-box;
  691. height: 146rpx;
  692. .money {
  693. color: #fff;
  694. font-size: 46rpx;
  695. font-family: SourceHanSansCN, SourceHanSansCN;
  696. font-weight: 400;
  697. flex: 1;
  698. .unit {
  699. font-size: 29rpx;
  700. margin-right: 2rpx;
  701. }
  702. }
  703. .content {
  704. margin-left: 60rpx;
  705. flex: 2;
  706. .title {
  707. font-weight: 400;
  708. font-family: SourceHanSansCN, SourceHanSansCN;
  709. font-size: 36rpx;
  710. color: #2C3246;
  711. }
  712. }
  713. .r-btn {
  714. width: 139rpx;
  715. height: 65rpx;
  716. background: radial-gradient(at 0% 0%, #C6B077 0%, #DFCC96 100%);
  717. border-radius: 33rpx;
  718. font-family: SourceHanSansCN, SourceHanSansCN;
  719. font-weight: 400;
  720. font-size: 26rpx;
  721. color: #FFFFFF;
  722. line-height: 65rpx;
  723. text-align: center;
  724. flex: 1;
  725. }
  726. }
  727. .icon-tip {
  728. width: 100rpx;
  729. height: 100rpx;
  730. }
  731. }
  732. ::v-deep .u-mode-center-box {
  733. border-radius: 10rpx;
  734. }
  735. .squire {
  736. padding: 30rpx 30rpx 50rpx 50rpx;
  737. }
  738. .mask-close {
  739. text-align: right;
  740. }
  741. .icon-closed {
  742. width: 48rpx;
  743. height: 48rpx;
  744. }
  745. .mask-title {
  746. text-align: center;
  747. font-size: 32rpx;
  748. color: $uni-text-color-black;
  749. margin-bottom: 50rpx;
  750. }
  751. </style>