morePage.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421
  1. <template>
  2. <view>
  3. <view class="morePages">
  4. <view class="list-box" v-if="hasRedPacket&&hasShelf">
  5. <view class="list-title flex align_center justify_between" @click="toPage('/pagesB/redPacket')">
  6. <view><u-icon size="34" color="#f10000" name="red-packet-fill"></u-icon> <text style="color: #ff0000;margin-left: 10rpx;">红包奖励</text></view>
  7. <view>
  8. <u-icon size="28" color="#969799" name="arrow-right"></u-icon>
  9. </view>
  10. </view>
  11. </view>
  12. <view class="list-box" v-if="hasLogin&&$hasPermissions('M_couponList_mini')">
  13. <view class="list-title flex align_center justify_between" @click="toPage('/pagesB/coupon')">
  14. <view><u-icon size="34" color="#ff7d0b" name="gift-fill"></u-icon> <text style="color: #ff7d0b;margin-left: 10rpx;">我的优惠券</text></view>
  15. <view>
  16. <u-icon size="28" color="#969799" name="arrow-right"></u-icon>
  17. </view>
  18. </view>
  19. </view>
  20. <view class="list-box" v-for="item in itemList" :key="item.id">
  21. <view class="list-title">
  22. <u-icon size="35" :name="item.icon"></u-icon> <text>{{item.text}}</text>
  23. </view>
  24. <view class="list-body">
  25. <uni-grid :column="4" :highlight="true" :show-border="false" :square="false" @change="e=>openPage(e,item.child)">
  26. <uni-grid-item v-for="(sub, idx) in item.child" :index="idx" :key="idx">
  27. <view class="grid-item-box">
  28. <u-icon class="icons" :color="sub.color" :name="sub.icon" custom-prefix="custom-icon"></u-icon>
  29. <text class="text">{{sub.text}}</text>
  30. </view>
  31. </uni-grid-item>
  32. </uni-grid>
  33. </view>
  34. </view>
  35. <view class="list-box" v-if="hasLogin&&dealerPhone">
  36. <view class="list-title flex justify_center phone" @click="call">
  37. <u-icon size="36" name="phone"></u-icon> <text>联系汽配商</text>
  38. </view>
  39. </view>
  40. <view class="list-box" v-if="hasLogin">
  41. <view class="list-title flex justify_center phone" @click="quitOut">
  42. <text>退出登录</text>
  43. </view>
  44. </view>
  45. <!-- 去认证 -->
  46. <u-popup v-model="showPopup" mode="center" :border-radius="20" closeable>
  47. <view style="background-color: #fff;padding: 1rem;">
  48. <u-image width="533" height="415" src="/static/authimg.jpg"></u-image>
  49. <view style="padding-top:1rem;" class="flex justify_center">
  50. <u-button @click="toAuthStore()" shape="circle" :custom-style="{background:'#066cff',color:'#fff',width:'350rpx'}">开始认证</u-button>
  51. </view>
  52. </view>
  53. </u-popup>
  54. </view>
  55. <u-tabbar :list="vuex_tabBarList" :before-switch="beforeSwitch" :midButton="vuex_tabBarList.length==5"></u-tabbar>
  56. </view>
  57. </template>
  58. <script>
  59. import {
  60. mapState,
  61. mapMutations
  62. } from 'vuex'
  63. import { queryQplsConfig } from '@/api/shelf.js'
  64. export default {
  65. data() {
  66. return {
  67. dealerPhone: null,
  68. showPopup: false,
  69. showPriceSet: false,
  70. shelfSn: null,
  71. }
  72. },
  73. computed: {
  74. ...mapState(['hasLogin','vuex_vinScanNums','vuex_scanMaxNums','vuex_tabBarList']),
  75. hasShelf(){
  76. return !!this.$store.state.vuex_storeShelf
  77. },
  78. userInfo(){
  79. return this.$store.state.vuex_userInfo
  80. },
  81. storeApply(){
  82. return this.$store.state.vuex_storeAuthInfo
  83. },
  84. hasRedPacket(){
  85. const rule = this.$store.state.vuex_rewardRule
  86. return rule&&rule.ruleStatus == 'release'
  87. },
  88. itemList(){
  89. const list = [
  90. {
  91. text: '货品管理',
  92. icon: 'bag',
  93. auth: true,
  94. child:[
  95. {
  96. text: '库存查询',
  97. icon: 'stockquery',
  98. auth: this.$hasPermissions('M_stockQueryList_mini'),
  99. path: '/pagesB/stockQuery/stockQuery',
  100. color: '#00aaff'
  101. },
  102. {
  103. text: '补货记录',
  104. icon: 'replenishment',
  105. auth: this.$hasPermissions('M_stockPut_mini'),
  106. path: '/pagesA/digitalShelf/stockPut',
  107. color: '#aa55ff'
  108. }
  109. ],
  110. },
  111. {
  112. text: '订单管理',
  113. icon: 'order',
  114. auth: true,
  115. child:[
  116. {
  117. text: '货架订单',
  118. icon: 'shelforder',
  119. auth: this.$hasPermissions('M_shelfOrder_mini'),
  120. path: '/pagesA/digitalShelf/orderList',
  121. color: '#0055ff'
  122. },
  123. {
  124. text: '急送订单',
  125. icon: 'yijianshansong',
  126. auth: this.$hasPermissions('M_tempShelfOrder_mini'),
  127. path: '/pagesA/digitalShelf/tempOrderList/tempOrderList',
  128. color: '#ff7b1c'
  129. },
  130. {
  131. text: '采购订单',
  132. icon: 'purchaseorder',
  133. auth: this.$hasPermissions('M_procureOrder_mini'),
  134. path: '/pagesB/procureOrderList',
  135. color: '#00aa00'
  136. }
  137. ],
  138. },
  139. {
  140. text: '电子质保单',
  141. icon: 'file-text',
  142. auth: true,
  143. child:[
  144. {
  145. text: '创建质保单',
  146. icon: 'zhibaodan',
  147. auth: this.$hasPermissions('M_creatWarranty_mini'),
  148. path: '/pagesA/qualityPolicy/creatOrder',
  149. color: '#5555ff'
  150. },
  151. {
  152. text: '质保单查询',
  153. icon: 'ordersearch',
  154. auth: this.$hasPermissions('M_searchWarranty_mini'),
  155. path: '/pagesA/qualityPolicy/searchOrder',
  156. color: '#ff557f'
  157. },
  158. ],
  159. },
  160. {
  161. text: '结算管理',
  162. icon: 'rmb-circle',
  163. auth: true,
  164. child:[
  165. {
  166. text: '结算记录',
  167. icon: 'settlement',
  168. auth: this.$hasPermissions('M_settlementRecord_mini'),
  169. path: '/pagesA/digitalShelf/settlementRecord/settlementRecord',
  170. color: '#00aaff'
  171. },
  172. {
  173. text: '付款结算',
  174. icon: 'payrecord',
  175. auth: this.$hasPermissions('M_settlementManage_mini'),
  176. path: '/pagesA/digitalShelf/settlementManage/settlementManage',
  177. color: '#ff5500'
  178. },
  179. ],
  180. },
  181. {
  182. text: '基础设置',
  183. icon: 'setting',
  184. auth: true,
  185. child:[
  186. {
  187. text: '员工管理',
  188. icon: 'employee',
  189. auth: this.$hasPermissions('M_employee_mini'),
  190. path: '/pages/storeManage/personnel',
  191. color: '#0055ff'
  192. },
  193. {
  194. text: '岗位权限',
  195. icon: 'job',
  196. auth: this.$hasPermissions('M_roleSetting_mini'),
  197. path: '/pages/storeManage/roleSetting/roleSetting',
  198. color: '#55aa00'
  199. },
  200. {
  201. text: '价格显示设置',
  202. icon: 'permission',
  203. auth: this.$hasPermissions('M_priceShow_mini')&&this.showPriceSet,
  204. path: '/pages/storeManage/priceSetting/priceSetting',
  205. color: '#ff5500'
  206. },
  207. ],
  208. }
  209. ]
  210. // 计算父节点,权限
  211. list.forEach(item => {
  212. item.id = this.$u.guid()
  213. item.child = item.child.filter(c => c.auth)
  214. item.auth = item.child.length > 0
  215. })
  216. return list
  217. }
  218. },
  219. onShow() {
  220. const shelfInfo = this.$store.state.vuex_storeShelf
  221. this.shelfSn = shelfInfo ? shelfInfo.shelfSn : ''
  222. this.dealerPhone = shelfInfo&&shelfInfo.contactMobile ? shelfInfo.contactMobile : ''
  223. if(this.shelfSn){
  224. this.getPriceCofig()
  225. }
  226. },
  227. // 页面卸载
  228. onUnload() {
  229. uni.$off('refashProm')
  230. },
  231. methods: {
  232. beforeSwitch(index){
  233. const row = this.$store.state.vuex_tabBarList[index]
  234. if(row.text == '促销'){
  235. uni.$emit('refashProm')
  236. }
  237. if(row.text == '扫描VIN'){
  238. this.openCamera()
  239. }else{
  240. return true
  241. }
  242. },
  243. // 打开页面
  244. openPage(e,child){
  245. const item = child[e.detail.index]
  246. uni.navigateTo({
  247. url: item.path
  248. })
  249. },
  250. // 获取价格配置
  251. getPriceCofig(){
  252. queryQplsConfig({shelfSn: this.shelfSn}).then(res => {
  253. this.$store.state.vuex_configPrice = res.data || null
  254. const ret = [false,false]
  255. ret[0]= res.data.shelf_cost_show == '1' || res.data.non_shelf_cost_show == '1'
  256. ret[1]= res.data.shelf_price_show == '1' || res.data.non_shelf_price_show == '1'
  257. this.showPriceSet = ret.filter(item => !!item).length > 0
  258. })
  259. },
  260. // 去扫描
  261. openCamera(){
  262. if(this.hasLogin){
  263. if(this.userInfo.sysUserFlag == '0'){
  264. if(this.vuex_vinScanNums < this.vuex_scanMaxNums){
  265. uni.navigateTo({
  266. url: "/pages/scan-frame/scan-frame"
  267. })
  268. }else{
  269. uni.showModal({
  270. title: '提示',
  271. content: '个人用户扫描VIN仅限10次,您的次数已用完!',
  272. confirmText: '好的',
  273. showCancel: false,
  274. success(res) {}
  275. })
  276. }
  277. }else{
  278. uni.navigateTo({
  279. url: "/pages/scan-frame/scan-frame"
  280. })
  281. }
  282. }else{
  283. uni.navigateTo({
  284. url: '/pages/login/login'
  285. })
  286. }
  287. },
  288. toPage(path){
  289. const _this = this
  290. if(this.hasLogin){
  291. // 游客未认证
  292. if(this.userInfo.sysUserFlag == '0'){
  293. if(this.storeApply&&this.storeApply.auditStatus=='WAIT'){
  294. uni.showModal({
  295. title: '提示',
  296. content: '门店认证资料审核中,请耐心等待!',
  297. confirmText: '知道了',
  298. showCancel: false
  299. })
  300. }
  301. // 如果审核已通过
  302. else if(this.storeApply&&this.storeApply.auditStatus=='PASS'){
  303. uni.showModal({
  304. title: '提示',
  305. content: '门店认证审核已通过,请重新登录!',
  306. confirmText: '去登录',
  307. showCancel: false,
  308. success() {
  309. _this.$store.dispatch('userLogout');
  310. uni.redirectTo({
  311. url: '/pages/login/login'
  312. });
  313. }
  314. })
  315. }else{
  316. this.showPopup = true
  317. }
  318. }else{
  319. // 已有数字货架
  320. if(this.hasShelf){
  321. uni.navigateTo({
  322. url: path
  323. })
  324. }else{
  325. uni.showToast({
  326. icon:'none',
  327. title: '门店没有关联数字货架,无法使用此功能!'
  328. })
  329. }
  330. }
  331. }else{
  332. uni.navigateTo({
  333. url: '/pages/login/login'
  334. })
  335. }
  336. },
  337. toAuthStore(){
  338. this.showPopup = false
  339. uni.navigateTo({
  340. url: '/pages/storeManage/storeAuth'
  341. })
  342. },
  343. call(){
  344. this.callPhone(this.dealerPhone)
  345. },
  346. quitOut(){
  347. let _this = this
  348. uni.showModal({
  349. title: '提示',
  350. content: '确定退出登录吗?',
  351. success: (ret) => {
  352. if(ret.confirm){
  353. _this.$store.dispatch('userLogout');
  354. uni.navigateTo({
  355. url: '/pages/login/login'
  356. });
  357. }
  358. }
  359. })
  360. }
  361. }
  362. }
  363. </script>
  364. <style lang="less">
  365. .morePages{
  366. width: 100%;
  367. padding: 30rpx;
  368. background-image: linear-gradient(#86defa 0%,#cdeff9 20%,#f8f8f8 30%);
  369. .list-box{
  370. background: #ffffff;
  371. margin-bottom: 20rpx;
  372. border-radius: 25rpx;
  373. overflow: hidden;
  374. box-shadow: 2rpx 2rpx 5rpx #eee;
  375. .list-title{
  376. padding: 25rpx 20rpx;
  377. font-size: 30rpx;
  378. > text{
  379. margin-left: 10rpx;
  380. }
  381. }
  382. &:first-child{
  383. box-shadow: 2rpx 2rpx 5rpx #cdeff9;
  384. }
  385. .list-body{
  386. padding: 0 20rpx 25rpx;
  387. }
  388. .grid-item-box{
  389. display: flex;
  390. flex-direction: column;
  391. align-items:center;
  392. justify-content: center;
  393. .text{
  394. text-align:center;
  395. color: #666;
  396. }
  397. .icons{
  398. font-size: 70rpx;
  399. width: 100rpx;
  400. height: 100rpx;
  401. text-align:center;
  402. display: flex;
  403. align-items: center;
  404. flex-direction: column;
  405. justify-content: center;
  406. }
  407. }
  408. }
  409. .phone{
  410. color: #00aaff;
  411. &:active{
  412. opacity: 0.8;
  413. transform:scale(0.9);
  414. }
  415. }
  416. }
  417. </style>