|
@@ -12,14 +12,26 @@
|
|
|
<view class="mine__person--info">
|
|
|
<!-- 头像 -->
|
|
|
<view>
|
|
|
- <image :src="merchant.logo" style="width: 140rpx; height: 140rpx; border-radius: 50%" v-if="merchant.logo" />
|
|
|
- <image src="@/static/QR57a.jpg" style="width: 140rpx; height: 140rpx; border-radius: 50%" v-else />
|
|
|
+ <image
|
|
|
+ :src="merchant.logo"
|
|
|
+ style="width: 140rpx; height: 140rpx; border-radius: 50%"
|
|
|
+ v-if="merchant.logo"
|
|
|
+ />
|
|
|
+ <image
|
|
|
+ src="@/static/QR57a.jpg"
|
|
|
+ style="width: 140rpx; height: 140rpx; border-radius: 50%"
|
|
|
+ v-else
|
|
|
+ />
|
|
|
</view>
|
|
|
<view class="userName">
|
|
|
- <view> {{ merchant.name || '--' }}</view>
|
|
|
- <text> +86 {{ merchant.mobile || '--' }}</text>
|
|
|
+ <view v-if="merchant && merchant.name"> {{ merchant.name || '--' }}</view>
|
|
|
+ <text v-if="merchant && merchant.mobile"> +86 {{ merchant.mobile || '--' }}</text>
|
|
|
</view>
|
|
|
- <view class="status" :style="{ 'background-color': getStatusColor(state) }" @click="changeStatus(state)">
|
|
|
+ <view
|
|
|
+ class="status"
|
|
|
+ :style="{ 'background-color': getStatusColor(state) }"
|
|
|
+ @click="changeStatus(state)"
|
|
|
+ >
|
|
|
<view style="margin-right: 6rpx">{{ stateName }}</view>
|
|
|
<u-icon name="play-right-fill" color="#fff" size="12" />
|
|
|
</view>
|
|
@@ -74,292 +86,305 @@
|
|
|
<tabbar currentTab="merchantMine" />
|
|
|
|
|
|
<!-- 营业状态选择弹框 -->
|
|
|
- <u-picker :show="show" :columns="columns" @cancel="cancel" @confirm="confirm" keyName="label"></u-picker>
|
|
|
+ <u-picker
|
|
|
+ :show="show"
|
|
|
+ :columns="columns"
|
|
|
+ @cancel="cancel"
|
|
|
+ @confirm="confirm"
|
|
|
+ keyName="label"
|
|
|
+ ></u-picker>
|
|
|
|
|
|
<!-- 商家认证的弹框 -->
|
|
|
- <u-modal :show="showAut" :title="title" :content="content" :showCancelButton="true" @confirm="confirmSwitch"
|
|
|
- @cancel="handelCancel"></u-modal>
|
|
|
+ <u-modal
|
|
|
+ :show="showAut"
|
|
|
+ :title="title"
|
|
|
+ :content="content"
|
|
|
+ :confirmText="'开始认证'"
|
|
|
+ :cancelText="'返回用户端'"
|
|
|
+ :showCancelButton="true"
|
|
|
+ @confirm="confirmSwitch"
|
|
|
+ @cancel="handelCancel"
|
|
|
+ ></u-modal>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import {
|
|
|
- getMerchantAuthData
|
|
|
- } from '@/api/merchant/merchantAuth';
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- statusBarHeight: 0,
|
|
|
- state: 1,
|
|
|
- stateName: '营业中',
|
|
|
- show: false,
|
|
|
- showAut: false,
|
|
|
- title: '商家认证',
|
|
|
- content: '进入商家端前,我们需要一定的认证',
|
|
|
- merchantInfo: {},
|
|
|
- merchant: {},
|
|
|
- columns: [
|
|
|
- [{
|
|
|
- label: '营业中',
|
|
|
- id: 1,
|
|
|
- },
|
|
|
- {
|
|
|
- label: '休息中',
|
|
|
- id: 2,
|
|
|
- },
|
|
|
- {
|
|
|
- label: '停业中',
|
|
|
- id: 3,
|
|
|
- },
|
|
|
- ],
|
|
|
- ],
|
|
|
- list1: [{
|
|
|
- id: '1',
|
|
|
- name: '门店环境',
|
|
|
- url: '',
|
|
|
- },
|
|
|
- // {
|
|
|
- // id: '2',
|
|
|
- // name: '我要开店',
|
|
|
- // url: '/pages/merchant/mine/openStore/index',
|
|
|
- // },
|
|
|
+import { getMerchantAuthData } from '@/api/merchant/merchantAuth';
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ statusBarHeight: 0,
|
|
|
+ state: 1,
|
|
|
+ stateName: '营业中',
|
|
|
+ show: false,
|
|
|
+ showAut: false,
|
|
|
+ title: '商家认证',
|
|
|
+ content: '进入商家端前,我们需要一定的认证',
|
|
|
+ merchantInfo: {},
|
|
|
+ merchant: {},
|
|
|
+ columns: [
|
|
|
+ [
|
|
|
{
|
|
|
- id: '3',
|
|
|
- name: '资质信息',
|
|
|
- url: '/pages/merchant/mine/openStore/openStoreAppealDetail',
|
|
|
+ label: '营业中',
|
|
|
+ id: 1,
|
|
|
},
|
|
|
- ],
|
|
|
-
|
|
|
- list2: [{
|
|
|
- id: '1',
|
|
|
- name: '帮助中心',
|
|
|
- url: '',
|
|
|
+ {
|
|
|
+ label: '休息中',
|
|
|
+ id: 2,
|
|
|
},
|
|
|
{
|
|
|
- id: '2',
|
|
|
- name: '设置',
|
|
|
- url: '/pages/merchant/mine/setting/index',
|
|
|
+ label: '停业中',
|
|
|
+ id: 3,
|
|
|
},
|
|
|
],
|
|
|
- };
|
|
|
+ ],
|
|
|
+ list1: [
|
|
|
+ {
|
|
|
+ id: '1',
|
|
|
+ name: '门店环境',
|
|
|
+ url: '',
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // id: '2',
|
|
|
+ // name: '我要开店',
|
|
|
+ // url: '/pages/merchant/mine/openStore/index',
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ id: '3',
|
|
|
+ name: '资质信息',
|
|
|
+ url: '/pages/merchant/mine/openStore/openStoreAppealDetail',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+
|
|
|
+ list2: [
|
|
|
+ {
|
|
|
+ id: '1',
|
|
|
+ name: '帮助中心',
|
|
|
+ url: '',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: '2',
|
|
|
+ name: '设置',
|
|
|
+ url: '/pages/merchant/mine/setting/index',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ onLoad() {
|
|
|
+ // this.getHeight();
|
|
|
+ // 获取商家信息
|
|
|
+ this.merchantInfo = this.$store.state.data.merchantInfo;
|
|
|
+ let { merchant } = this.merchantInfo;
|
|
|
+ this.merchant = merchant;
|
|
|
+
|
|
|
+ // 判断是否存在商家id,是否需要认证
|
|
|
+ if (merchant.id) {
|
|
|
+ this.showAut = false;
|
|
|
+ } else {
|
|
|
+ this.showAut = true;
|
|
|
+ }
|
|
|
+ // this.showAut = true;
|
|
|
+ },
|
|
|
+
|
|
|
+ onShow() {
|
|
|
+ this.getMerchantAuth();
|
|
|
+ },
|
|
|
+
|
|
|
+ methods: {
|
|
|
+ tap(item) {
|
|
|
+ console.log('item', item);
|
|
|
},
|
|
|
|
|
|
- onLoad() {
|
|
|
- // this.getHeight();
|
|
|
- // 获取商家信息
|
|
|
- this.merchantInfo = this.$store.state.data.merchantInfo;
|
|
|
- let {
|
|
|
- merchant
|
|
|
- } = this.merchantInfo;
|
|
|
- this.merchant = merchant;
|
|
|
-
|
|
|
- // 判断是否存在商家id,是否需要认证
|
|
|
- // if (merchant.id) {
|
|
|
- // this.showAut = false;
|
|
|
- // } else {
|
|
|
- // this.showAut = true;
|
|
|
- // }
|
|
|
- this.showAut = true;
|
|
|
+ changeStatus() {
|
|
|
+ this.show = true;
|
|
|
+ },
|
|
|
+ confirmSwitch() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/merchant/mine/openStore/index',
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handelCancel() {
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/client/tabBar/home/index',
|
|
|
+ });
|
|
|
},
|
|
|
|
|
|
- onShow() {
|
|
|
- this.getMerchantAuth();
|
|
|
+ cancel() {
|
|
|
+ this.show = false;
|
|
|
},
|
|
|
|
|
|
- methods: {
|
|
|
- tap(item) {
|
|
|
- console.log('item', item);
|
|
|
- },
|
|
|
-
|
|
|
- changeStatus() {
|
|
|
- this.show = true;
|
|
|
- },
|
|
|
- confirmSwitch() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/merchant/mine/openStore/index',
|
|
|
- });
|
|
|
- },
|
|
|
- handelCancel() {
|
|
|
- uni.switchTab({
|
|
|
- url: '/pages/client/tabBar/home/index',
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- cancel() {
|
|
|
- this.show = false;
|
|
|
- },
|
|
|
-
|
|
|
- confirm(val) {
|
|
|
- this.state = val.value[0].id;
|
|
|
- this.stateName = val.value[0].label;
|
|
|
- this.show = false;
|
|
|
- },
|
|
|
-
|
|
|
- getStatusColor(state) {
|
|
|
- if (state === 1) {
|
|
|
- return '#19be6b';
|
|
|
- } else if (state === 2) {
|
|
|
- return '#ff9900';
|
|
|
- } else if (state === 3) {
|
|
|
- return '#909399';
|
|
|
- } else {
|
|
|
- return '';
|
|
|
- }
|
|
|
- },
|
|
|
+ confirm(val) {
|
|
|
+ this.state = val.value[0].id;
|
|
|
+ this.stateName = val.value[0].label;
|
|
|
+ this.show = false;
|
|
|
+ },
|
|
|
|
|
|
- // 点击跳转到设置
|
|
|
- handlerSkipSetting() {
|
|
|
- uni.navigateTo({
|
|
|
- url: '/pages/merchant/mine/setting/index',
|
|
|
- });
|
|
|
- },
|
|
|
-
|
|
|
- //计算导航栏总高度
|
|
|
- getHeight() {
|
|
|
- // 获取系统信息
|
|
|
- const systemInfo = uni.getSystemInfoSync();
|
|
|
- // 胶囊按钮位置信息
|
|
|
- const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
|
|
- // 导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度
|
|
|
- this.statusBarHeight =
|
|
|
- (menuButtonInfo.top - systemInfo.statusBarHeight) * 2 +
|
|
|
- menuButtonInfo.height +
|
|
|
- systemInfo.statusBarHeight;
|
|
|
- },
|
|
|
-
|
|
|
- // 获取商家信息
|
|
|
- async getMerchantAuth() {
|
|
|
- let res = await getMerchantAuthData();
|
|
|
- if (res.code == 200) {
|
|
|
- // 将数据存储到vuex中
|
|
|
- this.$store.commit('SET_MERCHANTINFO', res.data);
|
|
|
- }
|
|
|
- },
|
|
|
+ getStatusColor(state) {
|
|
|
+ if (state === 1) {
|
|
|
+ return '#19be6b';
|
|
|
+ } else if (state === 2) {
|
|
|
+ return '#ff9900';
|
|
|
+ } else if (state === 3) {
|
|
|
+ return '#909399';
|
|
|
+ } else {
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ // 点击跳转到设置
|
|
|
+ handlerSkipSetting() {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/merchant/mine/setting/index',
|
|
|
+ });
|
|
|
},
|
|
|
- };
|
|
|
+
|
|
|
+ //计算导航栏总高度
|
|
|
+ getHeight() {
|
|
|
+ // 获取系统信息
|
|
|
+ const systemInfo = uni.getSystemInfoSync();
|
|
|
+ // 胶囊按钮位置信息
|
|
|
+ const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
|
|
+ // 导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度
|
|
|
+ this.statusBarHeight =
|
|
|
+ (menuButtonInfo.top - systemInfo.statusBarHeight) * 2 +
|
|
|
+ menuButtonInfo.height +
|
|
|
+ systemInfo.statusBarHeight;
|
|
|
+ },
|
|
|
+
|
|
|
+ // 获取商家信息
|
|
|
+ async getMerchantAuth() {
|
|
|
+ let res = await getMerchantAuthData();
|
|
|
+ if (res.code == 200) {
|
|
|
+ // 将数据存储到vuex中
|
|
|
+ this.$store.commit('SET_MERCHANTINFO', res.data);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .mine {
|
|
|
- min-height: calc(100vh - 80rpx);
|
|
|
- box-sizing: border-box;
|
|
|
+.mine {
|
|
|
+ min-height: calc(100vh - 80rpx);
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
|
- &__nav {
|
|
|
- background-color: $uni-bg-color-primary;
|
|
|
- }
|
|
|
+ &__nav {
|
|
|
+ background-color: $uni-bg-color-primary;
|
|
|
+ }
|
|
|
|
|
|
- &__person {
|
|
|
- height: 200rpx;
|
|
|
- padding: $uni-bg-padding-sm;
|
|
|
- background-color: $uni-bg-color-primary;
|
|
|
- position: relative;
|
|
|
+ &__person {
|
|
|
+ height: 200rpx;
|
|
|
+ padding: $uni-bg-padding-sm;
|
|
|
+ background-color: $uni-bg-color-primary;
|
|
|
+ position: relative;
|
|
|
|
|
|
- &--icon {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- }
|
|
|
+ &--icon {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
|
|
|
- &--info {
|
|
|
- color: #fff;
|
|
|
- display: flex;
|
|
|
- margin-top: 20rpx;
|
|
|
+ &--info {
|
|
|
+ color: #fff;
|
|
|
+ display: flex;
|
|
|
+ margin-top: 20rpx;
|
|
|
|
|
|
- .userName {
|
|
|
- width: 400rpx;
|
|
|
- font-size: 34rpx;
|
|
|
- margin: 25rpx 0 0 16rpx;
|
|
|
+ .userName {
|
|
|
+ width: 400rpx;
|
|
|
+ font-size: 34rpx;
|
|
|
+ margin: 25rpx 0 0 16rpx;
|
|
|
|
|
|
- >text {
|
|
|
- font-size: 26rpx;
|
|
|
- }
|
|
|
+ > text {
|
|
|
+ font-size: 26rpx;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .status {
|
|
|
- display: flex;
|
|
|
- position: absolute;
|
|
|
- bottom: 80rpx;
|
|
|
- padding-left: 20rpx;
|
|
|
- right: 0;
|
|
|
- width: 150rpx;
|
|
|
- height: 60rpx;
|
|
|
- font-size: 25rpx;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- box-sizing: border-box;
|
|
|
- border-radius: 30rpx 0 0 30rpx;
|
|
|
- background-color: rgba(255, 255, 255, 0.3);
|
|
|
- }
|
|
|
+ .status {
|
|
|
+ display: flex;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 80rpx;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ right: 0;
|
|
|
+ width: 150rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ font-size: 25rpx;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-radius: 30rpx 0 0 30rpx;
|
|
|
+ background-color: rgba(255, 255, 255, 0.3);
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- &__main {
|
|
|
+ &__main {
|
|
|
+ padding: $uni-bg-padding-sm;
|
|
|
+
|
|
|
+ &--purse {
|
|
|
+ background-color: $uni-bg-color;
|
|
|
padding: $uni-bg-padding-sm;
|
|
|
+ border-radius: $uni-border-radius-base;
|
|
|
|
|
|
- &--purse {
|
|
|
- background-color: $uni-bg-color;
|
|
|
- padding: $uni-bg-padding-sm;
|
|
|
- border-radius: $uni-border-radius-base;
|
|
|
+ .wallet {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 28rpx;
|
|
|
|
|
|
- .wallet {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 28rpx;
|
|
|
-
|
|
|
- &--title {
|
|
|
- color: #000;
|
|
|
- font-size: 36rpx;
|
|
|
- font-weight: 700;
|
|
|
- }
|
|
|
-
|
|
|
- &--more {
|
|
|
- color: #333;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
+ &--title {
|
|
|
+ color: #000;
|
|
|
+ font-size: 36rpx;
|
|
|
+ font-weight: 700;
|
|
|
}
|
|
|
|
|
|
- .walletInfo {
|
|
|
- margin: 40rpx 0;
|
|
|
+ &--more {
|
|
|
color: #333;
|
|
|
display: flex;
|
|
|
- text-align: center;
|
|
|
- justify-content: space-around;
|
|
|
- }
|
|
|
-
|
|
|
- .shortcut {
|
|
|
- height: 70rpx;
|
|
|
- padding: 0 20rpx;
|
|
|
- color: #fff;
|
|
|
- font-size: 28rpx;
|
|
|
- display: flex;
|
|
|
+ justify-content: center;
|
|
|
align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- background-color: $uni-bg-color-primary;
|
|
|
- border-radius: $uni-border-radius-sm;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- &--setting {
|
|
|
- margin: 20rpx 0;
|
|
|
- background-color: $uni-bg-color;
|
|
|
- padding: $uni-bg-padding-sm;
|
|
|
- border-radius: $uni-border-radius-base;
|
|
|
+ .walletInfo {
|
|
|
+ margin: 40rpx 0;
|
|
|
+ color: #333;
|
|
|
+ display: flex;
|
|
|
+ text-align: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ }
|
|
|
+
|
|
|
+ .shortcut {
|
|
|
+ height: 70rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 28rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ background-color: $uni-bg-color-primary;
|
|
|
+ border-radius: $uni-border-radius-sm;
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .text-title {
|
|
|
- font-size: 34rpx;
|
|
|
+ &--setting {
|
|
|
+ margin: 20rpx 0;
|
|
|
+ background-color: $uni-bg-color;
|
|
|
+ padding: $uni-bg-padding-sm;
|
|
|
+ border-radius: $uni-border-radius-base;
|
|
|
+ }
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
- .text-data {
|
|
|
- font-size: 40rpx;
|
|
|
- margin: 15rpx 0;
|
|
|
- font-weight: 700;
|
|
|
- }
|
|
|
+.text-title {
|
|
|
+ font-size: 34rpx;
|
|
|
+}
|
|
|
|
|
|
- .text-info {
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
+.text-data {
|
|
|
+ font-size: 40rpx;
|
|
|
+ margin: 15rpx 0;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+.text-info {
|
|
|
+ font-size: 24rpx;
|
|
|
+}
|
|
|
</style>
|