index.vue 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992
  1. <template>
  2. <view>
  3. <view class="wrap">
  4. <view class='title'>收购业务管理</view>
  5. <view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
  6. <view class="cu-item" v-for="(item,index) in gridList" :key="index" @click="gridClick(item, index)"
  7. v-if="index<gridCol*2 && item.show">
  8. <view :class="['cuIcon-' + item.cuIcon,'text-' + item.color]">
  9. <image :src="item.src" class="sign"></image>
  10. </view>
  11. <text>{{item.name}}</text>
  12. </view>
  13. </view>
  14. <!-- 检斤员权限 -->
  15. <!-- isShowAcquisitionInfo -->
  16. <!-- 获取当前用户负责的仓库,如果无仓库隐藏收购信息 -->
  17. <view class="content2">
  18. <view>收购信息</view>
  19. <view @click="navTo('/pages/erpbusiness/acquisitionInformation?status='+status+'&id='+sgId)">{{status}}></view>
  20. </view>
  21. </view>
  22. <!-- <view class="wrap">
  23. <view class='title'>出库管理</view>
  24. <view class="cu-list grid" :class="['col-' + gridCol,gridBorder?'':'no-border']">
  25. <view class="cu-item" v-for="(item,index) in gridList1" :key="index" @click="gridClick(item, index)"
  26. v-if="index<gridCol*2">
  27. <view :class="['cuIcon-' + item.cuIcon,'text-' + item.color]">
  28. <image :src="item.src" class="sign"></image>
  29. </view>
  30. <text>{{item.name}}</text>
  31. </view>
  32. </view>
  33. </view> -->
  34. <u-modal v-model="isShowAlert" :title-style="{fontSize: '18px',fontWeight:'500'}"
  35. :content-style="{fontSize: '14px',fontWeight:'400'}" confirm-color='#22C572' confirm-text='确定' title='温馨提示'
  36. showCancelButton='false' :content="content" @confirm="goOpenService" @cancel="cancelClick"></u-modal>
  37. <u-modal v-model="isShowAlert1" :title-style="{fontSize: '18px',fontWeight:'500'}"
  38. :content-style="{fontSize: '14px',fontWeight:'400'}" confirm-color='#22C572' confirm-text='确定' title='登录提示'
  39. showCancelButton='false' :content="content1" @confirm="alertBtn1" @cancel="cancelClick1"></u-modal>
  40. </view>
  41. </template>
  42. <script>
  43. import dragButton from "@/components/drag-button/drag-button.vue";
  44. import {
  45. mapState
  46. } from 'vuex';
  47. let startY = 0,
  48. moveY = 0,
  49. pageAtTop = true;
  50. export default {
  51. components: {
  52. dragButton
  53. },
  54. data() {
  55. return {
  56. status:'',
  57. isShowAlert1: false,
  58. content1: '当前登入信息验证失败,是否重新登录?',
  59. isShowAlert: false,
  60. content: '您确定要退出吗?',
  61. a: false,
  62. inputShow: false,
  63. modalName: '',
  64. mycarStyle: '',
  65. feild: undefined,
  66. inputContent: '',
  67. coverTransform: 'translateY(0px)',
  68. coverTransition: '0s',
  69. moving: false,
  70. footprintList: [],
  71. isVip: false,
  72. userInfoTmp: [],
  73. inputStatus: 'none',
  74. carInfo: [],
  75. gridCol: 4,
  76. gridBorder: false,
  77. headUrl: "../../static/img/myimg/YongHu@3x.png",
  78. userphone: "",
  79. username: "请更改昵称",
  80. gridList: [{
  81. num: 0,
  82. name: '邀请用户',
  83. // icon: 'cuIcon-apps',
  84. src: '../../static/img/erp/yaoqingyonghu@3x.png',
  85. tips: 0,
  86. url: '/pages/erpbusiness/QRCode/QRCode',
  87. show: true
  88. },
  89. {
  90. num: 1,
  91. name: '收购质检',
  92. // icon: 'cuIcon-calendar',
  93. src: '../../static/img/erp/shougouzhijian@3x.png',
  94. tips: 0,
  95. url: '/pages/erpbusiness/quality_testing?managementType=1',
  96. show: true
  97. },
  98. {
  99. num: 2,
  100. name: '收购检斤',
  101. // icon: 'cuIcon-copy',
  102. src: '../../static/img/erp/shougoujianjin@3x.png',
  103. tips: 0,
  104. url: '/pages/erpbusiness/acquisitionInspection/acquisitionInspection',
  105. show: true
  106. }
  107. // {
  108. // num: 5,
  109. // name: '设置',
  110. // // icon: 'cuIcon-edit',
  111. // src:'../../static/img/sign/shezhi@2x.png',
  112. // tips: 0,
  113. // url: `/pages/user/setUp`,
  114. // show: true
  115. // }
  116. ],
  117. gridList1: [
  118. // {
  119. // num: 0,
  120. // name: '出库检斤',
  121. // // icon: 'cuIcon-apps',
  122. // src:'../../static/img/erp/chukujianjin@3x.png',
  123. // tips: 0,
  124. // url: '/pages/erpbusiness/acquisitionInspection/warehouseWeighing',
  125. // show: false
  126. // },
  127. {
  128. num: 1,
  129. name: '出库质检',
  130. // icon: 'cuIcon-calendar',
  131. src: '../../static/img/erp/chukuzhijian@3x.png',
  132. tips: 0,
  133. url: '/pages/erpbusiness/quality_testing?managementType=3',
  134. show: true
  135. }
  136. // {
  137. // num: 5,
  138. // name: '设置',
  139. // // icon: 'cuIcon-edit',
  140. // src:'../../static/img/sign/shezhi@2x.png',
  141. // tips: 0,
  142. // url: `/pages/user/setUp`,
  143. // show: true
  144. // }
  145. ],
  146. showTran: true,
  147. companyId: 1,
  148. current: 4,
  149. sgId:''
  150. }
  151. },
  152. onLoad() {
  153. },
  154. // #ifndef MP
  155. onNavigationBarButtonTap(e) {
  156. const index = e.index;
  157. if (index === 0) {
  158. this.navTo('/pages/set/set');
  159. } else if (index === 1) {
  160. // #ifdef APP-PLUS
  161. const pages = getCurrentPages();
  162. const page = pages[pages.length - 1];
  163. const currentWebview = page.$getAppWebview();
  164. currentWebview.hideTitleNViewButtonRedDot({
  165. index
  166. });
  167. // #endif
  168. uni.navigateTo({
  169. url: '/pages/notice/notice'
  170. })
  171. }
  172. },
  173. // #endif
  174. computed: {
  175. ...mapState(['hasLogin', 'userInfo']),
  176. // 手机号中间4位加*
  177. starUserphone() {
  178. let reg = /^(\d{3})\d{4}(\d{4})$/;
  179. if (this.userphone) {
  180. return this.userphone.replace(reg, "$1****$2");
  181. }
  182. }
  183. },
  184. onShow() {
  185. this.isShow();
  186. uni.hideKeyboard()
  187. uni.showTabBar()
  188. this.loadData()
  189. this.isShowAcquisitionInfo=this.utils.getRoles('acquisitionInfor.view')
  190. this.getStatus()
  191. this.$api.doRequest('get', '/commonUser/api/checkSession').then(res => {
  192. console.log("checkSession", res)
  193. if (res.data.data == "INVALID") {
  194. this.isShowAlert1 = true;
  195. // uni.showModal({
  196. // title: '登录提示',
  197. // content: '当前登入信息验证失败,是否重新登录?',
  198. // showCancel: true,
  199. // confirmText: '登录',
  200. // success: (e) => {
  201. // if (e.confirm) {
  202. // uni.navigateTo({
  203. // url: '/pages/public/login'
  204. // })
  205. // }
  206. // },
  207. // fail: () => {},
  208. // complete: () => {}
  209. // })
  210. }
  211. })
  212. console.log("hasLogin", this.hasLogin)
  213. if (this.userInfo) {
  214. if (!this.userInfo.avatarUrl) {
  215. this.headUrl = "../../static/img/myimg/YongHu@3x.png"
  216. } else {
  217. this.headUrl = this.userInfo.avatarUrl
  218. }
  219. this.username = this.userInfo.userName
  220. this.userphone = this.userInfo.phone
  221. var that = this
  222. this.$api.doRequest('get', '/notice/query/noticeNumber').then(res => {
  223. console.log("noticeNumber", res)
  224. if (res.data.data) {
  225. let name = 'myTip';
  226. let value = res.data.data.task;
  227. that.$store.commit('$uStore', {
  228. name,
  229. value
  230. });
  231. if (value != 0 && value) {
  232. uni.setTabBarBadge({
  233. index: 4,
  234. text: value + ""
  235. })
  236. }
  237. name = 'taskTip';
  238. value = res.data.data.task;
  239. that.$store.commit('$uStore', {
  240. name,
  241. value
  242. });
  243. // name = 'contractTip';
  244. // value = res.data.data.contractTip;
  245. // that.$store.commit('$uStore', {
  246. // name,
  247. // value
  248. // });
  249. }
  250. })
  251. } else {
  252. this.headUrl = "../../static/img/myimg/YongHu@3x.png"
  253. this.username = "立即登录"
  254. }
  255. console.log("this.userInfo", this.userInfo)
  256. },
  257. methods: {
  258. getStatus(){
  259. let _obj = {
  260. commonId:uni.getStorageSync("userInfo").id,
  261. }
  262. this.$api.doRequest('get', '/acquisitionInfo/getInfo',_obj ).then(res => {
  263. if (res.data.code == 200) {
  264. if(res.data.data){
  265. this.status = res.data.data.status
  266. this.sgId = res.data.data.commonId
  267. }else{
  268. this.status = '已隐藏'
  269. }
  270. }
  271. })
  272. },
  273. alertBtn1() {
  274. uni.navigateTo({
  275. url: '/pages/public/login'
  276. })
  277. },
  278. cancelClick() {
  279. this.isShowAlert = false
  280. },
  281. cancelClick1() {
  282. this.isShowAlert = false
  283. },
  284. goOpenService() {
  285. uni.hideTabBarRedDot({
  286. index: 3
  287. })
  288. uni.clearStorageSync();
  289. this.$store.commit('logout')
  290. this.$api.logout()
  291. uni.navigateTo({
  292. url: `/pages/public/login`
  293. })
  294. },
  295. getRoles: function(role) {
  296. let _roles = uni.getStorageSync('rolesList')
  297. for (let i = 0; i < _roles.length; i++) {
  298. if (_roles[i] == role) {
  299. return true
  300. }
  301. }
  302. return false
  303. },
  304. isShow() {
  305. for (let i = 0; i < this.gridList.length; i++) {
  306. if (i == 1) {
  307. this.gridList[i].show = this.getRoles('acquisitionQuality.view')
  308. } else if (i == 2) {
  309. this.gridList[i].show = this.getRoles('acquisitionWeight.view')
  310. }
  311. }
  312. for (let k = 0; k < this.gridList1.length; k++) {
  313. if (k == 0) {
  314. this.gridList1[k].show = this.getRoles('acquisitionWeightOut.view')
  315. } else if (k == 1) {
  316. this.gridList1[k].show = this.getRoles('acquisitionQualityOut.view')
  317. }
  318. }
  319. },
  320. fankui() {
  321. uni.navigateTo({
  322. url: `/pages/user/fankui`
  323. })
  324. },
  325. zhibo() {
  326. uni.navigateTo({
  327. url: `/pageB/video/broadcast`
  328. })
  329. },
  330. look() {
  331. uni.navigateTo({
  332. url: `/pageB/video/look`
  333. })
  334. },
  335. contactUs() {
  336. const that = this
  337. uni.makePhoneCall({
  338. // 手机号
  339. phoneNumber: '18241771147',
  340. // 成功回调
  341. success: (res) => {},
  342. // 失败回调
  343. fail: (res) => {}
  344. });
  345. },
  346. loadData() {
  347. // const that = this
  348. // if(uni.getStorageSync("PageCur")){
  349. // that.PageCur = uni.getStorageSync("PageCur");
  350. // }
  351. // that.userInfoTmp = uni.getStorageSync("userInfo")
  352. // uni.showLoading({
  353. // title: '正在加载',
  354. // mask:true
  355. // })
  356. // that.$api.request('integral', 'getIndexData', failres => {
  357. // that.$api.msg(failres.errmsg)
  358. // uni.hideLoading()
  359. // }).then(res => {
  360. // let data = res.data
  361. // uni.setStorageSync("message", data.message);
  362. // uni.setStorageSync("task", data.task);
  363. // uni.setStorageSync("contract", data.contract);
  364. // uni.setStorageSync('showTran', data.showTran);
  365. // that.showTran = data.showTran
  366. // that.gridList[4].tips = data.task
  367. // that.gridList[2].tips = data.contract
  368. // that.companyId = data.companyId
  369. // uni.hideLoading()
  370. // })
  371. },
  372. gridClick(item, index) {
  373. var that = this
  374. if (item.name == "退出登录") {
  375. this.logout()
  376. return;
  377. } else if (item.name == "联系我们") {
  378. //#ifdef MP
  379. this.inputShow = true
  380. this.inputStatus = 'inline'
  381. this.feild = "nickname"
  382. this.inputContent = ''
  383. //#endif
  384. //#ifdef APP-PLUS
  385. this.contactUs()
  386. //#endif
  387. return;
  388. } else if (item.name == '我的车辆') {
  389. const that = this
  390. uni.showLoading({
  391. title: '正在加载',
  392. mask: true
  393. })
  394. that.$api.request('tran', 'getMyCarList', failres => {
  395. that.$api.msg(failres.errmsg)
  396. uni.hideLoading()
  397. }).then(res => {
  398. that.carInfo = res.data
  399. if (that.carInfo.length == 0) {
  400. that.$api.msg('暂无车辆信息')
  401. } else {
  402. var height = that.carInfo.length * 100
  403. var width = 500
  404. that.mycarStyle = "height:" + height + "rpx;width:" + width + "rpx"
  405. that.modalName = 'MycarModal'
  406. }
  407. uni.hideLoading()
  408. })
  409. return;
  410. }
  411. if (!this.hasLogin) {
  412. uni.showModal({
  413. title: '登录提示',
  414. content: '您尚未登录,是否立即登录?',
  415. showCancel: true,
  416. confirmText: '登录',
  417. success: (e) => {
  418. if (e.confirm) {
  419. uni.navigateTo({
  420. url: '/pages/public/login'
  421. })
  422. }
  423. },
  424. fail: () => {},
  425. complete: () => {}
  426. })
  427. } else {
  428. if (item.url) {
  429. uni.navigateTo({
  430. url: item.url
  431. })
  432. }
  433. }
  434. },
  435. setting() {
  436. if (!this.hasLogin) {
  437. uni.showModal({
  438. title: '登录提示',
  439. content: '您尚未登录,是否立即登录?',
  440. showCancel: true,
  441. confirmText: '登录',
  442. success: (e) => {
  443. if (e.confirm) {
  444. uni.navigateTo({
  445. url: '/pages/public/login'
  446. })
  447. }
  448. },
  449. fail: () => {},
  450. complete: () => {}
  451. })
  452. } else {
  453. uni.navigateTo({
  454. url: '/pages/user/setUp'
  455. })
  456. }
  457. },
  458. toLogin() {
  459. console.log("userInfo", this.userInfo)
  460. if (!this.hasLogin || !this.userInfo || this.username == "立即登录") {
  461. uni.navigateTo({
  462. url: '/pages/public/login_account_number'
  463. })
  464. } else {
  465. uni.navigateTo({
  466. url: '/pages/user/setUp'
  467. })
  468. }
  469. // else if(!this.userInfo.nickname){
  470. // this.inputShow = true
  471. // this.inputStatus = 'inline'
  472. // this.feild = "nickname"
  473. // this.inputContent = ''
  474. // }
  475. },
  476. confirm() {
  477. const that = this
  478. if (!that.inputContent) {
  479. that.$api.msg('输入不能为空')
  480. return
  481. }
  482. let obj = {}
  483. obj[that.feild] = that.inputContent
  484. that.$api.request('user', 'syncUserInfo', obj).then(res => {
  485. that.userInfo.nickname = that.inputContent
  486. that.inputContent = ''
  487. that.$store.commit('login', that.userInfo)
  488. })
  489. },
  490. cancel() {
  491. this.inputShow = false
  492. this.inputStatus = 'none'
  493. this.genderShow = false
  494. },
  495. myAccount() {
  496. uni.navigateTo({
  497. url: `/pageA/pages/contract`
  498. })
  499. },
  500. logout() {
  501. // const that = this
  502. this.isShowAlert = true
  503. // uni.showModal({
  504. // title: '询问',
  505. // content: '您确定要退出吗?',
  506. // cancelText: '取消',
  507. // confirmText: '确定',
  508. // success: (e) => {
  509. // if (e.confirm) {
  510. // uni.hideTabBarRedDot({
  511. // index:3
  512. // })
  513. // uni.clearStorageSync();
  514. // that.$store.commit('logout')
  515. // that.$api.logout()
  516. // uni.navigateTo({
  517. // url: `/pages/public/login`
  518. // })
  519. // }
  520. // }
  521. // })
  522. },
  523. /**
  524. * 统一跳转接口,拦截未登录路由
  525. * navigator标签现在默认没有转场动画,所以用view
  526. */
  527. navTo(url) {
  528. if (!this.hasLogin) {
  529. url = '/pages/public/login';
  530. }
  531. uni.navigateTo({
  532. url
  533. })
  534. },
  535. mycarClick(carNo) {
  536. this.modalName = null
  537. uni.navigateTo({
  538. url: `/pageB/car/mycar_detail?carNo=${carNo}`
  539. })
  540. },
  541. qrClick(userInfo) {
  542. this.modalName = null
  543. uni.navigateTo({
  544. url: `/pages/user/qr`
  545. })
  546. },
  547. scanCode() {
  548. uni.scanCode({
  549. success: function(res) {
  550. uni.navigateTo({
  551. url: res.result
  552. })
  553. }
  554. })
  555. },
  556. hideModal(e) {
  557. this.modalName = null
  558. },
  559. }
  560. }
  561. </script>
  562. <style lang='scss' scoped>
  563. page {
  564. background: #F5F6FA;
  565. }
  566. .container {
  567. padding-top: 85px;
  568. padding-top: 35px;
  569. background-color: #F5F6FA;
  570. position: relative;
  571. width: 100vw;
  572. height: 100vh;
  573. overflow: hidden;
  574. background: url('~@/static/img/login/bg_slices/bg@3x.png');
  575. background-size: 100% 100%;
  576. margin: 0 auto;
  577. }
  578. .cu-tag.badge {
  579. right: 26rpx;
  580. }
  581. .path {
  582. color: #007aff;
  583. display: inline-block;
  584. text-align: center;
  585. }
  586. .icon {
  587. margin-right: 10rpx;
  588. }
  589. .portrait-box {
  590. margin-top: 20rpx;
  591. }
  592. .qr-wrap {
  593. margin-top: 20upx;
  594. color: #fff;
  595. font-size: 32rpx;
  596. }
  597. .cu-list {
  598. /* height: 483rpx;
  599. overflow-y: scroll; */
  600. background: transparent;
  601. }
  602. .cu-list.grid.no-border {
  603. padding: 0;
  604. }
  605. .badge_user {
  606. color: #fff;
  607. background-color: #dc3545;
  608. display: inline-block;
  609. padding: .25em .4em;
  610. font-size: 75%;
  611. font-weight: 700;
  612. line-height: 1;
  613. text-align: center;
  614. white-space: nowrap;
  615. vertical-align: top;
  616. border-radius: 50%;
  617. transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  618. }
  619. @keyframes move_wave {
  620. 0% {
  621. transform: translateX(0) translateZ(0) scaleY(1)
  622. }
  623. 50% {
  624. transform: translateX(-25%) translateZ(0) scaleY(0.55)
  625. }
  626. 100% {
  627. transform: translateX(-50%) translateZ(0) scaleY(1)
  628. }
  629. }
  630. .bg {
  631. position: relative;
  632. height: 300rpx;
  633. /* background: linear-gradient(to bottom, #56ccf2, #2f80ed); */
  634. /*background: linear-gradient(to bottom, #0be9fe, #4bb0fe); */
  635. background: linear-gradient(to bottom, #d5f8ff, #56ccf2);
  636. }
  637. .bg_ware {
  638. position: absolute;
  639. left: 0;
  640. bottom: -2rpx;
  641. width: 100%;
  642. mix-blend-mode: screen;
  643. height: 224rpx;
  644. }
  645. %flex-center {
  646. display: flex;
  647. flex-direction: column;
  648. justify-content: center;
  649. align-items: center;
  650. }
  651. %section {
  652. display: flex;
  653. justify-content: space-around;
  654. align-content: center;
  655. background: #fff;
  656. border-radius: 10upx;
  657. }
  658. .grid-item-box {
  659. flex: 1;
  660. /* position: relative;
  661. */
  662. /* #ifndef APP-NVUE */
  663. display: flex;
  664. /* #endif */
  665. flex-direction: column;
  666. align-items: center;
  667. justify-content: center;
  668. padding: 15px 0;
  669. }
  670. .image {
  671. width: 80rpx;
  672. height: 80rpx;
  673. }
  674. .text {
  675. font-size: 26rpx;
  676. margin-top: 10rpx;
  677. }
  678. .user-section {
  679. height: 520upx;
  680. padding: 100upx 30upx 0;
  681. position: relative;
  682. .bg {
  683. position: absolute;
  684. left: 0;
  685. top: 0;
  686. width: 100%;
  687. height: 100%;
  688. filter: blur(1px);
  689. box-shadow: 0px 1px 8px #ccc;
  690. /* background:linear-gradient(#0eb0c9,#126bae); */
  691. /* opacity: .7; */
  692. }
  693. }
  694. .user-info-box {
  695. height: 180upx;
  696. /* display:flex; */
  697. /* align-items:center; */
  698. text-align: center;
  699. position: relative;
  700. z-index: 1;
  701. .portrait {
  702. width: 130upx;
  703. height: 130upx;
  704. border: 5upx solid #fff;
  705. border-radius: 50%;
  706. }
  707. .username {
  708. font-size: $font-lg + 3upx;
  709. color: #fff;
  710. margin-top: 20upx;
  711. }
  712. }
  713. .vip-card-box {
  714. display: flex;
  715. flex-direction: column;
  716. color: #f7d680;
  717. height: 240upx;
  718. background: linear-gradient(left, rgba(0, 0, 0, .7), rgba(0, 0, 0, .8));
  719. border-radius: 16upx 16upx 0 0;
  720. overflow: hidden;
  721. position: relative;
  722. padding: 20upx 24upx;
  723. .card-bg {
  724. position: absolute;
  725. top: 20upx;
  726. right: 0;
  727. width: 380upx;
  728. height: 260upx;
  729. }
  730. .b-btn {
  731. position: absolute;
  732. right: 20upx;
  733. top: 16upx;
  734. width: 132upx;
  735. height: 40upx;
  736. text-align: center;
  737. line-height: 40upx;
  738. font-size: 22upx;
  739. color: #36343c;
  740. border-radius: 20px;
  741. background: linear-gradient(left, #f9e6af, #ffd465);
  742. z-index: 1;
  743. }
  744. .tit {
  745. font-size: $font-base+2upx;
  746. color: #f7d680;
  747. margin-bottom: 28upx;
  748. .yticon {
  749. color: #f6e5a3;
  750. margin-right: 16upx;
  751. }
  752. }
  753. .e-b {
  754. font-size: $font-sm;
  755. color: #d8cba9;
  756. margin-top: 10upx;
  757. }
  758. }
  759. .cover-container {
  760. padding: 1px 10px;
  761. padding-bottom: 200upx;
  762. /* background-color: #F5F6FA; */
  763. /* border-radius: 20px; */
  764. margin-top: 60upx;
  765. .arc {
  766. position: absolute;
  767. left: 0;
  768. top: -34upx;
  769. width: 100%;
  770. height: 36upx;
  771. }
  772. }
  773. .tj-sction {
  774. @extend %section;
  775. .tj-item {
  776. @extend %flex-center;
  777. flex-direction: column;
  778. height: 140upx;
  779. font-size: $font-sm;
  780. color: #75787d;
  781. }
  782. .num {
  783. font-size: $font-lg;
  784. color: $font-color-dark;
  785. margin-bottom: 8upx;
  786. }
  787. }
  788. .order-section {
  789. @extend %section;
  790. padding: 28upx 0;
  791. margin-top: 20upx;
  792. .order-item {
  793. @extend %flex-center;
  794. width: 120upx;
  795. height: 120upx;
  796. border-radius: 10upx;
  797. font-size: $font-sm;
  798. color: $font-color-dark;
  799. }
  800. .yticon {
  801. font-size: 48upx;
  802. margin-bottom: 18upx;
  803. color: #fa436a;
  804. }
  805. .icon-shouhoutuikuan {
  806. font-size: 44upx;
  807. }
  808. }
  809. .history-section {
  810. padding: 30upx 0 0;
  811. margin-top: 20upx;
  812. background: #fff;
  813. border-radius: 10upx;
  814. .sec-header {
  815. display: flex;
  816. align-items: center;
  817. font-size: $font-base;
  818. color: $font-color-dark;
  819. line-height: 40upx;
  820. margin-left: 30upx;
  821. .yticon {
  822. font-size: 44upx;
  823. color: #5eba8f;
  824. margin-right: 16upx;
  825. line-height: 40upx;
  826. }
  827. }
  828. .h-list {
  829. white-space: nowrap;
  830. padding: 30upx 30upx 0;
  831. image {
  832. display: inline-block;
  833. width: 160upx;
  834. height: 160upx;
  835. margin-right: 20upx;
  836. border-radius: 10upx;
  837. }
  838. }
  839. }
  840. .grid {
  841. display: flex;
  842. align-items: center;
  843. flex-wrap: wrap;
  844. /* border-top: 2upx solid rgba(172,172,172,.2); */
  845. .grid-item-3 {
  846. box-sizing: border-box;
  847. width: calc(100% / 3);
  848. border-bottom: 2upx solid rgba(172, 172, 172, .2);
  849. border-right: 2upx solid rgba(172, 172, 172, .2);
  850. text-align: center;
  851. padding: 40upx 0;
  852. position: relative;
  853. /* view{
  854. font-size: $font-sm;
  855. margin-top: 16upx;
  856. color: $font-color-dark;
  857. } */
  858. .grid_icon {
  859. font-size: 48upx;
  860. margin-bottom: 18upx;
  861. color: #fa436a;
  862. }
  863. .tip_text {
  864. display: block;
  865. padding: 4upx 8upx;
  866. text-align: center;
  867. border-radius: 36upx;
  868. font-size: 24upx;
  869. background-color: #fa436a;
  870. color: rgba(255, 255, 255, 1);
  871. position: absolute;
  872. right: 6upx;
  873. top: 6upx;
  874. }
  875. }
  876. .grid-item-3:nth-child(3n + 3),
  877. .grid-item-4:nth-child(4n + 4) {
  878. border-right: none;
  879. }
  880. }
  881. .headPortrait {
  882. width: 75px;
  883. height: 75px;
  884. border-radius: 40px;
  885. border: 2px solid #ffffff;
  886. }
  887. .personal {
  888. margin-top: 10px;
  889. margin-left: 20px;
  890. }
  891. .information {
  892. font-size: 15px;
  893. font-weight: 600;
  894. height: 36px;
  895. }
  896. .indexlow {
  897. /* margin-top: 30px; */
  898. border-radius: 10px;
  899. }
  900. .cu-list>.cu-item:after {
  901. border: none;
  902. }
  903. .sign {
  904. width: 40px;
  905. height: 40px;
  906. top: 4px;
  907. margin-right: 6px;
  908. }
  909. .indexUp {
  910. padding: 0 20px;
  911. align-items: center;
  912. }
  913. .wrap {
  914. background: #fff;
  915. margin: 10px;
  916. border-radius: 10px;
  917. padding: 10px;
  918. .title {
  919. font-size: 16px;
  920. }
  921. }
  922. .content2{
  923. display: flex;
  924. justify-content: space-between;
  925. }
  926. </style>