✨ feat(相关页面): 完善C/B端相关组件在页面的功能逻辑

@@ -2,22 +2,17 @@
   <div class="book-item van-hairline--bottom" @click="handle">
     <van-row>
       <van-col span="6">
-        <van-image
-          width="5rem"
-          height="5rem"
-          :src="item.avatar"
-          style="text-align: center;"
-        />
+        <van-image width="5rem" height="5rem" :src="item.avatar" style="text-align: center;" />
       </van-col>
-      <van-col span="18" style="padding-left: 1rem;">
-        <p style="font-size: 1.15rem; color: #222222; font-weight: bold;">逃家小兔绘本</p>
-        <div style="font-size: 0.85rem; color: #999999; margin: 0.5rem 0;" class="van-multi-ellipsis--l2">
+      <van-col class="wrapper" span="18">
+        <p class="title">逃家小兔绘本</p>
+        <div v-if="type === 'C'" class="van-multi-ellipsis--l2 content">
           从前有一只小兔子，总是想要离家出走。有一天，他对妈妈说如果有大灰狼怎么办，不要把门打开
         </div>
-        <div style="font-size: 0.85rem; color: #999999; margin-top: 0.5rem;">
-          <van-icon :name="icon_video" />
-          54个作品
+        <div class="sub">
+          <van-icon :name="icon_video" />&nbsp;&nbsp;<span>54个作品</span>
         </div>
+        <div v-if="type === 'B'" class="upload" @click="onUpload(item)"> 上传视频 </div>
       </van-col>
     </van-row>
   </div>
@@ -28,11 +23,19 @@ import icon_video from '@images/video.png'
 
 import { ref, reactive, onMounted } from 'vue'
 const props = defineProps({
-  item: Object
+  item: Object,
+  type: String
 })
 const emit = defineEmits(['on-click']);
 const handle = () => {
+  if (props.type === 'C') { // 类型是客户端时，才能查看
     emit('on-click', '')
+  }
+}
+
+// 上传视频
+const onUpload = (v) => {
+    console.warn(v);
 }
   onMounted(() => {
     
@@ -59,5 +62,33 @@ export default {
   .book-item {
     margin: 1rem;
     padding: 1rem;
+    .wrapper {
+      padding-left: 1rem;
+      .title {
+        font-size: 1.15rem; 
+        color: #222222; 
+        font-weight: bold;
+      }
+      .content {
+        font-size: 0.85rem; 
+        color: #999999; 
+        margin: 0.5rem 0;
+      }
+      .sub {
+        font-size: 0.85rem; 
+        color: #999999; 
+        margin-top: 0.5rem;
+      }
+      .upload {
+        color: #713610; 
+        background-color: #F9D95C; 
+        border-radius: 15px; 
+        width: 4rem; 
+        padding: 0.25rem 0.5rem; 
+        font-size: 0.8rem; 
+        text-align: center; 
+        margin-top: 1rem;
+      }
+    }
   }
 </style>
\ No newline at end of file

 <template>
   <div>
-    <img @click="toHome" class="icon-home" referrerpolicy="no-referrer" :src="icon_home" />
-    <img @click="toMe" class="icon-me" referrerpolicy="no-referrer" :src="icon_me" />
+    <img v-if="isHome" @click="toHome" class="icon-home" referrerpolicy="no-referrer" :src="icon_home" />
+    <img v-if="isMe" @click="toMe" class="icon-me" referrerpolicy="no-referrer" :src="icon_me" />
   </div>
 </template>
 
@@ -10,9 +10,9 @@ import icon_me from '@images/icon-my@2x.png'
 import icon_home from '@images/icon-home@2x.png'
 
 import { ref, reactive, onMounted } from 'vue'
-const props = defineProps({
-  type: String
-})
+// const props = defineProps({
+//   type: String
+// })
 const emit = defineEmits(['on-click']);
 const handle = () => {
   emit('on-click', '')
@@ -24,27 +24,47 @@ const handle = () => {
 
 <script>
 export default {
+  props: ['type', 'item'],
   data () {
     return {
 
     }
   },
+  computed: {
+    isHome () {
+      return this.item.indexOf('home') !== -1 ? true : false
+    },
+    isMe () {
+      return this.item.indexOf('me') !== -1 ? true : false
+    }
+  },
   mounted () {
-
   },
   methods: {
     toHome () {
       // 返回首页
+      if (this.type === 'B') { // 服务端判断
+        this.$router.push({
+          path: '/business/index'
+        });
+      } else {
         this.$router.push({
           path: '/client/index'
         });
+      }
     },
     toMe () {
+      if (this.type === 'B') { // 服务端判断
+        this.$router.push({
+          path: '/business/me'
+        });
+      } else {
         this.$router.push({
           path: '/me/index'
         });
       }
     }
+  }
 }
 </script>
 

@@ -45,11 +45,11 @@
         </van-row>
       </div>
       <template v-for="(item, key) in items" :key="key">
-        <book-card :item="item" @on-click="onClick(item)"></book-card>
+        <book-card :item="item" type="B" @on-click="onClick(item)"></book-card>
       </template>
     </div>
     <div style="height: 1rem;"></div>
-    <shortcut-fixed @on-click="gotoMe()"></shortcut-fixed>
+    <shortcut-fixed type="B" :item="['me']"></shortcut-fixed>
   </div>
 </template>
 

 <template>
-  <div class=""></div>
+  <div style="background: linear-gradient(310deg, #FDD347 0%, #FFED6D 100%); padding: 1rem; text-align: center;">
+    <van-image round width="4rem" height="4rem" src="https://lanhu.oss-cn-beijing.aliyuncs.com/SketchPng52f007e83aa3baa494a5c9947e8c5bf537f267bce528e54b104995300d55c956" />
+    <p style="margin-top: 1rem; font-size: 1.05rem; font-weight: bold;">杨浦民办科技幼稚园</p>
+  </div>
+  <template v-for="(item, key) in itemList" :key="key">
+    <div class="van-hairline--bottom item-list" @click="goTo(item.to)">
+      <van-row>
+        <van-col span="12">{{ item.name }}</van-col>
+        <van-col span="12" style="text-align: right; color: #777777;">
+          <span v-if="!item.tag">{{ item.sum }}&nbsp;&nbsp;</span>
+          <span v-else><van-tag round color="red">{{ item.sum }}</van-tag>&nbsp;&nbsp;</span>
+        <van-icon name="arrow" /></van-col>
+      </van-row>
+    </div>
+  </template>
+  <shortcut-fixed type="B" :item="['home']"></shortcut-fixed>
 </template>
 
 <script setup>
+import ShortcutFixed from '@/components/ShortcutFixed/index.vue'
+
 import { ref, reactive, onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import axios from '@/utils/axios';
@@ -11,6 +28,20 @@ import { Toast } from 'vant';
 const $route = useRoute();
 const $router = useRouter();
 
+const itemList = [
+  {
+    name: '幼儿园上传视频',
+    sum: '5',
+    to: '/me/donateList'
+  },
+  {
+    name: '家长上传视频',
+    sum: '2',
+    tag: true,
+    to: '/me/message'
+  },
+]
+
   onMounted(() => {
     
   })
@@ -36,5 +67,8 @@ export default {
 </script>
 
 <style lang="less" scoped>
-
+.item-list {
+  padding: 1rem 0; 
+  margin: 0 1rem;
+}
 </style>
\ No newline at end of file

@@ -85,7 +85,7 @@
         <my-button @on-click="uploadVideo" type="primary">上传作品</my-button>
       </div>
     </div>
-    <shortcut-fixed @on-click="gotoMe()"></shortcut-fixed>
+    <shortcut-fixed type="C" :item="['home', 'me']"></shortcut-fixed>
   </div>
 
   <!-- 上传作品时，如果没有实名认证提示弹框 -->

@@ -22,11 +22,11 @@
     </div>
     <div class="book-list">
       <template v-for="(item, key) in items" :key="key">
-        <book-card :item="item" @on-click="onClick(item)"></book-card>
+        <book-card type="C" :item="item" @on-click="onClick(item)"></book-card>
       </template>
     </div>
     <div style="height: 1rem;"></div>
-    <shortcut-fixed @on-click="gotoMe()"></shortcut-fixed>
+    <shortcut-fixed type="C" :item="['home', 'me']"></shortcut-fixed>
   </div>
 </template>
 

 <template>
   <div class="book-list">
     <template v-for="(item, key) in items" :key="key">
-      <book-card :item="item" @on-click="onClick(item)"></book-card>
+      <book-card type="C" :item="item" @on-click="onClick(item)"></book-card>
     </template>
   </div>
 </template>