123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696 |
- <template>
- <view>
- <view class="morePages">
- <!-- 头部栏 -->
- <view class="header-box">
- <UniStatusBar></UniStatusBar>
- <view class="title flex align_center" :style="{height:(navHeight+'px')}">
- <u-image src="/static/logo-h.png" width="349" height='40'></u-image>
- </view>
- </view>
- <!-- body -->
- <view class="morePages-body">
- <view class="body-box bg-blue">
- <!-- 名片 -->
- <view class="userCard flex align_center justify_between">
- <view class="userCard-info flex align_center">
- <view>
- <u-image shape='circle' v-if="!hasLogin" src="/static/def_personal_avatar.png" width="90" height="90"></u-image>
- <u-image shape='circle' v-else :src="avatarUrl||'/static/def_personal_avatar.png'" width="90" height="90"></u-image>
- </view>
- <view class="user-info" @click="toUser">
- <view v-if="!hasLogin" style="font-size: 40rpx;">
- 请点击登录
- </view>
- <view v-else>
- <view class="user-name">{{userInfo.userNameCN || userInfo.mobile}}</view>
- <view v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'">
- <u-tag text="个人用户" mode="dark" type="warning" shape="circle" size="mini" />
- </view>
- <view v-else>{{userInfo.orgName}}</view>
- </view>
- </view>
- </view>
- <view @click="toUser">
- <text v-if="hasLogin&&userInfo&&userInfo.sysUserFlag == '0'" class="user-rz">
- {{storeApply&&storeApply.auditStatus=='WAIT'?'认证门店审核中':'认证成为门店'}}
- </text>
- <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
- </view>
- </view>
- </view>
-
- <view class="list-box" v-if="hasRedPacket&&hasShelf">
- <view class="list-title flex align_center justify_between" @click="toPage('/pagesB/redPacket')">
- <view><u-icon size="34" color="#f10000" name="red-packet-fill"></u-icon> <text style="color: #ff0000;margin-left: 10rpx;">红包奖励</text></view>
- <view>
- <u-badge :absolute="false" :count="redPackCount"></u-badge>
- <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
- </view>
- </view>
- </view>
- <view class="list-box" v-if="hasLogin&&$hasPermissions('M_couponList_mini')">
- <view class="list-title flex align_center justify_between" @click="toPage('/pagesB/coupon')">
- <view><u-icon size="34" color="#ff7d0b" name="gift-fill"></u-icon> <text style="color: #ff7d0b;margin-left: 10rpx;">我的优惠券</text></view>
- <view>
- <u-badge :absolute="false" :count="hasShelf?couponCount:0"></u-badge>
- <uni-icons type="arrowright" size="20" color="#999"></uni-icons>
- </view>
- </view>
- </view>
-
- <!-- 网格图标 -->
- <view class="list-box" v-for="item in itemList" :key="item.id">
- <view class="list-title" v-if="item.text">
- <text>{{item.text}}</text>
- </view>
- <view class="list-body" :style="{paddingTop:item.text?0:'10px'}">
- <uni-grid :column="item.column" :highlight="true" :show-border="false" :square="false" @change="e=>openPage(e,item.child)">
- <uni-grid-item v-for="(sub, idx) in item.child" :index="idx" :key="idx">
- <view class="grid-item-box">
- <u-icon class="icons" :color="sub.color" :size="item.size" :name="sub.icon" custom-prefix="custom-icon"></u-icon>
- <text class="text">{{sub.text}}</text>
- </view>
- </uni-grid-item>
- </uni-grid>
- </view>
- </view>
-
- <view class="list-box" v-if="hasLogin">
- <view class="list-title flex justify_center phone" @click="quitOut">
- <text>退出登录</text>
- </view>
- </view>
- </view>
-
- <!-- 去认证弹框 -->
- <u-popup v-model="showPopup" mode="center" :border-radius="20" closeable>
- <view style="background-color: #fff;padding: 1rem;">
- <u-image width="533" height="415" src="/static/authimg.jpg"></u-image>
- <view style="padding-top:1rem;" class="flex justify_center">
- <u-button @click="toAuthStore()" shape="circle" :custom-style="{background:'#066cff',color:'#fff',width:'350rpx'}">开始认证</u-button>
- </view>
- </view>
- </u-popup>
- </view>
- <!-- tab -->
- <u-tabbar :list="vuex_tabBarList" :mid-button-size="80" :before-switch="beforeSwitch" :midButton="vuex_tabBarList.length==5"></u-tabbar>
- </view>
- </template>
- <script>
- import {
- mapState,
- mapMutations
- } from 'vuex'
- import UniStatusBar from '@/components/uni-status-bar/uni-status-bar.vue'
- import { queryQplsConfig,getProductfindByScanCode } from '@/api/shelf.js'
- import { findUserReward } from '@/api/rewardRule.js'
- import { ticketQueryCount } from '@/api/user.js'
- import { clickTab, toLogin } from "@/utils/index.js"
- export default {
- components: {
- UniStatusBar // 状态栏组件
- },
- data() {
- return {
- dealerPhone: null, // 经销商电话
- showPopup: false,
- showPriceSet: false,
- shelfSn: null,
- avatarUrl:'', // 用户图像
- navHeight: 44,
- couponCount: 0,
- redPackCount: 0
- }
- },
- computed: {
- ...mapState(['hasLogin','vuex_vinScanNums','vuex_scanMaxNums','vuex_tabBarList']),
- hasShelf(){
- return !!this.$store.state.vuex_storeShelf
- },
- userInfo(){
- return this.$store.state.vuex_userInfo
- },
- storeApply(){
- return this.$store.state.vuex_storeAuthInfo
- },
- hasRedPacket(){
- const rule = this.$store.state.vuex_rewardRule
- return rule&&rule.ruleStatus == 'release'
- },
- hasShopSeting(){
- return this.$store.state.vuex_hasShopiing
- },
- itemList(){
- const list = [
- {
- text: '订单管理',
- icon: 'order',
- auth: true,
- column: 4,
- size: 60,
- child:[
- {
- text: '货架订单',
- icon: 'huojiaguanli',
- auth: this.$hasPermissions('M_shelfOrder_mini'),
- path: '/pagesA/digitalShelf/orderList',
- color: '#056cd9',
- isShelf: true
- },
- {
- text: '急送订单',
- icon: 'yijianshansong',
- auth: this.$hasPermissions('M_tempShelfOrder_mini'),
- path: '/pagesA/digitalShelf/tempOrderList/tempOrderList',
- color: '#dd6859',
- isShelf: true
- },
- {
- text: '采购订单',
- icon: 'purchaseorder',
- auth: this.$hasPermissions('M_procureOrder_mini'),
- path: '/pagesB/procureOrderList',
- color: '#ffaa00'
- }
- ],
- },
- {
- text: '货架管理',
- icon: 'list-dot',
- auth: true,
- column: 4,
- size: 60,
- child:[
- {
- text: '库存查询',
- icon: 'stockquery',
- auth: this.$hasPermissions('M_stockQueryList_mini'),
- path: '/pagesB/stockQuery/stockQuery',
- color: '#ff87a3',
- isShelf: true
- },
- {
- text: '补货记录',
- icon: 'replenishment',
- auth: this.$hasPermissions('M_stockPut_mini'),
- path: '/pagesA/digitalShelf/stockPut',
- color: '#55aaff',
- isShelf: true
- },
- {
- text: '结算记录',
- icon: 'settlement',
- auth: this.$hasPermissions('M_settlementRecord_mini'),
- path: '/pagesA/digitalShelf/settlementRecord/settlementRecord',
- color: '#55aa7f',
- isShelf: true
- },
- {
- text: '付款结算',
- icon: 'payrecord',
- auth: this.$hasPermissions('M_settlementManage_mini'),
- path: '/pagesA/digitalShelf/settlementManage/settlementManage',
- color: '#ff9777',
- isShelf: true
- },
- {
- text: '编码取货',
- icon: 'ziyuanxhdpi',
- auth: this.userInfo && this.userInfo.sysUserFlag == '1',
- path: '#quhuo1',
- color: '#2196f3',
- isShelf: true
- },
- {
- text: '扫码取货',
- icon: 'saoma1',
- auth: this.userInfo && this.userInfo.sysUserFlag == '1',
- path: '#quhuo0',
- color: '#ffaa00',
- isShelf: true
- },
- {
- text: 'VIN查询历史',
- icon: 'lishijilu',
- auth: this.hasLogin,
- path: '/pagesA/vinRecord/vinRecord',
- color: '#abc4ff',
- isShelf: true
- },
- {
- text: '联系汽配商',
- icon: 'lianxidianhua',
- auth: this.hasLogin&&this.dealerPhone,
- path: '#call',
- color: '#00aaff',
- isShelf: true
- },
- ],
- },
- {
- text: '轮胎质保单',
- icon: 'file-text',
- auth: true,
- column: 4,
- size: 60,
- child:[
- {
- text: '创建质保单',
- icon: 'zhibaodan',
- auth: this.$hasPermissions('M_creatWarranty_mini'),
- path: '/pagesA/qualityPolicy/creatOrder',
- color: '#056cd9'
- },
- {
- text: '质保单查询',
- icon: 'ordersearch',
- auth: this.$hasPermissions('M_searchWarranty_mini'),
- path: '/pagesA/qualityPolicy/searchOrder',
- color: '#ffaa7f'
- },
- ],
- },
- {
- text: '基础设置',
- icon: 'setting',
- auth: true,
- column: 4,
- size: 60,
- child:[
- {
- text: '员工管理',
- icon: 'employee',
- auth: this.$hasPermissions('M_employee_mini'),
- path: '/pages/storeManage/personnel',
- color: '#ff9d7c'
- },
- {
- text: '岗位权限',
- icon: 'job',
- auth: this.$hasPermissions('M_roleSetting_mini'),
- path: '/pages/storeManage/roleSetting/roleSetting',
- color: '#aaaaff'
- },
- {
- text: '价格显示设置',
- icon: 'permission',
- auth: this.$hasPermissions('M_priceShow_mini')&&this.showPriceSet,
- path: '/pages/storeManage/priceSetting/priceSetting',
- color: '#55aaff',
- isShelf: true
- },
- {
- text: '商城显示设置',
- icon: 'shangcheng',
- auth: this.hasShopSeting,
- path: '/pagesB/shopShow/shopShow',
- color: '#00aa00',
- isShelf: true
- },
- ],
- }
- ]
- // 计算父节点,权限
- list.forEach(item => {
- item.id = this.$u.guid()
- item.child = item.child.filter(c => c.auth)
- item.auth = item.child.length > 0
- })
- return list.filter(item => item.auth)
- }
- },
- onShow() {
- // 用户头像
- this.avatarUrl = uni.getStorageSync('userPhoto');
- // 获取货架信息
- const shelfInfo = this.$store.state.vuex_storeShelf
- this.shelfSn = shelfInfo ? shelfInfo.shelfSn : ''
- this.dealerPhone = shelfInfo&&shelfInfo.contactMobile ? shelfInfo.contactMobile : ''
- if(this.shelfSn){
- this.getPriceCofig()
- }
- // 获取优惠券总数
- if(this.hasLogin&&this.$hasPermissions('M_couponList_mini')){
- this.getCouponCount()
- }
- // 红包总金额
- if(this.hasRedPacket&&this.hasShelf){
- this.getUserReward()
- }
- // 隐藏促销模块
- if(!this.hasLogin){
- this.hidePromoTab()
- }
- },
- // 页面卸载
- onUnload() {
- uni.$off('refashProm')
- },
- methods: {
- // 获取优惠券数量
- getCouponCount(){
- if(this.userInfo.sysUserFlag == '1'){
- ticketQueryCount().then(res => {
- this.couponCount = res.data ? res.data.ticketValue : 0
- })
- }
- },
- // 红包总金额
- getUserReward(){
- findUserReward().then(res => {
- this.redPackCount = res.data ? res.data.rewardAmount : 0
- })
- },
- // 查看用户信息
- toUser(){
- if(this.hasLogin){
- // 用户详细信息 或 门店认证
- uni.navigateTo({
- url: this.userInfo.sysUserFlag == '1' ? '/pages/personData/personData' : '/pages/storeManage/storeAuth'
- })
- }else{
- toLogin()
- }
- },
- // 隐藏促销模块
- hidePromoTab(){
- // 删除促销模块
- const promoIndex = this.$store.state.vuex_tabBarList.findIndex(item => item.text == '促销')
- if(promoIndex > -1){
- this.$store.state.vuex_tabBarList.splice(promoIndex,1)
- }
- // 扫描按钮不局中
- const scanTab = this.$store.state.vuex_tabBarList.find(item => item.text == '扫描VIN')
- if(scanTab){
- scanTab.iconPath = "/static/tab/tab_scan_normal.png"
- scanTab.midButton = false
- }
- },
- // tab单击
- beforeSwitch(index){
- const row = this.$store.state.vuex_tabBarList[index] // 当前tab
- const isNoAuth = this.userInfo ? this.userInfo.sysUserFlag == '0' : false // 是否认证门店
- return clickTab(row,this.hasLogin,isNoAuth,this.vuex_vinScanNums < this.vuex_scanMaxNums)
- },
- // 网格打开页面
- openPage(e,child){
- const item = child[e.detail.index]
- this.toPage(item.path,item.isShelf)
- },
- // 获取价格配置
- getPriceCofig(){
- queryQplsConfig({shelfSn: this.shelfSn}).then(res => {
- this.$store.state.vuex_configPrice = res.data || null
- const ret = [false,false]
- ret[0]= res.data.shelf_cost_show == '1' || res.data.non_shelf_cost_show == '1'
- ret[1]= res.data.shelf_price_show == '1' || res.data.non_shelf_price_show == '1'
- this.showPriceSet = ret.filter(item => !!item).length > 0
- })
- },
- // 取货
- openTakeGood(index){
- // 已有数字货架
- if(this.hasShelf){
- this.clickAction(index)
- }else{
- uni.showToast({
- icon:'none',
- title: '门店没有关联数字货架,无法使用此功能!'
- })
- }
- },
- // 选择取货方式
- clickAction(index){
- const shelfSn = this.hasShelf.shelfSn
- const _this = this
- // 扫描
- if(index == 0){
- uni.scanCode({
- success: function (ret) {
- console.log(ret);
- const params = {
- codeType: ret.scanType == 'QR_CODE' ? 0 : 1
- }
- // 二维码
- if(ret.scanType == 'QR_CODE'){
- const result = ret.result.split("&")
- params.productSn = result[2] // 产品编码sn
- }else{
- params.qrCode = ret.result
- }
- uni.showLoading({
- title: "正在查询产品..."
- })
- // 确认取货
- getProductfindByScanCode(params).then(res => {
- if(res.status == 200 && res.data){
- if(res.data.currentInven){
- const billSource = ret.scanType == 'QR_CODE' ? 'qr_code': 'bar_code'
- const retData = Object.assign({shelfSn: shelfSn, billSource: billSource},res.data)
- _this.$store.state.vuex_tempData = retData
- uni.navigateTo({
- url: '/pagesA/queryByCode/confirmQh'
- })
- }else{
- uni.showModal({
- title: '提示',
- content: '产品库存为0,无法取货!',
- confirmText: '好的',
- showCancel: false
- })
- }
- }else{
- uni.showModal({
- title: '提示',
- content: '产品不属于此货架,请重新扫描!',
- confirmText: '好的',
- showCancel: false
- })
- }
- uni.hideLoading()
- })
- }
- });
- }else{
- // 按编码搜索
- uni.navigateTo({
- url: '/pagesA/queryByCode/queryByCode'
- })
- }
- },
- // 跳转打开页面
- toPage(path,isShelf){
- const _this = this
- if(this.hasLogin){
- // 游客未认证
- if(this.userInfo.sysUserFlag == '0'){
- if(this.storeApply&&this.storeApply.auditStatus=='WAIT'){
- uni.showModal({
- title: '提示',
- content: '门店认证资料审核中,请耐心等待!',
- confirmText: '知道了',
- showCancel: false
- })
- }
- // 如果审核已通过
- else if(this.storeApply&&this.storeApply.auditStatus=='PASS'){
- uni.showModal({
- title: '提示',
- content: '门店认证审核已通过,请重新登录!',
- confirmText: '去登录',
- showCancel: false,
- success() {
- _this.$store.dispatch('userLogout');
- toLogin()
- }
- })
- }else{
- this.showPopup = true
- }
- }else{
- // 已有数字货架
- if(this.hasShelf || !isShelf){
- if(path.indexOf("/pages")>=0){
- uni.navigateTo({
- url: path
- })
- }else{
- if(path == '#quhuo1'){
- this.openTakeGood(1)
- }
- if(path == '#quhuo0'){
- this.openTakeGood(0)
- }
- if(path == '#call'){
- this.call()
- }
- }
- }else{
- uni.showToast({
- icon:'none',
- title: '门店没有关联数字货架,无法使用此功能!'
- })
- }
- }
- }else{
- toLogin()
- }
- },
- // 去认证
- toAuthStore(){
- this.showPopup = false
- uni.navigateTo({
- url: '/pages/storeManage/storeAuth'
- })
- },
- // 打电话
- call(){
- this.callPhone(this.dealerPhone)
- },
- // 退出登录
- quitOut(){
- let _this = this
- uni.showModal({
- title: '提示',
- content: '确定退出登录吗?',
- success: (ret) => {
- if(ret.confirm){
- _this.$store.dispatch('userLogout');
- toLogin()
- }
- }
- })
- }
- }
- }
- </script>
- <style lang="less">
- .morePages{
- width: 100%;
- background-image: linear-gradient(#86defa 0%,#cdeff9 20%,#f8f8f8 30%);
- .header-box{
- z-index: 5;
- padding: 0em 1em;
- background: #03A9F4;
- .title{
- padding: 0;
- }
- .version{
- color: #FFEB3B;
- font-size: 0.8em;
- margin-left: 1em;
- }
- }
- .morePages-body{
- padding: 0 30rpx;
- overflow: hidden;
- .body-box{
- margin-bottom: 10px;
- z-index: 4;
- }
- .bg-blue{
- position: relative;
- > view{
- z-index: 100;
- position: relative;
- }
- &::after{
- /* 这个伪类的作用就是一个圆弧的背景色 */
- width: 130%;
- height: 100%;
- position: absolute;
- /*设置水平居中*/
- left: -15%;
- /* 之所以left:20%,是因为width:140%,若width:160%,那么left:30%才能水平居中 */
- top: -25%;
- /*层叠顺序,最底层显示*/
- content: '';
- border-radius: 0 0 50% 50%;
- /*分别对应 左上 右上 右下 左下 可以修改成其它颜色*/
- background: linear-gradient(to bottom, #03A9F4, #02a6ec);
- }
- .userCard{
- position:relative;
- left:0;
- bottom:0;
- padding: 0.5rem;
- background: #fff;
- border-radius: 25rpx;
- box-shadow: 2rpx 2rpx 5rpx #bcdede;
- .userCard-info{
- flex-grow:1;
- > view{
- &:last-child{
- margin-left: 0.5em;
- line-height: 1.5em;
- .user-name{
- font-size: 1rem;
- }
- >view{
- padding: 0.2em;
- }
- }
- }
- .user-info{
- flex-grow:1;
- }
- }
- .user-rz{
- font-size: 0.8rem;
- color:#58aff5;
- }
- }
- }
- .list-box{
- background: #ffffff;
- margin-bottom: 20rpx;
- border-radius: 25rpx;
- overflow: hidden;
- box-shadow: 2rpx 2rpx 5rpx #eee;
- .list-title{
- padding: 25rpx 20rpx;
- color: #666;
- > text{
- font-size: 28rpx;
- }
- }
- &:first-child{
- box-shadow: 2rpx 2rpx 5rpx #cdeff9;
- }
- .list-body{
- padding: 0 20rpx;
- }
- .grid-item-box{
- display: flex;
- flex-direction: column;
- align-items:center;
- justify-content: center;
- margin-bottom: 15px;
- .text{
- text-align:center;
- color: #666;
- margin-top: 3px;
- font-size: 12px;
- }
- .icons{
- text-align:center;
- display: flex;
- align-items: center;
- flex-direction: column;
- justify-content: center;
- }
- }
- }
- .phone{
- color: #00aaff;
- &:active{
- opacity: 0.8;
- transform:scale(0.9);
- }
- }
- }
- }
- </style>
|