Quellcode durchsuchen

feat: 专家列表

lxf vor 1 Woche
Ursprung
Commit
1117c59266

BIN
src/assets/img/home/expert-icon.png


+ 6 - 0
src/router/globalRoutes.js

@@ -51,4 +51,10 @@ export default [
         name: "FarmPhoto",
         name: "FarmPhoto",
         component: () => import("@/views/old_mini/home/patrolPhoto.vue"),
         component: () => import("@/views/old_mini/home/patrolPhoto.vue"),
     },
     },
+    // 咨询专家
+    {
+        path: "/expert_list",
+        name: "ExpertList",
+        component: () => import("@/views/old_mini/home/subPages/expertList.vue"),
+    },
 ];
 ];

+ 7 - 1
src/views/old_mini/home/components/problemReminder.vue

@@ -16,7 +16,7 @@
                     <span class="options-label">您可以选择</span>
                     <span class="options-label">您可以选择</span>
                     <div class="options-buttons">
                     <div class="options-buttons">
                         <div class="option-btn">拍照识别</div>
                         <div class="option-btn">拍照识别</div>
-                        <div class="option-btn">咨询专家</div>
+                        <div class="option-btn" @click="toPage">咨询专家</div>
                     </div>
                     </div>
                 </div>
                 </div>
             </div>
             </div>
@@ -41,6 +41,8 @@
 import { Popup } from "vant";
 import { Popup } from "vant";
 import { ref } from "vue";
 import { ref } from "vue";
 import detailDialog from "@/components/detailDialog.vue"
 import detailDialog from "@/components/detailDialog.vue"
+import { useRouter } from "vue-router";
+const router = useRouter();
 
 
 const show = ref(true);
 const show = ref(true);
 const noShow = ref(false);
 const noShow = ref(false);
@@ -52,6 +54,10 @@ const yesClick = () => {
     show.value = false;
     show.value = false;
     detailDialogRef.value.showDialog()
     detailDialogRef.value.showDialog()
 }
 }
+
+function toPage() {
+    router.push("/expert_list")
+}
 const detailDialogRef = ref(null)
 const detailDialogRef = ref(null)
 </script>
 </script>
 <style lang="scss" scoped>
 <style lang="scss" scoped>

+ 293 - 0
src/views/old_mini/home/subPages/expertList.vue

@@ -0,0 +1,293 @@
+<template>
+    <div class="prescription-list">
+        <custom-header name="创建农场"></custom-header>
+        <div class="prescription-content">
+            <div class="list">
+                <div class="list-item" v-for="(item, index) in list" :key="index" @click.stop="handleDetails(item)">
+                    <div class="list-top">
+                        <div class="user">
+                            <img :src="item.icon" alt="" />
+                            <!-- <div class="checkbox" @click.stop="handleCheck(item)">
+                                <el-icon class="icon" v-if="item.isDefault"><Select /></el-icon>
+                                <el-icon class="icon rotate" v-else><CloseBold /></el-icon>
+                            </div> -->
+                        </div>
+                        <div class="info">
+                            <div class="text">
+                                <div class="info-flex">
+                                    <span class="name">{{ item.name }}</span>
+                                    <span class="expert-tag">
+                                        <img class="expert-img" src="@/assets/img/home/expert-icon.png" alt="">
+                                        专家
+                                    </span>
+                                    <div
+                                        class="fruit-tag"
+                                        v-for="(ele, eleIndex) in item.tagList"
+                                        :key="eleIndex"
+                                    >
+                                        {{ ele.name }}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="van-multi-ellipsis--l2 ellipsis">擅长:{{ item.strongPoint }}</div>
+                        </div>
+                    </div>
+                    <div class="list-btn">
+                        <div class="btn-primary" @click.stop="handleChat(item)">
+                            <span>免费咨询</span>
+                        </div>
+                        <div class="btn-plain" @click.stop="handlePage(item)">查看处方</div>
+                    </div>
+                </div>
+                <empty
+                    v-show="list.length < 1"
+                    image="https://fastly.jsdelivr.net/npm/@vant/assets/custom-empty-image.png"
+                    image-size="80"
+                    description="暂无数据"
+                />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import customHeader from "@/components/customHeader.vue";
+import { Empty} from "vant";
+import { onActivated, ref } from "vue";
+import { useRouter,useRoute } from "vue-router";
+import { useStore } from "vuex";
+import { ElMessage } from "element-plus";
+const store = useStore();
+const router = useRouter();
+const route = useRoute();
+
+const handleCheck = (item) =>{
+    item.isDefault = !item.isDefault
+}
+
+const handleDetails = ({userId}) => {
+    router.push(`/prescription_detail?userId=${userId}`)
+};
+
+const handleChat = ({userId,name}) =>{
+    router.push(`/consult?userId=${userId}&name=${name}`)
+}
+
+const handlePage = ({isDefault,userId}) =>{
+    if(isDefault==null){
+        router.push(`/expert_prescription?userId=${userId}&disabled=true`)
+    }else{
+        router.push('/expert_prescription')
+    }
+}
+
+//设置默认处方
+const handleDefalut = ({isDefault,userId}) =>{
+    if(isDefault==null && !route.query.isDisable){
+        VE_API.expert.setFarmWorkRecord({expertUserId:userId}).then(res =>{
+            if(res.success){
+                getList()
+            }else{
+                ElMessage.warning(res.msg)
+            }
+        })
+    }else{
+        ElMessage.warning('暂无修改权限')
+    }
+}
+
+const list = ref([
+    {
+        icon: "https://birdseye-img.sysuimars.com/birdseye-look-vue/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20250411150343.png",
+        name: "韦帮稳",
+        tagList: [{name: "荔枝"}],
+        strongPoint: "深耕果树栽培领域达30年,在荔枝、龙眼、柑橘、番茄、木瓜等多个品类果树;耕果树栽培领域达30年,在荔枝、龙眼、柑"
+    },
+    {
+        icon: "https://birdseye-img.sysuimars.com/birdseye-look-vue/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20250411150343.png",
+        name: "韦老师",
+        tagList: [{name: "荔枝"}, {name: "龙眼"}],
+        strongPoint: "深耕果树栽培领域达30年,在荔枝、龙眼、柑橘、番茄、木瓜等多个品类果树"
+    },
+]);
+
+const changeItem = (e) => {
+    getList();
+};
+
+const getList = () => {
+    VE_API.expert.expertList().then((res) => {
+        list.value = res.data || [];
+    });
+};
+
+onActivated(() => {
+    // getList();
+});
+</script>
+
+<style lang="scss" scoped>
+.prescription-list {
+    position: relative;
+    width: 100%;
+    height: 100vh;
+    background-color: #f5f7fb;
+    .prescription-content {
+        overflow-y: auto;
+        height: calc(100% - 40px);
+        padding: 12px;
+        box-sizing: border-box;
+        width: 100%;
+        .list {
+            .list-item {
+                background: #fff;
+                padding: 16px 12px 12px;
+                border-radius: 8px;
+                .user {
+                    width: 68px;
+                    height: 68px;
+                    margin-right: 12px;
+                    position: relative;
+                    img{
+                        width: 100%;
+                        height: 100%;
+                        border-radius: 8px;
+                        object-fit: cover;
+                    }
+                    .checkbox{
+                        position: absolute;
+                        bottom: -2px;
+                        right: -1px;
+                        width: 25px;
+                        height: 25px;
+                        background: #2199F8;
+                        border-radius: 50%;
+                        display: flex;
+                        align-items: center;
+                        justify-content: center;
+                        .icon{
+                            color: #fff;
+                            font-size: 16px;
+                        }
+                        .rotate{
+                            transform: rotate(45deg);
+                        }
+                    }
+                }
+                .list-top {
+                    display: flex;
+                }
+                .list-btn {
+                    display: flex;
+                    justify-content: center;
+                    font-size: 12px;
+                    margin-top: 8px;
+                    .btn-primary{
+                        background: rgba(33, 153, 248, 0.12);
+                        padding: 0 12px;
+                        color: #2199F8;
+                        border-radius: 20px;
+                        height: 32px;
+                        line-height: 32px;
+                        display: flex;
+                        span{
+                            margin-left: 3px;
+                        }
+                    }
+                    .btn-plain{
+                        background: rgba(162, 162, 162, 0.12);
+                        color: rgba(0, 0, 0, 0.5);
+                        padding: 0px 12px;
+                        border-radius: 20px;
+                        height: 32px;
+                        line-height: 32px;
+                        margin-left: 8px;
+                    }
+                }
+                .info {
+                    width: calc(100% - 78px);
+                    line-height: 1.6;
+                    .ellipsis {
+                        max-width: 255px;
+                        color: #666666;
+                    }
+                    .text {
+                        display: flex;
+                        color: #666666;
+                        align-items: center;
+                        justify-content: space-between;
+                        .info-flex{
+                            display: flex;
+                            align-items: center;
+                        }
+                        .name {
+                            color: #000;
+                            font-size: 16px;
+                            font-weight: bold;
+                        }
+                        .expert-tag {
+                            height: 20px;
+                            width: 48px;
+                            display: flex;
+                            align-items: center;
+                            justify-content: center;
+                            color: #C77D05;
+                            background: #FFECAD;
+                            border-radius: 4px;
+                            font-size: 12px;
+                            margin-left: 8px;
+                            line-height: 20px;
+                            .expert-img {
+                                width: 12px;
+                                padding-right: 2px;
+                            }
+                        }
+                        .btn-text{
+                            font-size: 12px;
+                            color: #A8A8A8;
+                            padding: 2px 12px;
+                            border-radius: 20px;
+                            border: 1px solid #A8A8A8;
+                            background: rgba(220, 220, 220, 0.1);
+                            &.actice{
+                                color: #F3C11D;
+                                border-color: #F3C11D;
+                                background: rgba(243, 193, 29, 0.1);
+                            }
+                        }
+                    }
+                    .fruit-tag {
+                        margin-left: 5px;
+                        padding: 0 8px;
+                        height: 20px;
+                        line-height: 20px;
+                        background: #cae7ff;
+                        border-radius: 2px;
+                        font-size: 12px;
+                        color: #2199f8;
+                        // &.pest {
+                        //     background: #eedaff;
+                        //     color: #ac4dff;
+                        // }
+                        &:nth-child(3) {
+                            
+                            background: #eedaff;
+                            color: #ac4dff;
+                        }
+                    }
+                    .ellipsis {
+                        font-size: 12px;
+                        color: #999;
+                        margin-top: 4px;
+                    }
+                }
+            }
+            .list-item + .list-item {
+                margin-top: 16px;
+                padding-top: 16px;
+                border-top: 1px solid #f5f5f5;
+            }
+        }
+    }
+}
+</style>