商家端 完成客户评价模块 初始化 店铺管理

src/pages.json

@@ -33,6 +33,24 @@
         "navigationBarTitleText": "店铺"
       }
     },
+    {
+      "path": "pages/tabbar/store/shopManage",
+      "style": {
+        "navigationBarTitleText": "店铺管理"
+      }
+    },
+    {
+      "path": "pages/tabbar/store/evaluateManagement",
+      "style": {
+        "navigationBarTitleText": "评价管理"
+      }
+    },
+    {
+      "path": "pages/tabbar/store/evaluateBack",
+      "style": {
+        "navigationBarTitleText": "回复评价"
+      }
+    },
     {
       "path": "pages/tabbar/mine/index",
       "style": {

src/pages/tabbar/mine/openStore/messageSubmit.vue

@@ -34,7 +34,7 @@
     methods:{
       // 点击跳转到开店详情页面
       handlerSkipComplate(){
-        uni.navigateTo({
+        uni.redirectTo({
           url: '/pages/tabbar/mine/openStore/openStoreAppealDetail'
         })
       }

src/pages/tabbar/mine/openStore/qualificationInformation.vue

@@ -49,7 +49,7 @@
     </view>
 
 
-    <button class="btn" @click="handlerSkipNext">下一步</button>
+    <button class="btn" @click="handlerSkipNext">提交审核</button>
   </view>
 </template>
 

src/pages/tabbar/store/components/evaluateItem.vue

@@ -0,0 +1,133 @@
+<template>
+  <view class="">
+    <view class="item" v-for="item of 3">
+      <view class="item-top">
+        <view class="top-l">
+          <img class="img" src="@/static/QR57a.jpg" alt="">
+          <view class="l-text">
+            <p class="l-name">匿名用户</p>
+            <p class="l-time">2023-11-05</p>
+          </view>
+        </view>
+        <view class="top-r">
+          <p class="r-text">更多</p>
+          <u-icon name="arrow-right" color="#9B9B9B" size="18"></u-icon>
+        </view>
+      </view>
+
+      <view class="rate-box">
+        <span class="rate-text">评分:</span>
+        <u-rate :count="count" v-model="value"></u-rate>
+      </view>
+
+      <view class="content-box">
+        <p class="content-text">服务非常好服务非常好服务非常好服务非常好服务非常好服务非常好服务非常好</p>
+        <view class="content-img-box">
+          <img class="content-img" src="@/static/QR57a.jpg" alt="" v-for="item of 5">
+        </view>
+      </view>
+
+
+      <view class="btn-box">
+        <view class="btn" @click="handlerSkipBack">回复</view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+  export default{
+    data(){
+      return{
+        count: 5,
+        value: 2,
+      }
+    },
+    methods:{
+      // 点击跳转到回复
+      handlerSkipBack(){
+        uni.navigateTo({
+          url:'/pages/tabbar/store/evaluateBack'
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .item{
+    background-color: #fff;
+    padding: 20rpx;
+    margin: 10rpx 0;
+    .item-top{
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .top-l{
+        display: flex;
+        align-items: center;
+          .img{
+            width: 120rpx;
+            height: 120rpx;
+            border-radius: 50%;
+          }
+          .l-text{
+            .l-name{
+              font-size: 28rpx;
+              color: #777777;
+            }
+            .l-time{
+              font-size: 24rpx;
+              color: #777777;
+            }
+          }
+      }
+      .top-r{
+        display: flex;
+        .r-text{
+          font-size: 26rpx;
+          color: #777777;
+        }
+      }
+    }
+
+    .rate-box{
+      display: flex;
+      font-size: 28rpx;
+      color: #777777;
+      margin: 20rpx;
+      .rate-text{
+        margin-right: 10rpx;
+      }
+    }
+
+    .content-box{
+      .content-text{
+
+      }
+      .content-img-box{
+        display: grid;
+        grid-template-columns: 22% 22% 22% 22%;
+        justify-content: space-around;
+        .content-img{
+          width: 180rpx;
+          height: 180rpx;
+        }
+      }
+    }
+    .btn-box{
+      display: flex;
+      justify-content: flex-end;
+      .btn{
+        background-color: #fff;
+        border: 2rpx solid #F56C6C;
+        color: #F56C6C;
+        text-align: center;
+        width: 120rpx;
+        font-size: 26rpx;
+        padding: 10rpx 0;
+        border-radius: 20rpx;
+      }
+    }
+  }
+</style>

src/pages/tabbar/store/evaluateBack.vue

@@ -0,0 +1,97 @@
+<template>
+  <view class="container">
+    <view class="top-box">
+      <u--textarea v-model="value1" placeholder="请输入内容" count></u--textarea>
+    </view>
+
+    <view class="bottom-box">
+      <view class="text-item">
+        <view class="item-l">
+          <span >默认回复</span>
+          <span class='l-text'>(点击文本使用)</span>
+        </view>
+        <view class="item-r" @click="handlerEdit">
+           {{ editType ? '编辑' : '保存' }}
+        </view>
+      </view>
+      <u--textarea :disabled='editType' v-model="value2" placeholder="请输入内容" ></u--textarea>
+    </view>
+
+    <button class="btn" @click="handlerSubmitBtn">提交</button>
+  </view>
+</template>
+
+<script>
+  export default{
+    data(){
+      return{
+        value1:'1111111111',
+        value2:'亲爱的顾客，感谢您认可我们的服务，我们会努力做得更好，祝您生活愉快',
+        editType:true
+      }
+    },
+    methods:{
+      // 点击编辑按钮
+      handlerEdit(){
+        this.editType = !this.editType
+      },
+      // 点击提交按钮
+      handlerSubmitBtn(){
+        uni.showToast({
+          title:'提交成功',
+          icon:'none'
+        })
+        setTimeout(()=>{
+          uni.navigateBack(-1)
+        },1500)
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .container{
+    background-color: #F7F7F7 !important;
+    min-height: 100vh;
+    .top-box,.bottom-box{
+      background-color: #fff;
+      padding: 20rpx;
+      margin: 20rpx;
+    }
+    .bottom-box{
+      .text-item{
+        display:flex;
+        justify-content: space-between;
+        margin-bottom: 20rpx;
+        .item-l{
+          font-size: 28rpx;
+          color: #000;
+          .l-text{
+            font-size: 26rpx;
+            color: #CCCFD5;
+            margin-left: 10rpx;
+          }
+        }
+        .item-r{
+          color: #1C76D2;
+          font-size: 28rpx
+        }
+      }
+    }
+    .btn {
+      background-color: #5992BB !important;
+      color: #fff;
+      font-size: 32rpx;
+      border-radius: 40rpx;
+      margin-top: 40rpx;
+      width: 95%;
+    }
+  }
+
+  ::v-deep view.data-v-81cd9d32, scroll-view.data-v-81cd9d32, swiper-item.data-v-81cd9d32 {
+    background-color: #F7F7F7 !important;
+  }
+  ::v-deep .u-textarea__count.data-v-81cd9d32{
+    background-color: #F7F7F7 !important;
+  }
+</style>

src/pages/tabbar/store/evaluateManagement.vue

@@ -0,0 +1,181 @@
+<template>
+  <view class="container">
+    <view class="top-box">
+      <view class="top-l">
+        <view class="l-l"> {{ value.toFixed(1) }} </view>
+        <view class="l-r">
+          <u-rate :count="count" v-model="value"></u-rate>
+          <p>根据近90天评价计其所得</p>
+        </view>
+      </view>
+      <view class="top-r">
+        <span>更多</span>
+        <u-icon name="arrow-right" color="#9B9B9B" size="18"></u-icon>
+      </view>
+    </view>
+
+    <view class="content-box">
+      <view class="top-box">
+        <u-tabs :list="list1" lineWidth="30" lineColor="$uni-bg-color-primary" :activeStyle="{
+            color: '#000',
+            fontWeight: 'bold',
+            fontSize: '28rpx',
+            transform: 'scale(1.05)',
+            marginBottom: '15rpx',
+          }" :inactiveStyle="{
+            color: '#333',
+            fontSize: '30rpx',
+            transform: 'scale(1)',
+            marginBottom: '15rpx',
+          }"></u-tabs>
+      </view>
+      <view class="item-box">
+        <view class="item" :class="current == index ? 'act-item' : ''" v-for="(item,index) of contentList" @click="handlerSelectItem(item,index)">{{ item.name }}{{ item.numb }}</view>
+      </view>
+      <view class="item-radio-box">
+        <u-radio-group v-model="radiovalue1" placement="row" >
+          <u-radio :customStyle="{margin: '8px'}" v-for="(item, index) in radiolist1" :key="index"
+            :label="item.name" :name="item.name" >
+          </u-radio>
+        </u-radio-group>
+      </view>
+
+    </view>
+
+    <evaluateItem></evaluateItem>
+
+  </view>
+</template>
+
+<script>
+  import evaluateItem from "@/pages/tabbar/store/components/evaluateItem.vue"
+  export default {
+    data() {
+      return {
+        current:0,
+        count: 5,
+        value: 2,
+        list1: [{
+          name: '未回复的评价',
+        }, {
+          name: '全部评价',
+        }],
+        contentList: [{
+            name: '全部',
+            numb: 360
+          },
+          {
+            name: '五星',
+            numb: 21
+          },
+          {
+            name: '四星',
+            numb: 50
+          },
+          {
+            name: '三星',
+            numb: 88
+          },
+          {
+            name: '二星',
+            numb: 72
+          },
+          {
+            name: '一星',
+            numb: 218
+          }
+        ],
+        radiolist1: [{
+            name: '有内容的评价',
+            disabled: false
+          },
+          {
+            name: '有图片的评价',
+            disabled: false
+          }
+        ],
+        // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
+        radiovalue1: '有内容的评价',
+      }
+    },
+    components:{evaluateItem},
+    methods: {
+      // 选择星级
+      handlerSelectItem(item,index){
+        this.current = index
+      },
+      click() {
+
+      },
+
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .container {
+    background-color: #F5F5F5 !important;
+    min-height: calc(100vh - 20rpx);
+    padding-bottom: 20rpx ;
+    .top-box {
+      background-color: #fff;
+      padding: 20rpx 40rpx;
+      display: flex;
+      justify-content: space-between;
+
+      .top-l {
+        display: flex;
+        align-items: center;
+
+        .l-l {
+          margin-right: 20rpx;
+          font-size: 42rpx;
+          color: #D32625;
+          font-weight: bold;
+        }
+
+        .l-r {
+          p {
+            margin-top: 20rpx;
+            font-size: 24rpx;
+            color: #AFAFAF;
+          }
+        }
+      }
+
+      .top-r {
+        display: flex;
+        align-items: center;
+        color: #AFAFAF;
+        font-size: 26rpx;
+      }
+    }
+
+    .content-box {
+      padding: 0 20rpx 20rpx;
+      background-color: #fff;
+      margin: 10rpx 0 ;
+
+      .item-box {
+        display: grid;
+        grid-template-columns: 32% 32% 32%;
+        justify-content: space-between;
+
+        .item,.act-item {
+          border: 2rpx solid #E0E0E0;
+          padding: 10rpx 30rpx;
+          text-align: center;
+          margin: 20rpx;
+          font-size: 26rpx;
+          color: #999999;
+        }
+        .act-item{
+          border: 2rpx solid #87AFCC !important;
+          color: #87AFCC !important;
+        }
+      }
+
+      .item-radio-box {}
+    }
+  }
+</style>

src/pages/tabbar/store/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: yizhiyang
  * @Date: 2023-11-30 09:40:24
- * @Description: 
+ * @Description:
 -->
 <template>
   <view class="shop">
@@ -29,7 +29,7 @@
 
     <view class="shop__tools">
       <u-grid :border="false" col="5">
-        <u-grid-item v-for="(listItem, listIndex) in list" :key="listIndex">
+        <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>
@@ -129,6 +129,23 @@ export default {
       ],
     };
   },
+  methods:{
+    // 点击跳转
+    handlerSkip(item,index){
+      switch(index){
+        case 0:
+          uni.navigateTo({
+            url:'/pages/tabbar/store/shopManage'
+          })
+        break;
+        case 1:
+          uni.navigateTo({
+            url:'/pages/tabbar/store/evaluateManagement'
+          })
+        break;
+      }
+    }
+  }
 };
 </script>
 

src/pages/tabbar/store/shopManage.vue

@@ -0,0 +1,21 @@
+<template>
+  <view class="container">
+    店铺管理
+  </view>
+</template>
+
+<script>
+  export default{
+    data(){
+      return{
+        
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .container{
+    
+  }
+</style>