Jelajahi Sumber

商家端迁移

zxl 11 bulan lalu
induk
melakukan
01ed8dc937

+ 17 - 1
README.md

@@ -35,7 +35,7 @@ https://js.design/ti?c=fMpU7uE9B48CA8a/ // ui图
 
 ### 结构
 ```javascript
-
+| |   |--------------C端--------------|   | |
 | |----pages(主包)
 | |		|----login(登录)
 | |		|		|----login(微信登陆)
@@ -96,4 +96,20 @@ https://js.design/ti?c=fMpU7uE9B48CA8a/ // ui图
 | |		|		|		|----aboutUs(关于我们)
 | |		|		|		|----personInformation(个人信息)
 | |		|
+| |		|
+| |		|
+| |   |---------------B端---------------|   | |
+| |----pageMerchant(商家端)
+| |		|    |----index(商家端主页 自定义tabbar + 各主页面)
+| |		|    |----tabbar(商家端 tabbar页面)
+| |		|    |      |----extend(推广)
+| |		|    |      |----message(消息)
+| |		|    |      |----mine(我的)
+| |		|    |      |----order(订单)
+| |		|    |      |----store(店铺)
+| |		|    |      |
+| |		|    |      |
+| |		|    |      |
+| |		|
+| |		|
 ```

+ 38 - 0
src/pageMerchant/components/customizeTabbar.vue

@@ -0,0 +1,38 @@
+<template>
+  <view class="container">
+    <u-tabbar
+    	:value="tabbarValue"
+    	@change="name => tabbarValue = name"
+    	:fixed="true"
+    	:placeholder="true"
+    	:safeAreaInsetBottom="true"
+    >
+      <u-tabbar-item text="订单" icon="order" ></u-tabbar-item>
+    	<u-tabbar-item text="消息" icon="chat" ></u-tabbar-item>
+    	<u-tabbar-item text="推广" icon="man-add" ></u-tabbar-item>
+      <u-tabbar-item text="店铺" icon="bag" ></u-tabbar-item>
+      <u-tabbar-item text="我的" icon="home" ></u-tabbar-item>
+    </u-tabbar>
+  </view>
+</template>
+
+<script>
+  export default{
+    data(){
+      return{
+        tabbarValue:4
+      }
+    },
+    watch:{
+      tabbarValue:{
+        immediate:true,
+        handler(newValue){
+          this.$emit('tabbarChange',newValue)
+        }
+      }
+    }
+  }
+</script>
+
+<style>
+</style>

+ 33 - 0
src/pageMerchant/index.vue

@@ -0,0 +1,33 @@
+<template>
+  <view class="container">
+    <order v-if='tabCurrent == 0'></order>
+    <message v-if='tabCurrent == 1'></message>
+    <extend v-if='tabCurrent == 2'></extend>
+    <store v-if='tabCurrent == 3'></store>
+    <mine v-if='tabCurrent == 4'></mine>
+    <customizeTabbar @tabbarChange='handlerTabbarChange' ></customizeTabbar>
+  </view>
+</template>
+
+<script>
+  import store from "./tabbar/store"
+  import mine from "./tabbar/mine"
+  import message from "./tabbar/message"
+  import order from "./tabbar/order"
+  import extend from "./tabbar/extend"
+  import customizeTabbar from "./components/customizeTabbar"
+  export default{
+    components:{customizeTabbar, store, mine, message, order, extend},
+    data(){
+      return{
+        tabCurrent:0
+      }
+    },
+    methods:{
+      handlerTabbarChange(e){
+        this.tabCurrent = e
+      }
+    }
+  }
+</script>
+

+ 113 - 0
src/pageMerchant/mineModule/certification/components/ImgsUpload.vue

@@ -0,0 +1,113 @@
+<template>
+  <view class="imageUpload">
+    <view class="images-box" @click="handlerUploadImg" v-if="fileList.length">
+      <image
+        class="upd-img"
+        v-for="(item, index) of fileList"
+        :key="index"
+        :src="item"
+        mode="aspectFill"
+      ></image>
+    </view>
+
+    <view class="images-box" @click="handlerUploadImg" v-else>
+      <image src="/static/upload.jpg" mode="aspectFill"></image>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    value: {
+      type: String,
+      default: '',
+    },
+  },
+  data() {
+    return {
+      uploadCount: 0,
+      fileList: [],
+    };
+  },
+  onLoad(option) {},
+  onShow() {},
+  created() {},
+  methods: {
+    // 上传头像
+    async handlerUploadImg() {
+      try {
+        const res = await uni.showActionSheet({
+          itemList: ['拍照', '从相册选择'],
+        });
+        if (res.tapIndex === 0) {
+          // 用户选择拍照
+          this.takePhoto();
+        } else if (res.tapIndex === 1) {
+          // 用户选择从相册选择
+          this.chooseImage();
+        }
+      } catch (error) {
+        console.error(error);
+      }
+    },
+    // 拍照
+    takePhoto() {
+      uni.chooseImage({
+        sourceType: ['camera'],
+        count: 1 - this.uploadCount,
+        success: res => {
+          const tempFilePaths = res.tempFilePaths;
+          // 调用上传图片的方法
+          tempFilePaths.map(rs => {
+            this.uploadAvatar(rs);
+          });
+        },
+        fail: error => {
+          console.error(error);
+        },
+      });
+    },
+    //从相册中选择
+    chooseImage() {
+      uni.chooseImage({
+        sourceType: ['album'],
+        count: 9 - this.uploadCount,
+        success: res => {
+          const tempFilePaths = res.tempFilePaths;
+          tempFilePaths.map(rs => {
+            this.uploadAvatar(rs);
+          });
+          // 调用上传图片的方法
+        },
+        fail: error => {
+          console.error(error);
+        },
+      });
+    },
+    // 上传头像
+    uploadAvatar(filePath) {
+      // 在这里实现上传头像的逻辑,将filePath作为参数传入
+      this.fileList.push(filePath);
+      this.uploadCount = this.fileList.length;
+      // 手动触发组件的重新渲染
+      this.$forceUpdate();
+      this.$emit('update', this.fileList, this.value);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.imageUpload {
+  .images-box {
+    width: 100%;
+    height: 400rpx;
+    background-color: pink;
+    image {
+      height: 100%;
+      width: 100%;
+    }
+  }
+}
+</style>

+ 82 - 0
src/pageMerchant/mineModule/certification/components/top-process.vue

@@ -0,0 +1,82 @@
+<template>
+  <view class="container">
+    <view class="top-box">
+      <span class="top-title">商家开店流程</span>
+      <view class="process-box">
+        <view class="process-item">
+          <view class="item">
+            1
+          </view>
+          <span>提交资料</span>
+        </view>
+        <view class="border"></view>
+        <view class="process-item">
+          <view class="item">
+            2
+          </view>
+          <span>平台审核</span>
+        </view>
+        <view class="border"></view>
+        <view class="process-item">
+          <view class="item">
+            3
+          </view>
+          <span>开始营业</span>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {
+
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .container {
+    .top-box {
+      background-color: #F7F7F7;
+      padding: 40rpx;
+      border-radius: 20rpx;
+
+      .top-title {
+        font-weight: 600;
+        font-size: 32rpx;
+      }
+
+      .process-box {
+        display: flex;
+        justify-content: space-around;
+        margin-top: 30rpx;
+        width: 100%;
+
+        .process-item {
+          .item {
+            background-color: #5992BB;
+            width: 100rpx;
+            height: 100rpx;
+            border-radius: 50%;
+            color: #fff;
+            font-size: 36rpx;
+            text-align: center;
+            line-height: 100rpx;
+            margin: 0 auto 20rpx;
+          }
+        }
+
+        .border {
+          width: 15%;
+          height: 2rpx;
+          border-bottom: 2rpx solid #000;
+          margin-top: 8%;
+        }
+      }
+    }
+  }
+</style>

+ 118 - 0
src/pageMerchant/mineModule/certification/index.vue

@@ -0,0 +1,118 @@
+<template>
+  <view class="container">
+    <topProcess></topProcess>
+
+    <view class="center-box">
+      <span class="center-title">你需要准备以下材料:</span>
+
+      <view class="content-item-box">
+        <view class="center-item" :key="index" v-for="(item, index) of centerList">
+          <img class="l-img" src="@/static/logo.png" alt="" />
+          <view class="item-r">
+            <p class="r-text1">{{ index + 1 }} 、{{ item.title }}</p>
+            <p class="r-text2">{{ item.content }}</p>
+          </view>
+        </view>
+      </view>
+
+      <view class="radoi-box">
+        <u-checkbox-group v-model="checked">
+          <u-checkbox shape="circle" :name="1" />
+        </u-checkbox-group>
+        <span>我已阅读并同意 <span style="color: #5992bb">《开店说明》</span> </span>
+      </view>
+    </view>
+
+    <button class="btn" @click="handlerSkipOpenShop">我已经准备好了</button>
+  </view>
+</template>
+
+<script>
+import topProcess from './components/top-process.vue';
+export default {
+  data() {
+    return {
+      centerList: [
+        {
+          img: '',
+          title: '实体店照片',
+          content: '需要提供有完整拍的门店照片和真实的内部环境照片',
+        },
+        {
+          img: '',
+          title: '法人身份证',
+          content: '需要提供营业执照的法人身份证正反面照片',
+        },
+        {
+          img: '',
+          title: '营业执照',
+          content: '需要提供有效的营业执照或监管部门认可的具有与营业执照相同法律效力的其他证件',
+        },
+      ],
+      checked: [1],
+    };
+  },
+  components: { topProcess },
+  methods: {
+    // 点击跳转到开店
+    handlerSkipOpenShop() {
+      if (this.checked.length != 0) {
+        uni.navigateTo({
+          url: 'pages/merchant/mine/openStore/storeInformation',
+        });
+      } else {
+        uni.showToast({
+          title: '请阅读并同意开店说明',
+          icon: 'none',
+        });
+        return;
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  padding: 20rpx;
+  .center-box {
+    padding: 20rpx;
+    margin-top: 20rpx;
+    .center-item {
+      display: flex;
+      width: 100%;
+      margin: 20rpx 0;
+      .l-img {
+        width: 35%;
+        height: 180rpx;
+      }
+      .item-r {
+        margin-left: 50rpx;
+        width: 300rpx;
+        flex-wrap: wrap;
+        .r-text1 {
+        }
+        .r-text2 {
+          color: #9e9e9e;
+          font-size: 24rpx;
+          margin-top: 10rpx;
+        }
+      }
+    }
+  }
+  .radoi-box {
+    display: flex;
+    color: #9e9e9e;
+    font-size: 26rpx;
+    margin-top: 40rpx;
+  }
+  .btn {
+    background-color: #5992bb !important;
+    color: #fff;
+    font-size: 32rpx;
+    border-radius: 40rpx;
+    margin-top: 100rpx;
+    width: 80%;
+  }
+}
+</style>

+ 158 - 0
src/pageMerchant/mineModule/openStoreAppealDetail.vue

@@ -0,0 +1,158 @@
+<template>
+  <view class="container">
+    <view class="top-box">
+      <p>您的开店申请已经提交成功。</p>
+      <p>我们将在1-3个工作日内完成线上审核工作,请您耐心等候,并留意审核进程。</p>
+    </view>
+
+    <view class="content-item">
+      <view class="item-l">
+        <p>负责人 : {{ list.legalRepresentativeName || '--' }}</p>
+        <p>手机号 : {{ list.mobileNumber || '--' }}</p>
+      </view>
+      <img class="img" src="@/static/mine/icon_mine_underReview.png" alt="" />
+    </view>
+
+    <view class="content-item">
+      <view class="item-l">
+        <p>店名 : {{ list.merchant.name || '--' }}</p>
+        <p>店铺类型 : {{ list.storeType || '--' }}</p>
+        <p>手机号 : {{ list.mobileNumber || '--' }}</p>
+        <p>所在地 : {{ list.storeAddress || '--' }}</p>
+        <p>详细地址 : {{ list.merchant.address || '--' }}</p>
+      </view>
+    </view>
+
+    <view class="content-item2">
+      <view class="item2-box">
+        <image :src="list.storeImage" mode="" v-if="list.storeImage"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">店铺门面图(需包含完整牌匾)</view>
+      </view>
+      <view class="item2-box">
+        <image :src="list.storeInnerImage" mode="" v-if="list.storeInnerImage"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">店内真实环境</view>
+      </view>
+    </view>
+
+    <view class="content-item2">
+      <view class="item-l">
+        <p>法人姓名 : {{ list.legalRepresentativeName || '--' }}</p>
+        <p>
+          性别 :
+          {{
+            list.legalRepresentativeGender == 1
+              ? '男'
+              : list.legalRepresentativeGender == 2
+              ? '女'
+              : '保密'
+          }}
+        </p>
+        <p>证件号码 : {{ list.idCardNumber || '--' }}</p>
+        <p>有效期 : {{ $u.timeFormat(list.idCardExpirationDate) || '--' }}</p>
+      </view>
+      <view class="item2-box">
+        <image :src="list.idCardFrontPhoto" mode="" v-if="list.idCardFrontPhoto"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">证件正面图(国徽图)</view>
+      </view>
+      <view class="item2-box">
+        <image :src="list.idCardBackPhoto" mode="" v-if="list.idCardBackPhoto"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">证件反面图(人像图)</view>
+      </view>
+    </view>
+
+    <view class="content-item2">
+      <view class="item-l">
+        <p>证件名称 : 营业执照</p>
+        <p>证件编号 : {{ list.businessLicenseId || '--' }}</p>
+        <p>有效期 : {{ $u.timeFormat(list.businessLicenseExpirationDate) || '--' }}</p>
+      </view>
+      <view class="item2-box">
+        <image :src="list.businessPhoto" mode="" v-if="list.businessPhoto"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">证件正面图</view>
+      </view>
+    </view>
+
+    <view class="content-item2">
+      <view class="item-l">
+        <p>证件名称 : 经营许可证</p>
+        <p>证件编号 : {{ list.businessLicenseNumberValid || '--' }}</p>
+        <p>有效期 : {{ $u.timeFormat(list.businessLicenseExpirationDateValid) || '--' }}</p>
+      </view>
+      <view class="item2-box">
+        <image :src="list.businessLicensePhoto" mode="" v-if="list.businessLicensePhoto"></image>
+        <img class="img2" src="@/static/logo.png" alt="" v-else />
+        <view class="img-text">证件正面图</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: {},
+    };
+  },
+  methods: {},
+  onShow() {
+    this.list = this.$store.state.data.merchantInfo;
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.container {
+  padding: 20rpx;
+  background-color: #f5f5f5 !important;
+  .top-box {
+    color: #8b8b8b;
+    padding: 0 20rpx;
+    background-color: #fff;
+  }
+  .content-item {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    background-color: #fff;
+    border-radius: 20rpx;
+    padding: 20rpx;
+    margin: 20rpx 0;
+    .item-l {
+      p {
+        margin: 20rpx 0;
+        line-height: 50rpx;
+      }
+    }
+    .img {
+      width: 130rpx;
+      height: 100rpx;
+    }
+  }
+  .content-item2 {
+    background-color: #fff;
+    border-radius: 20rpx;
+    padding: 20rpx;
+    margin: 20rpx 0;
+    .item-l {
+      p {
+        margin: 20rpx 0;
+        line-height: 50rpx;
+      }
+    }
+    .item2-box {
+      text-align: center;
+      margin-bottom: 20rpx;
+      .img2 {
+        width: 100%;
+        height: 400rpx;
+      }
+    }
+  }
+}
+</style>

+ 143 - 0
src/pageMerchant/mineModule/personalInfo.vue

@@ -0,0 +1,143 @@
+<template>
+  <view class="personalInfo">
+    <!-- 账号信息 -->
+    <view>
+      <text class="title">账号信息</text>
+      <view class="personal">
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">店铺LOGO</view>
+          <view class="fl-flex">
+            <image :src="list.merchant.logo" mode="scaleToFill" v-if="list.merchant.logo" />
+            <image src="/static/QR57a.jpg" mode="scaleToFill" v-else />
+            <u-icon name="arrow-right" color="#acaeb6" size="16"></u-icon>
+          </view>
+        </view>
+        <view
+          class="fl-flex fl-justify-between fl-align-center"
+          @click="handleEditMerchant('店铺名称', list.storeName)"
+        >
+          <view class="item-left">店铺名称</view>
+          <view class="fl-flex">
+            <view class="item-right">{{ list.storeName || '--' }}</view>
+            <u-icon name="arrow-right" color="#acaeb6" size="16"></u-icon>
+          </view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">登录账号</view>
+          <view class="fl-flex">
+            <view class="item-right u-m-r-10">{{ mobileNumber || '--' }}</view>
+            <!-- <u-icon name="arrow-right" color="#acaeb6" size="15"></u-icon> -->
+          </view>
+        </view>
+      </view>
+    </view>
+    <!-- 联系方式 -->
+    <view>
+      <text class="title">联系方式</text>
+      <view class="personal">
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">负责人</view>
+          <view class="item-right">{{ list.merchant.liaison || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">联系电话</view>
+          <view class="item-right">{{ list.mobileNumber || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">电子邮箱</view>
+          <view class="item-right">{{ list.email || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">预约电话</view>
+          <view class="item-right">{{ list.mobileNumber || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">所在地区</view>
+          <view class="item-right">{{ list.storeAddress || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">店铺地址</view>
+          <view class="item-right">{{ list.storeAddressDetail || '--' }}</view>
+        </view>
+      </view>
+    </view>
+    <!-- 店铺信息 -->
+    <view>
+      <text class="title">店铺信息</text>
+      <view class="personal">
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">店铺名称</view>
+          <view class="item-right">{{ list.storeName || '--' }}</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">主营/辅营</view>
+          <view class="item-right">养车/用车</view>
+        </view>
+        <view class="fl-flex fl-justify-between fl-align-center">
+          <view class="item-left">开店日期</view>
+          <view class="item-right">2023-10-23</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import { phoneEncryption } from '@/utils/tools';
+
+export default {
+  data() {
+    return {
+      list: {},
+      mobileNumber: '',
+    };
+  },
+  onShow() {
+    this.list = this.$store.state.data.merchantInfo;
+    this.mobileNumber = phoneEncryption(this.list.mobileNumber);
+  },
+  methods: {
+    handleEditMerchant(name, value) {
+      uni.navigateTo({
+        url: `pages/merchant/mine/personalInfoEdit?name=${name}&value=${value}`,
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.personalInfo {
+  min-height: 100%;
+  margin: 20rpx 30rpx;
+  .title {
+    color: #666666;
+    margin: 20rpx;
+  }
+  .personal {
+    background-color: #fff;
+    padding: 20rpx;
+    margin-bottom: 30rpx;
+    margin-top: 20rpx;
+    border-radius: 10rpx;
+
+    .item-left {
+      color: #333;
+      font-size: 30rpx;
+      font-weight: 600;
+      margin: 20rpx 0;
+    }
+
+    .item-right {
+      color: #acaeb6;
+      font-size: 28rpx;
+    }
+
+    image {
+      width: 120rpx;
+      height: 120rpx;
+      border-radius: 50%;
+    }
+  }
+}
+</style>

+ 34 - 0
src/pageMerchant/mineModule/storeEnviron.vue

@@ -0,0 +1,34 @@
+<template>
+  <view class="storeEnviron">
+    <view class="text-center environ">
+      <ImgsUpload></ImgsUpload>
+      <view style="margin: 20rpx 0">门店图</view>
+    </view>
+    <view class="text-center u-m-t-40 environ">
+      <ImgsUpload></ImgsUpload>
+      <view style="margin: 20rpx 0">门店图</view>
+    </view>
+
+    <view style="margin-top: 140rpx">
+      <u-button type="primary" text="确定" shape="circle"></u-button>
+    </view>
+  </view>
+</template>
+
+<script>
+import ImgsUpload from './certification/components/ImgsUpload.vue';
+export default {
+  components: { ImgsUpload },
+};
+</script>
+
+<style lang="scss" scoped>
+.storeEnviron {
+  height: 100vh;
+  padding: 20rpx;
+  background-color: #fff;
+  .environ {
+    margin: 20rpx;
+  }
+}
+</style>

+ 11 - 0
src/pageMerchant/tabbar/extend.vue

@@ -0,0 +1,11 @@
+<template>
+  <view class="container">
+    extend
+  </view>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

+ 187 - 0
src/pageMerchant/tabbar/message.vue

@@ -0,0 +1,187 @@
+<!--
+ * @Author: yizhiyang
+ * @Date: 2023-11-30 09:40:24
+ * @Description:
+-->
+<template>
+  <view class="message">
+    <view class="message__like">
+      <view v-for="item in list" :key="item.id">
+        <image
+          slot="icon"
+          src="@/static/tools.jpg"
+          style="width: 80rpx; height: 80rpx"
+        />
+        <view class="message__like--text">{{ item.name }}</view>
+      </view>
+    </view>
+
+    <view class="message__note" v-for="value in systemList" :key="value.id" @click="handlerSkipSystemNotice(value)">
+      <image
+        slot="icon"
+        src="@/static/tools.jpg"
+        style="width: 80rpx; height: 80rpx"
+      />
+      <view class="message__note--info">
+        <view class="">
+          <view class="systemTitle">{{ value.name }}</view>
+          <view class="textInfo">{{ value.info }}</view>
+        </view>
+        <view class="message__note--flex">
+          <view class="textInfo">{{ value.time }}</view>
+          <view style="width: 40rpx; height: 40rpx">
+            <u-badge
+              numberType="ellipsis"
+              type="primary"
+              :value="value.num"
+              shape="circle"
+            ></u-badge>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <view class="message__note" v-for="value in systemList1" :key="value.id">
+      <image
+        slot="icon"
+        src="@/static/QR57a.jpg"
+        style="width: 80rpx; height: 80rpx"
+      />
+      <view class="message__note--info">
+        <view class="">
+          <view class="systemTitle">{{ value.name }}</view>
+          <view class="textInfo">{{ value.info }}</view>
+        </view>
+        <view class="message__note--flex">
+          <view class="textInfo">{{ value.time }}</view>
+          <view style="width: 40rpx; height: 40rpx">
+            <u-badge
+              numberType="ellipsis"
+              type="primary"
+              :value="value.num"
+              shape="circle"
+            ></u-badge>
+          </view>
+        </view>
+      </view>
+    </view>
+	<tabbar currentTab="merchantMessage" />
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      list: [
+        {
+          id: '1',
+          name: '新的赞',
+        },
+        {
+          id: '2',
+          name: '评论',
+        },
+        {
+          id: '3',
+          name: '好友',
+        },
+      ],
+      systemList: [
+        {
+          id: '1',
+          name: '系统通知',
+          info: '您修改的店铺LOGO审核未通过',
+          time: '23小时',
+          num: '99+',
+        },
+        {
+          id: '2',
+          name: '订单通知',
+          info: '附近暂无配送员接单,订单已关闭。',
+          time: '刚刚',
+          num: '9',
+        },
+        {
+          id: '3',
+          name: '活动通知',
+          info: '您修改的店铺LOGO审核未通过。',
+          time: '10-26',
+          num: '23',
+        },
+      ],
+
+      systemList1: [
+        {
+          id: '1',
+          name: 'yizhiyang',
+          info: '在吗??',
+          time: '23小时',
+          num: '2',
+        },
+        {
+          id: '2',
+          name: '易只烊',
+          info: '请问这个怎么烊???',
+          time: '刚刚',
+          num: '9',
+        },
+      ]
+    }
+  },
+  methods:{
+    // 点击跳转到系统通知
+    handlerSkipSystemNotice(value){
+      uni.navigateTo({
+        url:`/pages/merchant/message/systemNotice?type=${value.id}`
+      })
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.message {
+  background-color: $uni-bg-color;
+  min-height: calc(100vh - 80rpx);
+  padding-top: 80rpx;
+  &__like {
+    text-align: center;
+    color: #333;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    padding: 30rpx;
+    &--text {
+      margin-top: 10rpx;
+    }
+  }
+  &__note {
+    display: flex;
+    padding: 20rpx;
+    &--info {
+      flex: 1;
+      margin-left: 20rpx;
+      padding-bottom: 18rpx;
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 2rpx solid #eeeded;
+    }
+    &--flex {
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      align-items: center;
+    }
+
+    .textInfo {
+      font-size: 24rpx;
+      color: #666;
+    }
+    .systemTitle {
+      font-size: 36rpx;
+      margin-bottom: 10rpx;
+    }
+  }
+}
+</style>

+ 387 - 0
src/pageMerchant/tabbar/mine.vue

@@ -0,0 +1,387 @@
+<template>
+  <view class="mine">
+    <!-- 状态栏占位 -->
+    <view class="mine__nav" :style="{ height: 77 + 'px' }" />
+    <view class="mine__person">
+      <view class="mine__person--info">
+        <view @click="handlerSkipUserInfo">
+          <image
+            :src="merchantInfo.merchant.logo"
+            style="width: 140rpx; height: 140rpx; border-radius: 50%"
+            v-if="merchantInfo.merchant.logo"
+          />
+          <image
+            src="@/static/QR57a.jpg"
+            style="width: 140rpx; height: 140rpx; border-radius: 50%"
+            v-else
+          />
+        </view>
+        <view class="userName">
+          <view>
+            <view v-if="merchantInfo.storeName"> {{ merchantInfo.storeName }}</view>
+            <view v-else> 微信用户</view>
+          </view>
+          <view>
+            <view v-if="merchantInfo.mobileNumber" class="text">
+              +86 {{ merchantInfo.mobileNumber }}
+            </view>
+            <view v-else class="text">
+              <text style="color: #f6bf3f"> 您当前还未认证,</text> <span @click="toApprove">去认证></span>
+            </view>
+          </view>
+        </view>
+        <view
+          class="status"
+          :style="{ 'background-color': getStatusColor(state) }"
+          @click="show = true"
+        >
+          <view style="margin-right: 6rpx">{{ stateName }}</view>
+          <u-icon name="play-right-fill" color="#fff" size="12" />
+        </view>
+      </view>
+    </view>
+
+    <view class="mine__main">
+      <view class="mine__main--purse">
+        <view class="wallet">
+          <view class="wallet--title">我的钱包</view>
+          <view class="wallet--more">
+            <text>查看钱包余额</text>
+            <u-icon name="arrow-right" color="#333" size="14" />
+          </view>
+        </view>
+        <view class="walletInfo">
+          <view v-for="index in 4" :key="index">
+            <view class="text-title">借钱(元)</view>
+            <view class="text-data">
+              30
+              <text style="font-size: 24rpx; margin-left: 5rpx">万</text>
+            </view>
+            <view class="text-info">最高可用</view>
+          </view>
+        </view>
+        <view class="shortcut">
+          <view style="display: flex">
+            <view>快捷支付</view>
+            <view style="margin: 0 20rpx">|</view>
+            <view>一银升级银行卡用于麦付</view>
+          </view>
+          <u-icon name="arrow-right" color="#fff" size="14" />
+        </view>
+      </view>
+
+      <view class="mine__main--setting">
+        <template v-for="item in list1">
+          <u-cell size="large" :border="false" :key="item.name" :title="item.name" isLink :url="item.url">
+            <image slot="icon" src="@/static/tools.jpg" style="width: 60rpx; height: 60rpx" />
+          </u-cell>
+        </template>
+      </view>
+
+      <view class="mine__main--setting">
+        <template v-for="item in list2" @click="tap(item)">
+          <u-cell size="large" :border="false" @tap="" :key="item.name" :title="item.name" isLink :url="item.url">
+            <image slot="icon" src="@/static/tools.jpg" style="width: 60rpx; height: 60rpx" />
+          </u-cell>
+        </template>
+      </view>
+    </view>
+
+    <!-- 营业状态选择弹框 -->
+    <u-picker
+      :show="show"
+      :columns="columns"
+      @cancel="cancel"
+      @confirm="confirm"
+      keyName="label"
+    ></u-picker>
+
+    <!-- 商家认证的弹框 -->
+    <u-modal
+      :show="showAut"
+      :title="title"
+      :content="content"
+      :confirmText="'开始认证'"
+      :cancelText="'返回用户端'"
+      :showCancelButton="true"
+      @confirm="confirmSwitch"
+      @cancel="showAut = false"
+    ></u-modal>
+
+    <!-- <tabbar currentTab="merchantMine" /> -->
+  </view>
+</template>
+
+<script>
+import { getMerchantAuthData } from '@/api/merchant/merchantAuth';
+import { updateBusinessStatus } from '@/api/merchant/mine';
+import { phoneEncryption } from '@/utils/tools';
+
+export default {
+  data() {
+    return {
+      state: 0,
+      stateName: '营业中',
+      show: false,
+      showAut: false,
+      title: '商家认证',
+      content: '进入商家端前,我们需要一定的认证',
+      merchantInfo: {},
+      columns: [
+        // 营业状态 0-营业中,1-休息中
+        [
+          {
+            label: '营业中',
+            id: '0',
+          },
+          {
+            label: '休息中',
+            id: '1',
+          },
+        ],
+      ],
+      list1: [
+        {
+          id: '1',
+          name: '门店环境',
+          url: '/pageMerchant/mineModule/storeEnviron',
+        },
+        // {
+        //   id: '2',
+        //   name: '我要开店',
+        //   url: '/pages/merchant/mine/openStore/index',
+        // },
+        {
+          id: '3',
+          name: '资质信息',
+          url: '/pageMerchant/mineModule/openStoreAppealDetail',
+        },
+      ],
+
+      list2: [
+        {
+          id: '1',
+          name: '帮助中心',
+          url: '',
+        },
+        {
+          id: '2',
+          name: '设置',
+          url: '/pages/merchant/mine/setting/index',
+        },
+      ],
+    };
+  },
+
+  onShow() {
+    this.getMerchantAuth();
+    setTimeout(() => {
+      if (this.merchantInfo) {
+        this.showAut = false;
+      } else {
+        this.showAut = true;
+      }
+    }, 300);
+  },
+
+  methods: {
+    tap(item) {
+      console.log('item', item);
+    },
+
+    // changeStatus() {
+    //   this.show = true;
+    // },
+
+    // 开始认证
+    confirmSwitch() {
+      uni.navigateTo({
+        url:'/pageMerchant/mineModule/certification/index'
+      });
+    },
+    // handelCancel() {
+    //   uni.switchTab({
+    //     url: '/pages/client/tabBar/home/index',
+    //   });
+    // },
+    // 修改商家状态
+    confirm(val) {
+      this.state = val.value[0].id;
+      this.stateName = val.value[0].label;
+      this.show = false;
+
+      updateBusinessStatus(this.merchantInfo.merchant.id, { businessStatus: this.state }).then(
+        res => {
+          if (res.code === 'OK') {
+            this.$u.toast('修改成功');
+          }
+        },
+      );
+    },
+
+    getStatusColor(state) {
+      if (state === 0) {
+        return '#19be6b';
+      } else if (state === 1) {
+        return '#ff9900';
+      }
+    },
+
+    // 点击跳转到设置
+    handlerSkipSetting() {
+      uni.navigateTo({
+        url: '/pages/merchant/mine/setting/index',
+      });
+    },
+
+    // 获取商家信息
+    async getMerchantAuth() {
+      let res = await getMerchantAuthData();
+      if (res.code === 'OK') {
+        // 将数据存储到vuex中
+        this.merchantInfo = Object.assign(
+          {},
+          {
+            ...res.data,
+            mobileNumber: phoneEncryption(res.data.mobileNumber),
+          },
+        );
+        this.$store.commit('SET_MERCHANTINFO', res.data);
+      }
+    },
+
+	// 跳转到商家认证
+	toApprove(){
+		uni.navigateTo({
+			url:'/pageMerchant/mineModule/certification/index'
+		})
+	},
+  // 点击跳转到个人信息
+  handlerSkipUserInfo(){
+    uni.navigateTo({
+      url:'/pageMerchant/mineModule/personalInfo'
+    })
+  }
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.mine {
+  min-height: calc(100vh - 80rpx);
+  box-sizing: border-box;
+
+  &__nav {
+    background-color: $uni-bg-color-primary;
+  }
+
+  &__person {
+    height: 160rpx;
+    padding: $uni-bg-padding-sm;
+    background-color: $uni-bg-color-primary;
+    position: relative;
+
+    &--info {
+      color: #fff;
+      display: flex;
+
+      .userName {
+        width: 400rpx;
+        font-size: 36rpx;
+        margin: 20rpx 0 0 16rpx;
+
+        .text {
+          margin-top: 15rpx;
+          font-size: 28rpx;
+        }
+      }
+
+      .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 {
+    padding: $uni-bg-padding-sm;
+
+    &--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;
+
+        &--title {
+          color: #000;
+          font-size: 36rpx;
+          font-weight: 700;
+        }
+
+        &--more {
+          color: #333;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+        }
+      }
+
+      .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;
+      }
+    }
+
+    &--setting {
+      margin: 20rpx 0;
+      background-color: $uni-bg-color;
+      padding: $uni-bg-padding-sm;
+      border-radius: $uni-border-radius-base;
+    }
+  }
+}
+
+.text-title {
+  font-size: 34rpx;
+}
+
+.text-data {
+  font-size: 40rpx;
+  margin: 15rpx 0;
+  font-weight: 700;
+}
+
+.text-info {
+  font-size: 24rpx;
+}
+</style>

+ 90 - 0
src/pageMerchant/tabbar/order.vue

@@ -0,0 +1,90 @@
+<template>
+  <view>
+    <view class="order">
+      <view style="background-color: #fff; padding: 15rpx">
+        <u-tabs
+          :list="list1"
+          lineWidth="30"
+          lineColor="$uni-bg-color-primary"
+          :activeStyle="{
+            color: '#000',
+            fontWeight: 'bold',
+            fontSize: '32rpx',
+            transform: 'scale(1.05)',
+            marginBottom: '15rpx',
+          }"
+          :inactiveStyle="{
+            color: '#333',
+            fontSize: '30rpx',
+            transform: 'scale(1)',
+            marginBottom: '15rpx',
+          }"
+          itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
+          @click="handlerChangeItem"
+        ></u-tabs>
+      </view>
+
+      <!-- <orderItem :list="orderList" :typeStyle.sync="typeStyle"></orderItem> -->
+    </view>
+    <tabbar currentTab="merchantOrder" />
+  </view>
+</template>
+
+<script>
+// import orderItem from '@/pages/merchant/order/components/orderItem.vue';
+import { getOrderListApi } from '@/api/merchant/order';
+export default {
+  // components: { orderItem },
+  data() {
+    return {
+      list1: [
+        { id: '0', name: '全部' },
+        { id: '1', name: '待核销' },
+        { id: '2', name: '已核销' },
+        { id: '3', name: '退款' },
+      ],
+      orderList: [],
+      params: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      typeStyle: 0,
+      status: '0',
+    };
+  },
+
+  methods: {
+    // 点击切换顶部导航栏
+    handlerChangeItem(item) {
+      this.typeStyle = item.index;
+      this.getOrderList(item.id);
+    },
+
+    async getOrderList(status) {
+      let result = Object.assign(
+        {},
+        {
+          paging: `${this.params.pageNum},${this.params.pageSize}`,
+          status: status || 0,
+        },
+      );
+      let res = await getOrderListApi({ ...result });
+      if (res.code === 'OK') {
+        this.orderList = res.data.records;
+      }
+    },
+  },
+
+  onShow() {
+    this.getOrderList();
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.order {
+  min-height: calc(100vh - 80rpx);
+  background-color: $uni-bg-color-page;
+  padding-top: 80rpx;
+}
+</style>

+ 256 - 0
src/pageMerchant/tabbar/store.vue

@@ -0,0 +1,256 @@
+<template>
+  <view class="shop">
+    <view style="height: 85rpx" />
+    <view class="shop__data">
+      <view class="shop__data--left">
+        <view class="text-title">店铺分</view>
+        <view class="text-num">{{ store.score || '--' }}</view>
+      </view>
+      <view class="shop__data--right">
+        <view>
+          <view class="text-title">今日收入(元)</view>
+          <view class="text-num">{{ store.amount || '0' }}</view>
+        </view>
+        <view class="line"></view>
+        <view>
+          <view class="text-title">今日订单(单)</view>
+          <view class="text-num">{{ store.orderCount || '0' }}</view>
+        </view>
+      </view>
+    </view>
+
+    <view class="shop__note">
+      <u-notice-bar :text="text1"></u-notice-bar>
+    </view>
+
+    <view class="shop__tools">
+      <u-grid :border="false" col="5">
+        <u-grid-item
+          v-for="(listItem, listIndex) in list"
+          :key="listIndex"
+          @click="handlerSkip(listItem, listIndex)"
+        >
+          <image src="@/static/tools.jpg" />
+          <text class="grid-text">{{ listItem.title }}</text>
+        </u-grid-item>
+      </u-grid>
+    </view>
+
+    <view class="shop__note" style="background-color: #fff">
+      <u-cell-group>
+        <u-cell size="large" :border="false" title="规制中心" isLink url=""></u-cell>
+      </u-cell-group>
+    </view>
+
+    <view>
+      <u-tabs
+        :list="list1"
+        lineWidth="40"
+        lineColor="$uni-bg-color-primary"
+        :activeStyle="{
+          color: '#000',
+          fontWeight: 'bold',
+          fontSize: '32rpx',
+          transform: 'scale(1.05)',
+          marginBottom: '15rpx',
+        }"
+        :inactiveStyle="{
+          color: '#333',
+          fontSize: '30rpx',
+          transform: 'scale(1)',
+          marginBottom: '15rpx',
+        }"
+        itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;"
+      ></u-tabs>
+
+      <view style="background-color: #fff; height: 400rpx; margin-top: 20rpx"> 1111111111 </view>
+    </view>
+    <tabbar currentTab="merchantStore" />
+  </view>
+</template>
+
+<script>
+import { getOrderQuantityApi } from '@/api/merchant/order';
+export default {
+  data() {
+    return {
+      text1:
+        'uView UI众多组件覆盖开发过程的各个需求,组件功能丰富,多端兼容。让您快速集成,开箱即用',
+
+      list1: [
+        {
+          name: '商家社区',
+        },
+        {
+          name: '活动中心',
+        },
+        {
+          name: '商品优惠',
+        },
+      ],
+
+      list: [
+        {
+          title: '店铺管理',
+        },
+        {
+          title: '顾客评价',
+        },
+        {
+          title: '商品核销',
+        },
+        {
+          title: '商品优惠',
+        },
+        {
+          title: '经营数据',
+        },
+        {
+          title: '我的团队',
+        },
+        {
+          title: '活动中心',
+        },
+        {
+          title: '当前佣金',
+        },
+        {
+          title: '商家社区',
+        },
+        {
+          title: '预约列表',
+        },
+      ],
+      store: {
+        amount: 0,
+        orderCount: 0,
+        score: 0,
+      },
+
+      merchantId: '',
+    };
+  },
+  onShow() {
+    // 获取商家id
+    let merchantInfo = this.$store.state.data.merchantInfo;
+    this.merchantId = merchantInfo.merchant.id;
+
+    // 查商家端查询订单量以及今日收入
+    this.getOrderQuantity(this.merchantId);
+
+    console.log(this.merchantId, 'ooooooooooo');
+  },
+
+  methods: {
+    // 点击跳转
+    handlerSkip(item, index) {
+      console.log('index', index);
+      switch (index) {
+        case 0:
+          uni.navigateTo({
+            url: '/pages/merchant/store/shopManage',
+          });
+          break;
+        case 1:
+          uni.navigateTo({
+            url: '/pages/merchant/store/evaluateManagement',
+          });
+          break;
+        case 3:
+          uni.navigateTo({
+            url: '/pages/merchant/store/couponManage',
+          });
+          break;
+        case 5:
+          uni.navigateTo({
+            url: '/pages/merchant/store/myTeam',
+          });
+          break;
+        case 9:
+          uni.navigateTo({
+            url: '/pages/merchant/store/appointList',
+          });
+          break;
+      }
+    },
+    async getOrderQuantity(id) {
+      let res = await getOrderQuantityApi(id);
+      if (res.code === 200) {
+        // this.orderCount = res.data.orderCount;
+        this.store = Object.assign({}, { ...this.store }, { ...res.data });
+        console.log(this.store, 'this.store');
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.text-title {
+  font-size: 28rpx;
+  color: #333;
+  margin-bottom: 20rpx;
+}
+
+.text-num {
+  font-size: 40rpx;
+  font-weight: bold;
+  color: $uni-bg-color-primary;
+}
+
+.shop {
+  min-height: calc(100vh - 80rpx);
+  background-color: $uni-bg-color-page;
+  padding-top: 80rpx;
+  &__data {
+    display: flex;
+    text-align: center;
+
+    &--left {
+      flex: 1;
+      padding: 30rpx 20rpx;
+      background-color: $uni-bg-color;
+      margin-right: 20rpx;
+      border-radius: $uni-border-radius-base;
+    }
+
+    &--right {
+      flex: 3;
+      display: flex;
+      justify-content: space-around;
+      padding: 30rpx 20rpx;
+      background-color: $uni-bg-color;
+      border-radius: $uni-border-radius-base;
+      .line {
+        width: 2rpx;
+        height: 65%;
+        margin-top: 35rpx;
+        background-color: #f5f5f5;
+      }
+    }
+  }
+
+  &__note {
+    margin: 30rpx 0;
+  }
+
+  /* 工具 */
+  &__tools {
+    padding: 20rpx 10rpx;
+    background-color: $uni-bg-color;
+    border-radius: $uni-border-radius-base;
+    image {
+      width: 100rpx;
+      height: 100rpx;
+      display: block;
+      margin: 15rpx 0 25rpx 0;
+    }
+  }
+}
+
+::v-deep .u-cell__title-text {
+  border: 0;
+  font-weight: bold;
+  font-size: 36rpx;
+}
+</style>

+ 37 - 1
src/pages.json

@@ -235,7 +235,43 @@
       		"navigationBarTitleText": "关于我们"
       	}
       }]
-		}
+		},
+    {
+      "root": "pageMerchant",
+      "pages": [
+        {
+          "path": "index",
+          "style": {
+          	"navigationBarTitleText": "",
+            "navigationStyle": "custom"
+          }
+        },
+        {
+          "path": "mineModule/personalInfo",
+          "style": {
+          	"navigationBarTitleText": "店铺信息"
+          }
+        },
+        {
+          "path": "mineModule/storeEnviron",
+          "style": {
+          	"navigationBarTitleText": "门店环境"
+          }
+        },
+        {
+          "path": "mineModule/openStoreAppealDetail",
+          "style": {
+          	"navigationBarTitleText": "资质信息"
+          }
+        },
+        {
+          "path": "mineModule/certification/index",
+          "style": {
+          	"navigationBarTitleText": "我要开店"
+          }
+        }
+      ]
+    }
 	],
 	"tabBar": {
 		"color": "#999999",

+ 2 - 2
src/pages/tabbar/components/TapList.vue

@@ -91,9 +91,9 @@
 
     confirmSwitch() {
       this.showSwitchDialog = false;
-      this.$store.dispatch('SwitchIdentity','MERCHANT')
+      // this.$store.dispatch('SwitchIdentity','MERCHANT')
       uni.navigateTo({
-        url: '/pages/merchant/mine/index',
+        url: '/pageMerchant/index',
       });
     },
   },