feat:添加农场照片路由

src/router/globalRoutes.js

@@ -25,27 +25,6 @@ export default [
         meta: { showTabbar: true,keepAlive: true },
         component: () => import("@/views/old_mini/mine/index.vue"),
     },
-    //分组管理
-    {
-        path: "/manage",
-        name: "GroupManage",
-        meta: { keepAlive: true },
-        component: () => import("@/views/old_mini/mine/manage.vue"),
-    },
-    // 激活列表  详情页面
-    {
-        path: "/active_detail",
-        name: "ActiveDetail",
-        meta: { keepAlive: true },
-        component: () => import("@/views/old_mini/mine/details/active.vue"),
-    },
-    // 激活列表  详情页面
-    {
-        path: "/adopt_detail",
-        name: "AdoptDetail",
-        meta: { keepAlive: true },
-        component: () => import("@/views/old_mini/mine/details/adopt.vue"),
-    },
     // 我的消息
     {
         path: "/plan",
@@ -71,4 +50,10 @@ export default [
         name: "EditMap",
         component: () => import("@/views/old_mini/create_farm/editMap.vue"),
     },
+    // 农场照片
+    {
+        path: "/farm_photo",
+        name: "FarmPhoto",
+        component: () => import("@/views/old_mini/home/patrolPhoto.vue"),
+    },
 ];

src/utils/ol-map/Map.js

@@ -301,7 +301,7 @@ class Map {
 				fill: new Fill({ color: "#fff" }), // 字体颜色
 			}),
 		})
-		styles.push(fillStyle);
+		styles.push(fillStyle,areaValStyle);
 		return styles;
 	}
 

src/views/old_mini/home/index.vue

@@ -18,7 +18,7 @@
                     <img class="button-icon" src="@/assets/img/tab_bar/home-active.png" alt="">
                     <span>基本信息</span>
                 </div>
-                <div class="button-item">
+                <div class="button-item" @click="toFarmPhoto">
                     <img class="button-icon" src="@/assets/img/home/photo-icon.png" alt="">
                     <span>农场相册</span>
                 </div>
@@ -77,6 +77,12 @@ function toSubPage() {
         path: "/create_farm",
     });
 }
+
+function toFarmPhoto() {
+    router.push({
+        path: "/farm_photo",
+    });
+}
 </script>
 
 <style lang="scss" scoped>

src/views/old_mini/home/patrolPhoto.vue

@@ -0,0 +1,235 @@
+<template>
+    <div class="patrol-photo">
+        <custom-header name="农场照片"></custom-header>
+        <div class="patrol-content">
+            <div class="photo-wrap">
+                <div class="photo-header">
+                    <div class="photo-select">
+                        <el-date-picker class="picker" v-model="value1" type="date" placeholder="全部日期" />
+                        <el-select class="select" v-model="value" placeholder="全部区域">
+                            <el-option
+                                v-for="item in options"
+                                :key="item.value"
+                                :label="item.label"
+                                :value="item.value"
+                            />
+                        </el-select>
+                    </div>
+                    <div class="select-wrap">
+                        <div
+                            :class="['select-item', { active: tabActive === index }]"
+                            v-for="(item, index) in tabsList"
+                            :key="index"
+                            @click="handleTabAct(index)"
+                        >
+                            {{ item }}
+                        </div>
+                    </div>
+                </div>
+                <div class="photo-wrap">
+                    <!-- <List
+                        class="photo-list"
+                        v-model:loading="loading"
+                        :finished="finished"
+                        finished-text="没有更多了"
+                        @load="getPhotoList"
+                    >
+                        <div class="photo-item" v-for="(item, index) in treeImgList" :key="index">
+                            <album-carousel-item
+                                :key="index"
+                                :farmId="farmOrganId"
+                                :images="[item]"
+                                :lock="false"
+                                :isShowNum="false"
+                            ></album-carousel-item>
+                            <div class="btn" @click="handleFeedback">反馈</div>
+                        </div>
+                    </List> -->
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { onActivated, ref } from "vue";
+import { useRouter } from "vue-router"; 
+import { List, Popup } from "vant";
+// import albumCarouselItem from "@/views/old_mini/feature_index/pages/album_compoents/albumCarouselItem.vue";
+import { base_img_url2, resize } from "@/api/config";
+import customHeader from "@/components/customHeader.vue";
+
+const router = useRouter();
+
+const tabActive = ref(0);
+const tabsList = ["物候", "病虫", "生长"];
+const handleTabAct = (index) => {
+    tabActive.value = index;
+};
+
+const value1 = ref("");
+const value = ref("");
+
+const options = [
+    {
+        value: "Option1",
+        label: "Option1",
+    },
+    {
+        value: "Option2",
+        label: "Option2",
+    },
+    {
+        value: "Option3",
+        label: "Option3",
+    },
+    {
+        value: "Option4",
+        label: "Option4",
+    },
+    {
+        value: "Option5",
+        label: "Option5",
+    },
+];
+
+const treeImgList = ref([]);
+const loading = ref(false);
+const finished = ref(false);
+const curPage = ref(1);
+const farmOrganId = ref(766);
+const getPhotoList = () => {
+    const params = {
+        organId: farmOrganId.value,
+        regionId: sessionStorage.getItem("select:areaId"),
+        page: curPage.value,
+        limit: 21,
+    };
+    VE_API.garden.getTreeImg(params).then(({ data, count }) => {
+        let photoArr = [];
+        data.forEach((item) => {
+            photoArr.push({
+                ...item,
+                path: base_img_url2 + (item.resFilename || item.filename) + "?x-oss-process=image/resize,w_300",
+            });
+        });
+        treeImgList.value.push(...photoArr);
+
+        // 加载状态结束
+        loading.value = false;
+        curPage.value = curPage.value + 1;
+
+        // 数据全部加载完成
+        if (treeImgList.value.length >= count) {
+            finished.value = true;
+        }
+    });
+};
+
+onActivated(() => {
+    // treeImgList.value = [];
+    // finished.value = false;
+    // farmOrganId.value = JSON.parse(localStorage.getItem("gardenItemData")).organId;
+    // if (curPage.value !== 1) {
+    //     curPage.value = 1;
+    //     // getPhotoList();
+    // }
+});
+</script>
+
+<style lang="scss" scoped>
+::v-deep {
+    .van-list__finished-text {
+        width: 100%;
+    }
+}
+.patrol-photo {
+    width: 100%;
+    height: 100vh;
+    background: #fff;
+    .patrol-content {
+        padding: 0 12px;
+        width: 100%;
+        height: calc(100vh - 50px);
+        box-sizing: border-box;
+        .photo-wrap {
+            width: 100%;
+            height: 100%;
+            margin-top: 10px;
+            .photo-header {
+                .photo-select {
+                    display: flex;
+                    .select {
+                        width: 60%;
+                        margin-left: 12px;
+                    }
+                }
+                .select-wrap {
+                    display: flex;
+                    margin: 10px 0;
+                    .select-item {
+                        flex: 1;
+                        color: #666666;
+                        padding: 6px 0;
+                        text-align: center;
+                        background: #f5f5f5;
+                        border-radius: 5px;
+                        &.active {
+                            color: #2199f8;
+                            background: #e0f1fe;
+                        }
+                    }
+                    .select-item + .select-item {
+                        margin-left: 12px;
+                    }
+                }
+            }
+            .photo-wrap {
+                width: 100%;
+                height: calc(100vh - 135px);
+                overflow: auto;
+            }
+            .photo-list {
+                display: flex;
+                flex-wrap: wrap;
+                height: 100%;
+                .photo-item {
+                    width: 31.4%;
+                    height: 110px;
+                    border-radius: 8px;
+                    margin-right: 10px;
+                    margin-bottom: 8px;
+                    position: relative;
+                    .btn {
+                        position: absolute;
+                        right: 3px;
+                        top: 3px;
+                        font-size: 12px;
+                        background: rgba(0, 0, 0, 0.7);
+                        padding: 3px 10px;
+                        border-radius: 20px;
+                        color: #fff;
+                    }
+                    ::v-deep {
+                        .carousel-container {
+                            height: 100%;
+                            .carousel-wrapper {
+                                height: 100%;
+                                .carousel-item {
+                                    height: 100%;
+                                    .carousel-item img {
+                                        height: 100% !important;
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+                .photo-item:nth-of-type(3n) {
+                    margin-right: 0;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/old_mini/mine/details/active.vue

@@ -1,161 +0,0 @@
-<template>
-    <div class="container">
-        <custom-header name="查看详情"></custom-header>
-        <div class="content">
-            <div class="steps-wrap">
-                <steps class="steps" direction="vertical" :active="0">
-                    <step>
-                        <div class="lable">订单处理中，开始配置</div>
-                        <span class="value">2025-03-22 12:40</span>
-                    </step>
-                    <step>
-                        <div>富丽富力园16栋</div>
-                        <span class="value">张贺飞 198****3165</span>
-                    </step>
-                </steps>
-                <div class="btn-txt">详情 ></div>
-            </div>
-            <div class="card">
-                <div class="card-top">
-                    <img src="@/assets/img/mine/img-photo.png" alt="" />
-                    <div class="item-text">
-                        <div class="name">
-                            <span>糯米糍</span>
-                            <div class="mark">综合评分:92分</div>
-                            <div class="age">树龄:16年</div>
-                        </div>
-                        <div class="txt">唯一编码：<span>2******</span></div>
-                        <div class="txt">高质产量：<span>15元/斤</span></div>
-                        <div class="txt">预估上市时间：<span>2025.06.25</span></div>
-                    </div>
-                </div>
-                <div class="card-bottom">
-                    <img src="@/assets/img/mine/chat-black.png" alt="">
-                    联系果园
-                </div>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import customHeader from "@/components/customHeader.vue";
-import { Step, Steps } from "vant";
-</script>
-
-<style lang="scss" scoped>
-.container {
-    width: 100%;
-    height: calc(100vh - 40px);
-    .content {
-        width: 100%;
-        height: 100%;
-        background: #f2f3f5;
-        padding: 20px 12px;
-        box-sizing: border-box;
-        .steps-wrap {
-            display: flex;
-            justify-content: space-between;
-            background: #fff;
-            padding: 12px;
-            border-radius: 5px;
-            .steps {
-                width: calc(100% - 70px);
-                .lable {
-                    font-size: 16px;
-                    font-weight: 500;
-                }
-                .value {
-                    color: rgba(0, 0, 0, 0.3);
-                    font-size: 12px;
-                    margin-top: 4px;
-                    display: inline-block;
-                }
-                ::v-deep {
-                    .van-step--vertical:after {
-                        border-bottom-width: 0px;
-                    }
-                    .van-step {
-                        color: #000;
-                    }
-                    .van-step__circle-container {
-                        font-size: 14px;
-                    }
-                    .van-step__circle {
-                        width: 10px;
-                        height: 10px;
-                        background: #ececec;
-                    }
-                }
-            }
-            .btn-txt {
-                color: rgba(0, 0, 0, 0.4);
-                font-size: 12px;
-            }
-        }
-        .card {
-            background: #fff;
-            border-radius: 5px;
-            padding: 12px;
-            margin-top: 12px;
-            .card-top{
-                display: flex;
-                margin-bottom: 12px;
-                img {
-                    width: 89px;
-                    height: 81px;
-                    border-radius: 8px;
-                    margin-right: 12px;
-                    object-fit: cover;
-                }
-                .item-text {
-                    color: #999999;
-                    font-size: 12px;
-                    line-height: 1.6;
-                    .name {
-                        display: flex;
-                        align-items: center;
-                        span {
-                            font-size: 15px;
-                            color: #000;
-                            font-weight: 500;
-                            margin-right: 5px;
-                        }
-                        div {
-                            margin-left: 5px;
-                            border-radius: 4px;
-                            font-size: 12px;
-                            padding: 2px 5px;
-                            &.mark {
-                                background: rgba(50, 203, 226, 0.25);
-                                color: #00bedb;
-                            }
-                            &.age {
-                                background: rgba(255, 196, 0, 0.2);
-                                color: #f0a400;
-                            }
-                        }
-                    }
-                    .txt {
-                        span {
-                            color: #000;
-                        }
-                    }
-                }
-            }
-            .card-bottom{
-                border-top: 1px solid rgba(0, 0, 0, 0.1);
-                padding-top: 12px;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                img{
-                    width: 17px;
-                    height: 15px;
-                    margin-right: 5px;
-                }
-            }
-        }
-    }
-}
-</style>

src/views/old_mini/mine/details/adopt.vue

@@ -1,163 +0,0 @@
-<template>
-    <div class="container">
-        <custom-header name="生成定制卡"></custom-header>
-        <div class="content">
-            <div class="card">
-                <div class="card-title">
-                    <span>赠送人</span>
-                    <div class="name">
-                        <el-avatar
-                            class="avatar"
-                            :size="16"
-                            src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
-                        />
-                        爱尚荔枝
-                    </div>
-                </div>
-                <div class="garden-info">
-                    <div class="garden-name">
-                        <el-avatar
-                            class="avatar"
-                            :size="24"
-                            src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
-                        />
-                        <span>来自荔博园</span>
-                    </div>
-                    <div class="garden-cont">
-                        <div class="garden-txt">
-                            <span>桂味</span>
-                            <div>品种</div>
-                        </div>
-                        <div class="garden-txt">
-                            <span>10年</span>
-                            <div>树龄</div>
-                        </div>
-                        <div class="garden-txt">
-                            <span>92分</span>
-                            <div>综合评分</div>
-                        </div>
-                        <div class="garden-txt">
-                            <span>91分</span>
-                            <div>生态评分</div>
-                        </div>
-                    </div>
-                </div>
-                <div class="footer">
-                    <img class="code" src="@/assets/img/mine/code.png" alt="" />
-                </div>
-            </div>
-            <div class="button">保存图片</div>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import customHeader from "@/components/customHeader.vue";
-</script>
-
-<style lang="scss" scoped>
-.container {
-    width: 100%;
-    height: 100vh;
-    background-image: url("https://birdseye-img-ali-cdn.sysuimars.com/foster/detail/bg.png");
-    background-size: cover;
-    .content {
-        width: 100%;
-        height: calc(100% - 40px);
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-        box-sizing: border-box;
-        padding: 36px;
-        .card {
-            width: 100%;
-            height: 490px;
-            padding: 8px 12px;
-            box-sizing: border-box;
-            position: relative;
-            background: url("@/assets/img/mine/adopt-bg.png") no-repeat center center / 100% 100%;
-            .card-title {
-                display: flex;
-                align-items: center;
-                font-size: 12px;
-                .name {
-                    background: rgba(255, 255, 255, 0.5);
-                    border-radius: 20px;
-                    margin-left: 6px;
-                    display: flex;
-                    padding: 7px 9px;
-                    align-items: center;
-                    .avatar {
-                        margin-right: 5px;
-                    }
-                }
-            }
-            .garden-info {
-                position: absolute;
-                bottom: 110px;
-                width: calc(100% - 28px);
-                .garden-name {
-                    color: #6d4708;
-                    font-size: 16px;
-                    display: flex;
-                    align-items: center;
-                    background: #ffffff;
-                    border-radius: 20px;
-                    width: 120px;
-                    padding: 3px 10px;
-                    margin-bottom: -4px;
-                    position: relative;
-                    z-index: 2;
-                    .avatar {
-                        margin-right: 6px;
-                    }
-                }
-                .garden-cont{
-                    width: 100%;
-                    display: flex;
-                    padding: 8px 0;
-                    background: linear-gradient(60deg,rgba(242, 229, 207, 0) 0% ,#F2E5CF 50%,rgba(242, 229, 207, 0) 100%);
-                    .garden-txt{
-                        text-align: center;
-                        color: rgba(109, 71, 8, 0.3);
-                        line-height: 1.6;
-                        flex: 1;
-                        span{
-                            color: #6D4708;
-                            font-size: 18px;
-                        }
-                    }
-                }
-            }
-            .footer {
-                width: calc(100% - 36px);
-                height: 75px;
-                position: absolute;
-                bottom: 0;
-                left: 18px;
-                display: flex;
-                align-items: center;
-                justify-content: flex-end;
-                border-top: 1px dashed #000;
-                .code {
-                    width: 34px;
-                    height: 34px;
-                }
-            }
-        }
-        .button {
-            margin-top: 50px;
-            background: linear-gradient(0deg, #18e0ff, #00c5e3);
-            border-radius: 30px;
-            font-size: 18px;
-            padding: 11px;
-            width: 100%;
-            box-sizing: border-box;
-            text-align: center;
-            color: #fff;
-            border: 1px solid #ffffff;
-        }
-    }
-}
-</style>

src/views/old_mini/mine/manage.vue

@@ -1,301 +0,0 @@
-<template>
-    <div class="container-bg">
-        <div class="container">
-            <custom-header :name="headerName"></custom-header>
-            <div class="content" v-if="total!=='0'">
-                <el-input class="search" v-model="input" placeholder="搜索">
-                    <template #prefix>
-                        <el-icon class="el-input__icon"><search /></el-icon>
-                    </template>
-                </el-input>
-                <div class="list">
-                    <div class="list-item" v-for="(item, index) in list" :key="index">
-                        <checkbox @change="changeCheck" v-show="setingShow" v-model="item.checked"></checkbox>
-                        <div class="item-flex">
-                            <img class="photo" src="@/assets/img/mine/img-photo.png" alt="" />
-                            <div class="item-text">
-                                <div class="name">{{ item.name }}</div>
-                                <div>电话：19875236548</div>
-                                <div>地址：湖北省武汉市富里唱鑫园5023</div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div v-else class="no-data">
-                <span>当前列表无好友</span>
-                <div class="button-row">
-                    <div class="del">删除分组</div>
-                    <div>添加好友</div>
-                </div>
-            </div>
-            <div class="footer" v-show="total!=='0'">
-                <span @click="handleSeting('新增分组')" v-show="!setingShow && isGroup === '1'">批量设置</span>
-                <div v-show="!setingShow && isGroup!=='1'" class="btn-group">
-                    <div class="delete" @click="handleDelete">删除分组</div>
-                    <div class="btn-txt">
-                        <span @click="handleSeting('添加')" class="add">添加</span>
-                        <span @click="handleSeting('移出')">移出</span>
-                    </div>
-                </div>
-                <div v-show="setingShow" class="footer-flex">
-                    <div class="text-group">
-                        <div class="icon" v-show="filterList.length">
-                            <el-icon><ArrowUpBold /></el-icon>
-                        </div>
-                        <div class="text-item" v-for="(item, index) in filterList" :key="index">
-                            {{ item.name }}
-                            <span v-show="filterList.length - 1 !== index">/</span>
-                        </div>
-                    </div>
-                    <div class="button" @click="handleAdd">{{btnText}}（{{ filterList.length }}）</div>
-                </div>
-            </div>
-        </div>
-    </div>
-    <!-- 新增分组弹窗 -->
-    <add-popup :show="showPopup"></add-popup>
-    <!-- 删除弹窗 -->
-    <action-sheet class="action-sheet" v-model:show="showAction" :actions="actions" cancel-text="取消" @select="onSelect">
-        <template #description>
-            <span class="desc">该分组下还有好友存在，删除后好友会放在 未分组的好友列表里</span>
-        </template>
-    </action-sheet>
-</template>
-
-<script setup>
-import customHeader from "@/components/customHeader.vue";
-import addPopup from "./components/addPopup.vue";
-import { onActivated, onMounted, ref } from "vue";
-import { useRoute } from "vue-router";
-import { Checkbox } from "vant";
-import { ElMessage } from "element-plus";
-import { ActionSheet } from 'vant';
-const route = useRoute();
-
-const input = ref("");
-const list = ref([
-    {
-        name: "123",
-        checked: false,
-    },
-    {
-        name: "456",
-        checked: false,
-    },
-]);
-
-const showPopup = ref(false);
-//新增分组
-const handleAdd = () => {
-    if (filterList.value.length) {
-        showPopup.value = !showPopup.value;
-    } else {
-        ElMessage.warning("请选择好友");
-    }
-};
-
-//批量设置
-const setingShow = ref(false);
-const btnText = ref('')
-const handleSeting = (str) => {
-    btnText.value = str
-    setingShow.value = true;
-};
-
-//删除
-const showAction = ref(false)
-const actions = [{ name: '删除' ,color: '#F73C3C'},]
-const handleDelete = () =>{
-    showAction.value = true
-}
-const onSelect = (item) =>{
-    showAction.value = false
-}
-
-const filterList = ref([]);
-const changeCheck = () => {
-    filterList.value = list.value.filter((item) => item.checked);
-};
-
-const headerName = ref("");
-const isGroup = ref(null);
-const total = ref(0)
-onActivated(() => {
-    headerName.value = `${route.query.name}(${route.query.total})`;
-    total.value = route.query.total;
-    isGroup.value = route.query.isGroup;
-    setingShow.value = false
-    filterList.value = []
-});
-</script>
-
-<style lang="scss" scoped>
-.container-bg {
-    position: absolute;
-    width: 100%;
-    height: 100vh;
-    z-index: 1;
-    background: #f2f3f5;
-}
-.container {
-    width: 100%;
-    height: calc(100% - 40px - 40px);
-    background: url("@/assets/img/mine/mine-bg.png") no-repeat center center / 100% 100%;
-    .content {
-        width: 100%;
-        height: 100%;
-        position: relative;
-        padding: 20px 12px;
-        box-sizing: border-box;
-        .search {
-            width: 100%;
-            ::v-deep {
-                &.el-input {
-                    --el-input-placeholder-color: rgba(0, 190, 219, 0.63);
-                }
-                .el-input__prefix {
-                    color: rgba(0, 190, 219, 0.63);
-                }
-                .el-input__wrapper {
-                    box-shadow: none;
-                    border-radius: 20px;
-                    border: 1px solid #18d2ef;
-                }
-            }
-        }
-        .list {
-            .list-item {
-                padding: 12px 10px;
-                border-radius: 8px;
-                background: #fff;
-                display: flex;
-                align-items: center;
-                margin-top: 12px;
-                ::v-deep {
-                    .van-checkbox__icon .van-icon {
-                        border-color: #00bedb;
-                    }
-                    .van-checkbox__icon--checked .van-icon {
-                        background: #00bedb;
-                    }
-                }
-                .item-flex {
-                    display: flex;
-                    align-items: center;
-                }
-                .item-flex {
-                    display: flex;
-                    align-items: center;
-                    margin-left: 10px;
-                }
-                .photo {
-                    width: 62px;
-                    height: 62px;
-                    border-radius: 8px;
-                    margin-right: 12px;
-                }
-                .item-text {
-                    color: #999999;
-                    font-size: 12px;
-                    line-height: 1.6;
-                    .name {
-                        font-size: 15px;
-                        color: #000;
-                        font-weight: 500;
-                    }
-                }
-            }
-        }
-    }
-     .no-data{
-        width: 100%;
-        height: 100%;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        flex-direction: column;
-        span{
-            font-size: 16px;
-            color: rgba(0, 0, 0, 0.49);
-        }
-        .button-row{
-            margin-top: 12px;
-            display: flex;
-            div{
-                padding: 7px 24px;
-                color: rgba(0, 0, 0, 0.49);
-                border-radius: 5px;
-                background: #fff;
-            }
-            .del{
-                color: #F27777;
-                margin-right: 10px;
-                background: rgba(242, 119, 119, 0.12);
-            }
-        }
-    }
-    .footer {
-        position: fixed;
-        bottom: 0;
-        background: #fff;
-        width: 100%;
-        padding: 12px;
-        box-sizing: border-box;
-        text-align: center;
-        color: #262626;
-        .btn-group{
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            .delete{
-                color: #F27777;
-                padding: 5px 12px;
-                border-radius: 20px;
-                background: rgba(242, 119, 119, 0.12);
-            }
-            .btn-txt{
-                span{
-                   padding: 5px 12px;
-                }
-                .add{
-                    color: #8F8F8F;
-                    margin-right: 5px;
-                }
-            }
-        }
-        .footer-flex {
-            display: flex;
-            justify-content: space-between;
-            .text-group {
-                display: flex;
-                align-items: center;
-                color: #00bedb;
-                .icon {
-                    width: 18px;
-                    height: 18px;
-                    background: #00bedb;
-                    border-radius: 50%;
-                    color: #fff;
-                    line-height: 22px;
-                    font-size: 13px;
-                    margin-right: 5px;
-                }
-            }
-            .button {
-                color: #fff;
-                padding: 5px 12px;
-                font-size: 12px;
-                border-radius: 2px;
-                background: #00bedb;
-            }
-        }
-    }
-}
-
-.action-sheet{
-    .desc{
-        font-size: 12px;
-    }
-}
-</style>

src/views/old_mini/world/WorldMap.js

@@ -1,144 +0,0 @@
-import ImageLayer from 'ol/layer/Image'
-import Feature from 'ol/Feature'
-import WKT from 'ol/format/WKT'
-import ImageStaticSource from 'ol/source/ImageStatic'
-import config from "@/api/config.js"
-import * as KMap from '@/utils/ol-map/KMap';
-import Style from "ol/style/Style";
-import Stroke from "ol/style/Stroke";
-import Photo from "ol-ext/style/Photo";
-import Icon from 'ol/style/Icon.js';
-import Text from 'ol/style/Text.js';
-import Fill from "ol/style/Fill";
-
-/**
- * @description 智能巡园地图层对象
- */
-class WorldMap {
-
-    constructor(){
-        let that = this
-        let vectorStyle = new KMap.VectorStyle()
-        //区域文字
-        this.gardenLayer = new KMap.VectorLayer("gardenPoint",999,{style:(feature)=>{
-                let k = feature.get("id")
-                let name = feature.get("name")
-                let name2 = ""
-                for(let i=0;i<name.length;i++){
-                    name2+=name[i]+"\n"
-                }
-                let style = that.imgStyleCache[k];
-                if(!style){
-                    style = []
-                    let style1 = new Style ({
-                        image: new Photo ({
-                            src: config.base_img_url2 + feature.get("icon"),
-                            radius: 40,
-                            shadow: 0,
-                            crop:true,
-                            kind:"circle",
-                            onload: function() { that.gardenLayer.layer.changed(); },
-                            displacement: [0, 50],
-                            stroke: new Stroke({
-                                width: 2,
-                                color: '#fdfcfc'
-                            })
-                        })
-                    });
-                    let style2 = new Style ({
-                        image: new Icon ({
-                            src: config.base_img_url3 + "birdseye-look-mini/foster/gardenNameBox.png",
-                            scale: 1,
-                            displacement:[-55, 80]
-                        }),
-                        text:new Text({
-                            text:name2,
-                            font:"bold 14px serif",
-                            offsetX:-55,
-                            offsetY:-70,
-                            fill: new Fill({
-                                color: "#000000"
-                            }),
-                            stroke: new Stroke({
-                                color: "#000000",
-                                width: 1,
-                            }),
-                        })
-                    });
-                    style.push(style2)
-                    style.push(style1)
-                    that.imgStyleCache[k] = style
-                }
-                return style
-            }
-        })
-        this.imgStyleCache = {};
-        this.idx = 1
-    }
-
-    initMap(target)  {
-        this.kmap = new KMap.PixelMap(target,12,1,12);
-        this.kmap.addLayer(this.gardenLayer.layer)
-    }
-
-    //显示底图
-    initBottom(src){
-        let that = this
-        this.img = new Image();
-        this.img.src = src;
-        this.img.onload = function(){
-            let extent = [0,0,that.img.width, that.img.height];
-            that.bottom = new ImageLayer({       // 创建一个图像图层
-                title: 'baseMap',
-                source: new ImageStaticSource({
-                    url: that.img.src,
-                    projection: that.projection,
-                    imageExtent: extent
-                })
-            })
-            that.kmap.addLayer(that.bottom)
-            extent = [100,100,that.img.width - 100, that.img.height - 100]
-            that.kmap.fit(extent)
-        }
-    }
-    initGarden(){
-        let that = this
-        VE_API.garden.list({current:1, size:1000}).then(({result})=>{
-            console.log(result.records)
-            for(let tree of result.records){
-                if(!tree.wkt || tree.wkt == ""){
-                    tree.wkt = "POINT(0 0)"
-                }
-                let f = that.newFeature(tree)
-                that.gardenLayer.addFeature(f)
-            }
-        })
-    }
-
-    addGardenClick(callback){
-        let that = this
-        this.kmap.map.on("singleclick", function (e) {
-            let features = that.kmap.map.getFeaturesAtPixel(e.pixel, { hitTolerance: 50 });
-            if(features.length > 0 && features[0].get("nodeType") == "garden"){
-                callback && callback(features[0])
-            }
-        })
-    }
-
-    newFeature(data){
-        let geom = new WKT().readGeometry(data["wkt"])
-        let feature = new Feature({
-            geometry: geom
-        });
-        feature.set("nodeType","garden");
-        feature.setId(data.id)
-        for(let key in data){
-            if(key != "wkt" && key != "pointWkt"){
-                feature.set(key,data[key])
-            }
-        }
-        return feature;
-    }
-}
-
-export default WorldMap

src/views/old_mini/world/index.vue

@@ -1,65 +0,0 @@
-<template>
-    <div class="main">
-        <div ref="mapRef" class="bottom-map"></div>
-    </div>
-</template>
-
-<script setup>
-import { SET_TOKEN, SET_UNAME, SET_USER_INFO } from "@/store/modules/app/type";
-import { onMounted, onBeforeUnmount, ref, watch } from "vue";
-import { WKT } from "ol/format";
-import { useRouter, useRoute } from "vue-router";
-import { useStore } from "vuex";
-import wx from "weixin-js-sdk";
-import { base_img_url3 } from "@/api/config";
-import WorldMap from "./WorldMap";
-const store = useStore();
-const router = useRouter();
-const route = useRoute();
-const token = route.query.token;
-store.commit(`app/${SET_TOKEN}`, token);
-const mapRef = ref("mapRef");
-const myMap = new WorldMap();
-//当前果树
-const curTree = ref(null);
-onMounted(async () => {
-    window.document.title = "请选择果园";
-    let { result } = await VE_API.world_map.list();
-    console.log(result);
-    myMap.initMap(mapRef.value);
-    myMap.initBottom(base_img_url3 + result[0].baseMapUrl);
-    myMap.initGarden();
-    myMap.addGardenClick((f) => {
-        wx.miniProgram.reLaunch({ url: "/pages/subPages/detail/index?gardenId=" + f.get("id") });
-    });
-});
-</script>
-
-<style lang="scss" scoped>
-.main {
-    width: 100%;
-    height: 100%;
-    .bottom-map {
-        position: absolute;
-        width: 100%;
-        height: 100%;
-        z-index: 0;
-        background-color: #5f5d5d;
-        overflow: hidden;
-    }
-    .select-btn {
-        width: 100px;
-        height: 50px;
-        line-height: 50px;
-        position: absolute;
-        bottom: 100px;
-        position: absolute;
-        left: 50%;
-        transform: translate3d(-50%, 0, 0);
-        z-index: 1;
-        border-radius: 10px;
-        color: #ffffff;
-        text-align: center;
-    }
-}
-</style>

src/views/old_mini/world/util.js

@@ -1,125 +0,0 @@
-import VectorSource from 'ol/source/Vector.js';
-import WKT from 'ol/format/WKT.js';
-import Feature from 'ol/Feature.js';
-import VectorLayer from 'ol/layer/Vector.js';
-import Draw from "ol/interaction/Draw";
-import Text from "ol/style/Text";
-import Icon from "ol/style/Icon";
-import {Circle, Fill, Stroke, Style} from 'ol/style.js';
-
-export function getRadius(zoom){
-    if(zoom >= 20){
-        return 120;
-    }
-    if(zoom >= 19){
-        return 70;
-    }
-    if(zoom >= 18){
-        return 30;
-    }
-    if(zoom >= 17){
-        return 15;
-    }
-    return 10;
-}
-
-export function getScale(zoom){
-    if(zoom >= 20){
-        return 0.8;
-    }
-    if(zoom >= 19){
-        return 0.4;
-    }
-    if(zoom >= 18){
-        return 0.2;
-    }
-    if(zoom >= 17){
-        return 0.1;
-    }
-    return 0.1;
-}
-
-export function isShow(zoom,id){
-
-    if(zoom > 18){
-        return true;
-    }
-    if(zoom >= 18){
-        return mo(id, 4)
-    }
-    if(zoom >= 17){
-        return mo(id, 5)
-    }
-    return  mo(id, 5)
-}
-export function mo(id,midu){
-    return id % midu == 0
-}
-
-export const colors = ["#9EFE0C","#FEC30C","#FE760C","#FE0B0C","#0DCAFE","#A80BFF","#E4FE0C","#1A0BFF"];
-export const imgs = ["point6.png","point1.png","point2.png","point3.png","point4.png","point5.png","point6.png","point7.png","point8.png"]
-export const pz = ["未知","白糖罂","桂味","井岗红糯","糯米糍","岭丰糯","进奉","冰荔","妃子笑"]
-
-export function getIndex(name){
-    let i = 0;
-    for(let item of pz){
-        if(name === item){
-            return i;
-        }
-        i++;
-    }
-}
-
-/**
- *
- * @param data
- * @param geomField 形状的字段
- * @param sign 标识
- * @returns {Feature<{geometry: any}>}
- */
-export const newPoint = (data, geomField, sign)=>{
-    let point = new WKT().readGeometry(data[geomField])
-    let feature = new Feature({
-        geometry: point
-    });
-    feature.setId(data.id)
-    feature.set("nodeType",sign)
-    for(let key in data){
-        if(key != geomField && data[key]){
-            feature.set(key,data[key])
-        }
-    }
-    return feature;
-}
-
-export const newPolymerFeature = (data)=>{
-    let geom = new WKT().readGeometry(data["geom"])
-    let feature = new Feature({
-        geometry: geom
-    });
-    feature.set("nodeType","polymer");
-    feature.setId(data.id)
-    for(let key in data){
-        if(key != "geom"){
-            feature.set(key,data[key])
-        }
-    }
-    return feature;
-}
-
-export const newAreaFeature = (data)=>{
-    let geom = new WKT().readGeometry(data["geom"])
-    let feature = new Feature({
-        geometry: geom
-    });
-    feature.set("nodeType","area");
-    feature.setId(data.id)
-    for(let key in data){
-        if(key != "geom"){
-            feature.set(key,data[key])
-        }
-    }
-    return feature;
-}
-
-