fix: 批量编辑，对接接口

src/api/modules/manage_user.js

@@ -9,4 +9,8 @@ module.exports = {
         url: config.base_url + "adm/import_lighten_card_offline",
         type: "post",
     },
+    deleteUser: {
+        url: config.base_url + "z_sample_lighten_card_offline_take/delete/{id}",
+        type: "get",
+    },
 }

src/components/editClientPopup.vue

@@ -28,7 +28,7 @@
             </div>
             <div class="popup-footer">
                 <div class="cancel" @click="resetForm">取消</div>
-                <div @click="submitForm">添加</div>
+                <div @click="submitForm">保存</div>
             </div>
         </popup>
     </div>
@@ -56,7 +56,7 @@ const submitForm = async () => {
     if (!ruleFormRef.value) return;
     await ruleFormRef.value.validate((valid, fields) => {
         if (valid) {
-            ElMessage.success("添加成功");
+            ElMessage.success("保存成功");
             showClient.value = false;
         } else {
             console.log("error submit!");

src/router/mainRoutes.js

@@ -33,6 +33,12 @@ export default [
                 meta: { nav: 'tree' },
                 component: () => import("@/views/customTree/index.vue"),
             },
+            {
+                path: "/layout/settingTree",
+                name: "SettingTree",
+                meta: { nav: 'tree' },
+                component: () => import("@/views/settingTree/index.vue"),
+            },
         ],
     },
     {

src/views/home/components/adoptList.vue

@@ -208,7 +208,7 @@
                         </div>
                     </div>
                     <div
-                        v-show="!isManySetting && !item.settingPrice && ROLE == 1"
+                        v-show="!isManySetting && !item.settingPrice"
                         @click="toSettingSinglePrice(index, true)"
                     >
                         <img src="@/assets/images/common/edit-icon.png" alt="" />
@@ -249,8 +249,8 @@ import { ElMessage } from "element-plus";
 import { onMounted, ref } from "vue";
 import { useStore } from "vuex";
 let store = useStore();
-
-const ROLE = store.state.home.userRole;
+import { useRouter } from "vue-router";
+const router = useRouter();
 
 const areaVal = ref(0);
 const areaOptions = ref([
@@ -334,7 +334,8 @@ const settingTypeOptions = [
 ];
 const settingType = ref("age");
 function manySetPrice() {
-    isManySetting.value = true;
+    // isManySetting.value = true;
+    router.push("/layout/settingTree");
 }
 function saveManySetting(isToSave) {
     isManySetting.value = false;

src/views/home/components/applyList.vue

@@ -90,7 +90,7 @@ onMounted(() => {
 });
 
 function getUserList() {
-    VE_API.manage_interface.offlineTakeList({ farmId: 766 }).then(({ data }) => {
+    VE_API.manage_interface.offlineTakeList({ farmId: 766, isAllot: 1 }).then(({ data }) => {
         defalutList.value = data;
     });
 }

src/views/home/components/clientList.vue

@@ -30,35 +30,38 @@
                     </template>
                     <template #icon> </template>
                     <!-- 遍历当前分组中的每一项 -->
-                    <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
-                        <div v-for="(ele, index) in group.list" :key="index" class="list-item">
-                            <el-checkbox v-show="toSelectClient" label="" :value="ele.tel"> </el-checkbox>
-                            <div class="item-flex">
-                                <img
-                                    class="photo"
-                                    :src="
-                                        ele.icon || 'https://birdseye-img.sysuimars.com/dinggou-mini/defalut-icon.png'
-                                    "
-                                    alt=""
-                                />
-                                <div class="item-text">
-                                    <div class="name">
-                                        <span>{{ ele.name }}</span>
-                                        <el-icon
-                                            class="icon"
-                                            @click.stop="handlePerson('edit', ele)"
-                                            color="#2199F8"
-                                            size="16"
-                                            ><Edit
-                                        /></el-icon>
+                    <div v-show="!group.list.length" class="no-data">暂无数据</div>
+                    <div v-show="group.list.length">
+                        <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
+                            <div v-for="(ele, index) in group.list" :key="index" class="list-item">
+                                <el-checkbox v-show="toSelectClient" label="" :value="ele.tel"> </el-checkbox>
+                                <div class="item-flex">
+                                    <img
+                                        class="photo"
+                                        :src="
+                                            ele.icon || 'https://birdseye-img.sysuimars.com/dinggou-mini/defalut-icon.png'
+                                        "
+                                        alt=""
+                                    />
+                                    <div class="item-text">
+                                        <div class="name">
+                                            <span>{{ ele.name }}</span>
+                                            <el-icon
+                                                class="icon"
+                                                @click.stop="handlePerson('edit', ele)"
+                                                color="#2199F8"
+                                                size="16"
+                                                ><Edit
+                                            /></el-icon>
+                                        </div>
+                                        <div><span class="item-title">电话：</span>{{ ele.tel }}</div>
+                                        <div><span class="item-title">地址：</span>{{ ele.address || "--" }}</div>
                                     </div>
-                                    <div><span class="item-title">电话：</span>{{ ele.tel }}</div>
-                                    <div><span class="item-title">地址：</span>{{ ele.address || "--" }}</div>
+                                    <!-- <div class="blue-btn" @click="toCustomOneTree(ele)">去分配</div> -->
                                 </div>
-                                <!-- <div class="blue-btn" @click="toCustomOneTree(ele)">去分配</div> -->
                             </div>
-                        </div>
-                    </el-checkbox-group>
+                        </el-checkbox-group>
+                    </div>
                 </el-collapse-item>
                 <!-- <div class="item-flex">
                     <img class="photo" :src="ele.icon || 'https://birdseye-img.sysuimars.com/dinggou-mini/defalut-icon.png'" alt="" />
@@ -148,7 +151,7 @@ onMounted(() => {
 });
 
 function getUserList() {
-    VE_API.manage_interface.fetchGroupList({ farmId: 766 }).then(({ data }) => {
+    VE_API.manage_interface.fetchGroupList({ farmId: 766, isAllot: 0 }).then(({ data }) => {
         // defalutList.value = data
         groupList.value = Object.keys(data).map((key) => {
             return {
@@ -297,6 +300,10 @@ const emit = defineEmits(["update:checkDistributeShow", "update:checkData"]);
             color: #ffd489;
             cursor: pointer;
         }
+        .no-data {
+            text-align: center;
+            color: rgba(0, 0, 0, 0.6);
+        }
         ::v-deep {
             .el-collapse-item__arrow {
                 display: none;

src/views/home/components/leftTabs/imgManage.vue

@@ -72,7 +72,7 @@ const areaValue = ref(2); // 默认区域ID
 
 const areaOptions = ref([]);
 const currentPage = ref(1);
-const pageSize = ref(20); // 每页显示20条数据
+const pageSize = ref(10); // 每页显示20条数据
 const totalVal = ref(0);
 
 const imageList = ref([]);

src/views/home/index.vue

@@ -214,7 +214,6 @@ const saveDistributeEdit = () => {
         sampleIds: selectedTree.value,
         tels: selectedTels.value,
     };
-    console.log('params', params);
     VE_API.manage_interface.saveTreeUser(params).then(({code}) => {
         if (code === 0) {
             ElMessage.success("分配成功");

src/views/settingTree/index.vue

@@ -0,0 +1,621 @@
+<template>
+    <div class="base-container">
+        <div class="back-icon" @click="goBack">
+            <img src="@/assets/images/common/back-icon.png" />
+            返回
+        </div>
+        <div class="custom-content">
+            <div class="custom-l">
+                <div class="box-title">
+                    <img src="@/assets/images/common/chart-yellow.png" alt="" />
+                    果树列表
+                </div>
+                <div class="select-wrap">
+                    <el-select class="select-item" @change="handleAreaChange" v-model="areaVal" placeholder="分区" style="width: 146px">
+                        <el-option label="全部分区" :value="0"></el-option>
+                        <el-option v-for="(item, index) in areaOptions" :key="index" :label="item.name" :value="item.id" />
+                    </el-select>
+                    <el-select class="select-item" filterable @change="handleTypeChange" v-model="typeVal" placeholder="全部品类" style="width: 146px">
+                        <el-option label="全部品类" :value="0"></el-option>
+                        <el-option
+                            v-for="(species, index) in speciesList"
+                            :key="index"
+                            :label="species.name"
+                            :value="species.name"
+                        />
+                    </el-select>
+                    <el-select class="select-item" v-model="ageVal" placeholder="树龄" style="width: 146px">
+                        <el-option
+                            v-for="item in ageOptions"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value"
+                        />
+                    </el-select>
+                </div>
+                <div class="tree-list">
+                    <div
+                        class="list-item"
+                        v-for="(item, index) in allTrees"
+                        :key="index"
+                    >
+                        <div class="tree-icon">
+                            <img class="tree-img" src="@/assets/images/foster-home/tree-item.png" alt="" />
+                            <div class="tree-type-name-tag">{{ item.pz }}</div>
+                        </div>
+                        <div class="item-center">
+                            <div class="center-t">
+                                {{ item.fosterCode }}
+                                <!-- <span class="type-tag">综合:94分</span>
+                                <span class="type-tag">生态:92分</span> -->
+                            </div>
+                            <div class="center-item p-t-2 age-line">
+                                <div class="age-wrap">
+                                    <div class="has-age">
+                                        <div class="age">栽种时间：<span class="unit">{{item.plantDate || '--'}}</span></div>
+                                    </div>
+                                    <div class="sort-line"></div>
+                                </div>
+                                树龄：<span class="unit">{{ (item.age && item.age+'年') || '--' }}</span>
+                            </div>
+                            <div class="center-item">栽种区域：<span>{{ (item.area && item.area + '区') || '--' }}</span></div>
+                        </div>
+                    </div>
+                </div>
+                <div class="pagination-wrap">
+                    <el-pagination
+                        background
+                        v-model:current-page="currentPage"
+                        v-model:page-size="pageSize"
+                        :page-sizes="[10, 20, 50, 100]"
+                        layout="total, sizes, prev, pager, next"
+                        :total="totalVal"
+                        @size-change="handleSizeChange"
+                        @current-change="getSamplePage"
+                        />
+                </div>
+            </div>
+            <div class="custom-r">
+                <div class="second-title">
+                    <img src="@/assets/images/common/chart-yellow.png" alt="" />
+                    批量编辑果树
+                </div>
+                <div class="custom-detail">
+                    <div class="setting-item">
+                        <span class="edit-label">树龄：</span>
+                            <el-input-number
+                                @change="settingSinglePrice"
+                                class="number-input"
+                                :controls="false"
+                                placeholder="请输入树龄"
+                                v-model="settingAge"
+                                :min="0"
+                            />
+                            <span class="unit">年</span>
+                    </div>
+                    <div class="setting-item">
+                        <span class="edit-label">品种：</span>
+                            <el-select
+                                class="blue-select"
+                                v-model="settingPz"
+                                filterable
+                                style="width: 190px"
+                                placeholder="请选择品种"
+                            >
+                                <el-option
+                                    v-for="(species, index) in speciesList"
+                                    :key="index"
+                                    :label="species.name"
+                                    :value="species.name"
+                                />
+                            </el-select>
+                    </div>
+                    <div class="setting-item date-picker">
+                        <span class="edit-label">栽种时间：</span>
+                            <!-- <el-input-number @change="settingSinglePrice" class="number-input" :controls="false" v-model="item.total" :min="0" /> -->
+                        <el-date-picker
+                            v-model="plantDate"
+                            type="date"
+                            format="YYYY-MM-DD"
+                            style="width: 190px"
+                            value-format="YYYY-MM-DD"
+                            placeholder="请选择时间"
+                        />
+                    </div>
+                    
+                </div>
+                <!-- 渐变主色按钮 -->
+                <div class="btn-group">
+                    <div class="btn cancel-btn">取消</div>
+                    <div class="btn edit-btn" @click="settingForm">确认</div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 新增客户、编辑客户 -->
+    <edit-client-popup ref="editClientRef"></edit-client-popup>
+</template>
+
+<script setup>
+import { ref, computed, onMounted } from "vue";
+import { useRouter } from "vue-router";
+import editClientPopup from "@/components/editClientPopup.vue";
+import { useStore } from "vuex";
+import { ElMessage } from "element-plus";
+let store = useStore();
+
+const areaVal = ref(0);
+const areaOptions = ref([]);
+const typeVal = ref(0);
+const ageVal = ref(0);
+const ageOptions = ref([
+    { label: "全部树龄", value: 0 },
+    { label: "0-10年", value: 1 },
+    { label: "10-20年", value: 2 },
+]);
+
+const currentPage = ref(1);
+const pageSize = ref(20); // 每页显示20条数据
+const totalVal = ref(0);
+
+const allTrees = ref([]);
+
+const router = useRouter();
+function goBack() {
+    router.go(-1);
+}
+
+onMounted(() => {
+    getSamplePage()
+    
+    VE_API.manage_interface.speciesList({ farmId: 80865 }).then(({ data }) => {
+        speciesList.value = data;
+    });
+
+    // 获取区域列表
+    getBlueRegionList();
+})
+
+function getBlueRegionList() {
+    VE_API.manage_interface.fetchRegionList({ farmId: 766 }).then(({ data }) => {
+        areaOptions.value = data;
+    });
+}
+
+function handleAreaChange() {
+    currentPage.value = 1; // 重置页码
+    getSamplePage();
+}
+
+function handleTypeChange() {
+    currentPage.value = 1; // 重置页码
+    getSamplePage();
+}
+
+function getSamplePage() {
+    VE_API.manage_interface.fetchSamplePage({farmId: 80865, pz: typeVal.value ? typeVal.value : null, page: currentPage.value, limit: pageSize.value}).then(({data, count}) => {
+        allTrees.value = data
+        totalVal.value = count;
+    })
+}
+function handleSizeChange(newSize) {
+    pageSize.value = newSize;
+    currentPage.value = 1; // 重置页码
+    getSamplePage();
+}
+
+
+const editClientRef = ref(null);
+
+// 批量编辑
+const settingAge = ref(null);
+const settingPz = ref(null);
+const plantDate = ref(null);
+
+
+const speciesList = ref([]);
+
+function settingSinglePrice() {
+    console.log("sss");
+}
+
+function settingForm() {
+    const sampleIds = allTrees.value.map(item => item.sampleId);
+    const params = {
+        sampleIds,
+        farmId: Number(sessionStorage.getItem("currentFarmId")),
+        age: settingAge.value,
+        pz: settingPz.value,
+        plantDate: plantDate.value,
+    };
+    
+    VE_API.manage_interface.batchOpenOrCloseSample(params).then(({code}) => {
+        if (code === 0) {
+            ElMessage.success("批量设置成功");
+            getSamplePage();
+            settingAge.value = null;
+            settingPz.value = null;
+            plantDate.value = null;
+        }
+    });
+}
+</script>
+
+<style lang="scss" scoped>
+.base-container {
+    width: 100%;
+    height: 100%;
+    color: rgba(0, 0, 0, 0.9);
+    position: relative;
+    box-sizing: border-box;
+    z-index: 1;
+
+    .back-icon {
+        position: absolute;
+        z-index: 2;
+        // left: 405px;
+        right: 503px;
+        top: 30px;
+        cursor: pointer;
+        margin-right: 20px;
+        height: 40px;
+        display: flex;
+        align-items: center;
+        box-sizing: border-box;
+        padding: 0 28px;
+        border: 1px solid rgba(255, 255, 255, 0.78);
+        background: #2199F8;
+        border-radius: 4px;
+        color: #fff;
+        img {
+            width: 17px;
+            margin-right: 10px;
+        }
+    }
+    .custom-content {
+        width: 100%;
+        height: calc(100% - 36px);
+        display: flex;
+        justify-content: space-between;
+        box-sizing: border-box;
+        padding: 16px 20px 0 20px;
+        .select-wrap {
+            display: flex;
+            align-items: center;
+            .select-item + .select-item {
+                margin-left: 5px;
+            }
+        }
+
+        .type-tag {
+            color: #ffd489;
+            background: rgba(255, 212, 137, 0.06);
+            padding: 2px 4px;
+            font-size: 10px;
+            margin-left: 4px;
+            border-radius: 4px;
+        }
+
+        .custom-l {
+            flex: 1;
+            width: calc(100% - 473px);
+            height: 100%;
+            box-sizing: border-box;
+            border: 1px solid rgba(0, 0, 0, 0.2);
+            border-radius: 8px;
+            padding: 14px 10px 22px 10px;
+            position: relative;
+            .box-title {
+                font-size: 22px;
+                display: flex;
+                align-items: center;
+                font-family: "PangMenZhengDao";
+                margin-bottom: 16px;
+                color: #2199F8;
+                img {
+                    margin-right: 8px;
+                }
+            }
+
+            .tree-list {
+                display: flex;
+                flex-wrap: wrap;
+                padding-top: 8px;
+                max-height: calc(100% - 32px - 32px - 52px);
+                overflow: auto;
+            }
+            .pagination-wrap {
+                position: absolute;
+                bottom: 12px;
+                left: 50%;
+                transform: translateX(-50%);
+
+            }
+        }
+        .list-item {
+            background: rgba(120, 120, 120, 0.05);
+            padding: 8px 10px;
+            border-radius: 5px;
+            width: max-content;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-right: 8px;
+            margin-top: 12px;
+            border: 2px solid transparent;
+            cursor: pointer;
+            width: calc(25% - 8px);
+            box-sizing: border-box;
+            color: #FFFFFF;
+            &.selected {
+                background: rgba(33, 153, 248, 0.1);
+                border-color: #2199F8;
+            }
+            &.disabled {
+                opacity: 0.5;
+                cursor: not-allowed;
+                border-color: #ccc !important;
+            }
+            &.right-tree-list {
+                margin-top: 0px;
+            }
+            .item-info {
+                display: flex;
+                justify-content: space-between;
+                align-items: center;
+            }
+            .tree-icon {
+                position: relative;
+                .tree-type-name-tag {
+                    position: absolute;
+                    left: 0;
+                    bottom: 0;
+                    background: rgba(0, 0, 0, 0.6);
+                    border-radius: 0 0 5px 5px;
+                    font-size: 10px;
+                    width: 100%;
+                    text-align: center;
+                    height: 18px;
+                    line-height: 18px;
+                    backdrop-filter: blur(4px);
+                }
+                .tree-img {
+                    width: 63px;
+                    height: 63px;
+                    border-radius: 5px;
+                    object-fit: cover;
+                }
+            }
+            .item-center {
+                flex: 1;
+                padding-left: 12px;
+                color: #000000;
+                .center-t {
+                    font-size: 14px;
+                }
+                .center-item {
+                    color: #6c6c6c;
+                    font-size: 12px;
+                    padding-top: 2px;
+                    span {
+                        color: #000000;
+                    }
+                    ::v-deep {
+                        .el-progress-bar__outer {
+                            width: 100px;
+                            background: rgba(242, 243, 245, 0.23);
+                        }
+                    }
+                }
+                
+                .age-line {
+                    display: flex;
+                    align-items: center;
+                    padding-top: 4px;
+                    .age-wrap {
+                        display: flex;
+                        align-items: center;
+                        .sort-line {
+                            margin: 0 10px;
+                            height: 10px;
+                            width: 1px;
+                            background: #6C6C6C;
+                        }
+                    }
+                }
+                .progress-wrap {
+                    display: flex;
+                    align-items: center;
+                    .progress-text {
+                        font-size: 12px;
+                        color: #999999;
+                        .over {
+                            color: #FFD489;
+                        }
+                    }
+                }
+            }
+        }
+        
+        .right-tree-list + .right-tree-list {
+            margin-top: 12px;
+        }
+        .p-t-2 {
+            padding-top: 2px;
+        }
+        .custom-r {
+            width: 473px;
+            height: 100%;
+            box-sizing: border-box;
+            margin-left: 18px;
+            border: 1px solid rgba(0, 0, 0, 0.2);
+            border-radius: 8px;
+            .second-title {
+                border-radius: 8px 8px 0 0;
+                color: #2199F8;
+                font-size: 22px;
+                padding: 14px 12px;
+                font-family: "PangMenZhengDao";
+            }
+            
+            .user-name {
+                font-size: 16px;
+                color: rgba(0, 0, 0, 0.9);
+                padding-bottom: 12px;
+                font-weight: 500;
+            }
+            .custom-detail {
+                padding: 0 10px;
+                height: calc(100% - 60px - 60px);
+                box-sizing: border-box;
+                overflow: auto;
+                position: relative;
+
+                
+                .number-input {
+                    // margin: 0 12px;
+                    ::v-deep {
+                        &.el-input-number,
+                        &.el-input {
+                            width: 190px;
+                            background: rgba(33, 153, 248, 0.08);
+                            border: 1px solid #2199f8;
+                            border-radius: 5px;
+                        }
+                        .el-input__wrapper {
+                            background: transparent;
+                            box-shadow: none;
+                        }
+                        .el-input-number.is-without-controls .el-input__wrapper {
+                            padding: 0 8px;
+                        }
+                        .el-input__inner,
+                        .el-input__inner::placeholder {
+                            color: #2199f8;
+                            text-align: center;
+                        }
+                    }
+                }
+                .blue-select {
+                    ::v-deep {
+                        .el-select__wrapper {
+                            background: rgba(33, 153, 248, 0.08);
+                            box-shadow: 0 0 0 1px #2199f8 inset;
+                            font-size: 13px;
+                            .el-select__input {
+                                color: #2199f8;
+                            }
+                            .el-select__placeholder {
+                                color: #2199f8;
+                                text-align: center;
+                            }
+                            .el-select__caret {
+                                color: #2199f8;
+                            }
+                        }
+                    }
+                }
+                
+                .date-picker {
+                    ::v-deep {
+                        .el-date-editor {
+                            .el-input__wrapper {
+                                background: rgba(33, 153, 248, 0.08);
+                                box-shadow: 0 0 0 1px #2199f8 inset;
+                            }
+                            .el-input__inner,
+                            .el-input__inner::placeholder {
+                                color: #2199f8;
+                            }
+                            .el-input__prefix {
+                                color: #2199f8;
+                            }
+                        }
+                    }
+                }
+
+                .setting-item {
+                    padding-bottom: 16px;
+                    .edit-label {
+                        display: inline-block;
+                        width: 80px;
+                    }
+                    .unit {
+                        padding-left: 4px;
+                    }
+                }
+            }
+            .total {
+                padding-top: 12px;
+            }
+            .main-unit {
+                color: #F3C11D;
+            }
+            .box-line {
+                width: 100%;
+                height: 1px;
+                background: rgba(0, 0, 0, 0.2);
+            }
+            .selected-tree {
+                // display: flex;
+                margin: 12px 0;
+                background: rgba(255, 255, 255, 0.04);
+                padding: 0px 10px 12px 10px;
+                border-radius: 8px;
+                // max-height: calc(100% - 64px - 60px);
+                // overflow: auto;
+                box-sizing: border-box;
+                .list-item {
+                    width: 100%;
+                    box-sizing: border-box;
+                    margin-right: 0;
+                }
+            }
+            .selected-tips {
+                background: rgba(33, 153, 248, 0.1);
+                border: 1px solid #2199F8;
+                width: 100%;
+                text-align: center;
+                border-radius: 8px;
+                height: 50px;
+                line-height: 50px;
+                color: #2199F8;
+                box-sizing: border-box;
+            }
+
+            .bottom-btn {
+                height: 60px;
+                
+            }
+            .btn-group {
+                display: flex;
+                align-items: center;
+                justify-content: end;
+                height: 60px;
+                border-top: 0.5px solid rgba(0, 0, 0, 0.2);
+                width: 100%;
+                padding: 10px 12px;
+                box-sizing: border-box;
+                border-radius: 0 0 8px 8px;
+                .btn {
+                    cursor: pointer;
+                    padding: 8px 44px;
+                    font-size: 16px;
+                    border-radius: 4px;
+                    border: 1px solid #2199F8;
+                }
+                .cancel-btn {
+                    color: #2199F8;
+                }
+                .edit-btn {
+                    background: #2199F8;
+                    color: #fff;
+                }
+                .btn + .btn {
+                    margin-left: 12px;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/user/index.vue

@@ -14,20 +14,22 @@
                     style="width: 200px"
                     placeholder="搜索用户/手机号"
                     :prefix-icon="Search"
-                    />
-                <el-button class="ml-10" size="large" type="primary" plain @click="downloadTemplate">下载模板</el-button>
+                />
+                <el-button class="ml-10" size="large" type="primary" plain @click="downloadTemplate"
+                    >下载模板</el-button
+                >
                 <!-- <el-button size="large" type="primary" @click="uploadData">上传订单</el-button> -->
                 <el-upload
                     v-model:file-list="fileList"
                     class="upload-demo"
                     :action="config.base_url + 'adm/import_lighten_card_offline'"
                     multiple
-                    :data="{farmId: 766}"
+                    :data="{ farmId: 766 }"
                     :headers="uploadHeaders"
                     :on-success="handleUploadMsg"
                     :on-error="handleUploadMsg"
                     :limit="1"
-                    >
+                >
                     <el-button class="ml-10" size="large" type="primary">上传订单</el-button>
                 </el-upload>
                 <el-button class="ml-10" size="large" type="primary" plain>新建分组</el-button>
@@ -36,52 +38,19 @@
         </div>
         <div class="user-btn-group">
             <div class="btn-l">
-                <el-button  size="large" type="primary">优质用户</el-button>
+                <el-button size="large" type="primary">优质用户</el-button>
                 <el-button size="large" type="primary" plain>中等用户</el-button>
                 <el-button size="large" type="primary" plain>普通用户</el-button>
             </div>
             <div class="select-group">
-                <el-select
-                    v-model="cityVal"
-                    placeholder="选择省份"
-                    size="large"
-                    class="ml-10"
-                    style="width: 100px"
-                    >
-                    <el-option
-                        v-for="item in cityOptions"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value"
-                    />
+                <el-select v-model="cityVal" placeholder="选择省份" size="large" class="ml-10" style="width: 100px">
+                    <el-option v-for="item in cityOptions" :key="item.value" :label="item.label" :value="item.value" />
                 </el-select>
-                <el-select
-                    v-model="groupVal"
-                    placeholder="选择分组"
-                    size="large"
-                    class="ml-10"
-                    style="width: 120px"
-                    >
-                    <el-option
-                        v-for="item in groupOptions"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value"
-                    />
+                <el-select v-model="groupVal" placeholder="选择分组" size="large" class="ml-10" style="width: 120px">
+                    <el-option v-for="item in groupOptions" :key="item.value" :label="item.label" :value="item.value" />
                 </el-select>
-                <el-select
-                    v-model="levelVal"
-                    placeholder="守护等级"
-                    size="large"
-                    class="ml-10"
-                    style="width: 120px"
-                    >
-                    <el-option
-                        v-for="item in levelOptions"
-                        :key="item.value"
-                        :label="item.label"
-                        :value="item.value"
-                    />
+                <el-select v-model="levelVal" placeholder="守护等级" size="large" class="ml-10" style="width: 120px">
+                    <el-option v-for="item in levelOptions" :key="item.value" :label="item.label" :value="item.value" />
                 </el-select>
             </div>
         </div>
@@ -93,21 +62,23 @@
                     <template #default="scope">
                         <div class="user-info">
                             <!-- <el-avatar :size="24" src="https://birdseye-img-ali-cdn.sysuimars.com/birdseye-look-mini/91754/1750583672619.png" /> -->
-                            <el-avatar :size="24" :src="scope.row.icon || 'https://birdseye-img.sysuimars.com/dinggou-mini/defalut-icon.png'" />
+                            <el-avatar
+                                :size="24"
+                                :src="
+                                    scope.row.icon || 'https://birdseye-img.sysuimars.com/dinggou-mini/defalut-icon.png'
+                                "
+                            />
                             <span class="ml-10">{{ scope.row.name }}</span>
                         </div>
                     </template>
                 </el-table-column>
                 <el-table-column property="tel" label="联系电话" width="120" />
-                <el-table-column
-                    property="address"
-                    label="具体住址"
-                    width="240"
-                    show-overflow-tooltip
-                />
+                <el-table-column property="address" label="具体住址" width="240" show-overflow-tooltip />
                 <el-table-column label="守护等级">
                     <template #default="scope">
-                        <span :class="['level-tag', 'level-'+scope.row.level?.id]">{{ levelObj[scope.row.level?.id] }}</span>
+                        <span :class="['level-tag', 'level-' + scope.row.level?.id]">{{
+                            levelObj[scope.row.level?.id]
+                        }}</span>
                     </template>
                 </el-table-column>
                 <el-table-column property="fosterCode" label="守护树编号" />
@@ -116,21 +87,28 @@
                         <span :class="['status-text']">{{ scope.row.fosterStatus }}</span>
                     </template>
                 </el-table-column>
-                <el-table-column label="日期" sortable>
+                <!-- <el-table-column label="日期" sortable>
                     <template #default="scope">{{ scope.row.fosterDate }}</template>
-                </el-table-column>
+                </el-table-column> -->
+                <el-table-column property="fosterCode" label="守护树编号" />
                 <el-table-column label="操作" width="310">
                     <template #default="scope">
                         <div class="action-btn">
-                            <el-button type="primary" @click="handleMsg(scope.row)"><el-icon class="el-icon--right"><Comment /></el-icon>发消息</el-button>
-                            <el-button type="primary" @click="handleMsg(scope.row)"><el-icon><Briefcase /></el-icon>发礼物</el-button>
-                            <el-button type="danger" @click="deleteUser(scope.row)"><el-icon><Delete /></el-icon>删除</el-button>
+                            <el-button type="primary" @click="handleMsg(scope.row)"
+                                ><el-icon class="el-icon--right"><Comment /></el-icon>发消息</el-button
+                            >
+                            <el-button type="primary" @click="handleMsg(scope.row)"
+                                ><el-icon><Briefcase /></el-icon>发礼物</el-button
+                            >
+                            <el-button type="danger" @click="deleteUser(scope.row)"
+                                ><el-icon><Delete /></el-icon>删除</el-button
+                            >
                         </div>
                     </template>
                 </el-table-column>
             </el-table>
         </div>
-        
+
         <div class="pagination-wrap">
             <el-pagination
                 v-model:current-page="currentPage"
@@ -140,7 +118,7 @@
                 :total="totalVal"
                 @size-change="handleSizeChange"
                 @current-change="getTableData"
-                />
+            />
         </div>
         <div class="put-btn" v-if="selectedRows.length">
             <div class="btn-l">推送消息</div>
@@ -150,14 +128,14 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue';
-import { Search } from '@element-plus/icons-vue'
+import { onMounted, ref } from "vue";
+import { Search } from "@element-plus/icons-vue";
 import config from "@/api/config.js";
 import { useStore } from "vuex";
-import { ElMessage, ElMessageBox } from 'element-plus';
+import { ElMessage, ElMessageBox } from "element-plus";
 let store = useStore();
 
-const searchVal = ref(null)
+const searchVal = ref(null);
 
 const levelObj = {
     0: "平民",
@@ -165,50 +143,50 @@ const levelObj = {
     2: "白银守护",
     3: "赤金守护",
     4: "星勋守护",
-}
+};
 
 const statusObj = {
     0: "未授权",
     1: "待登录",
     2: "待激活",
-}
+};
 
 const tableData = ref([]);
 
-const selectedRows = ref([])
+const selectedRows = ref([]);
 function handleTableSelect(selection) {
-    selectedRows.value = selection
+    selectedRows.value = selection;
 }
 function handleMsg(row) {
-    console.log('row');
+    console.log("row");
 }
 
-const cityVal = ref("广东省")
+const cityVal = ref("广东省");
 const cityOptions = ref([
-    {label: "广东省", value: "广东省"},
-    {label: "湖北省", value: "湖北省"},
-])
+    { label: "广东省", value: "广东省" },
+    { label: "湖北省", value: "湖北省" },
+]);
 
-const groupVal = ref("分组101")
+const groupVal = ref("分组101");
 const groupOptions = ref([
-    {label: "分组101", value: "分组101"},
-    {label: "分组102", value: "分组102"},
-])
+    { label: "分组101", value: "分组101" },
+    { label: "分组102", value: "分组102" },
+]);
 
-const levelVal = ref("")
+const levelVal = ref("");
 const levelOptions = ref([
-    {label: "平民", value: "平民"},
-    {label: "青铜守护", value: "青铜守护"},
-    {label: "白银守护", value: "白银守护"},
-])
+    { label: "平民", value: "平民" },
+    { label: "青铜守护", value: "青铜守护" },
+    { label: "白银守护", value: "白银守护" },
+]);
 
 const currentPage = ref(1);
 const pageSize = ref(20); // 每页显示20条数据
 const totalVal = ref(0);
 
 onMounted(() => {
-    getTableData()
-})
+    getTableData();
+});
 
 function handleSizeChange(newSize) {
     pageSize.value = newSize;
@@ -217,48 +195,57 @@ function handleSizeChange(newSize) {
 }
 
 function getTableData() {
-    // 模拟获取数据
-    VE_API.manage_interface.fetchUserList({farmId: 766, page: currentPage.value, limit: pageSize.value}).then(({data, count}) => {
-        tableData.value = data;
-        totalVal.value = count
-    });
+    // 获取数据
+    VE_API.manage_interface
+        .fetchUserList({ farmId: 766, page: currentPage.value, limit: pageSize.value })
+        .then(({ data, count }) => {
+            tableData.value = data;
+            totalVal.value = count;
+        });
 }
 
 // 下载模板
 function downloadTemplate() {
-    VE_API.manage_user.downloadTemplate().then((response) => {
-        const blob = new Blob([response], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
-        const link = document.createElement('a');
-        link.href = window.URL.createObjectURL(blob);
-        link.download = '用户数据模板.xlsx';
-        link.click();
-    }).catch(error => {
-        console.error('下载模板失败:', error);
-    });
+    VE_API.manage_user
+        .downloadTemplate()
+        .then((response) => {
+            const blob = new Blob([response], {
+                type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+            });
+            const link = document.createElement("a");
+            link.href = window.URL.createObjectURL(blob);
+            link.download = "用户数据模板.xlsx";
+            link.click();
+        })
+        .catch((error) => {
+            console.error("下载模板失败:", error);
+        });
 }
 
 const fileList = ref([]);
 const uploadHeaders = {
-    'token': store.getters.token,
+    token: store.getters.token,
 };
 // 上传数据
 function handleUploadMsg(res) {
     ElMessage.success(res.msg);
+    getTableData(); // 刷新表格数据
 }
 
 // 删除数据
 function deleteUser(item) {
-    ElMessageBox.confirm(`确认删除 ${item.name} 的守护权限吗？`, '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
+    ElMessageBox.confirm(`确认删除 ${item.name} 的守护权限吗？`, "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
     }).then(() => {
-        // 这里可以添加取消守护的逻辑
-        ElMessage({
-            type: 'success',
-            message: `已删除 ${item.name}`,
+        VE_API.manage_user.deleteUser({ id: item.id }).then(({ code }) => {
+            if (code === 0) {
+                ElMessage.success("删除成功");
+                getTableData(); // 刷新表格数据
+            }
         });
-    }).catch(() => {});
+    });
 }
 </script>
 
@@ -336,29 +323,29 @@ function deleteUser(item) {
             background: rgba(3, 178, 213, 0.2);
         }
         .level-1 {
-            color: #D88C4A;
+            color: #d88c4a;
             background: rgba(200, 156, 117, 0.2);
         }
         .level-2 {
-            color: #6293C1;
+            color: #6293c1;
             background: rgba(115, 193, 255, 0.2);
         }
         .level-3 {
-            color: #B18C0D;
+            color: #b18c0d;
             background: rgba(243, 191, 48, 0.2);
         }
         .level-4 {
-            color: #BD6FE8;
+            color: #bd6fe8;
             background: rgba(236, 125, 255, 0.2);
         }
         .status-text {
-            color: #7D7D7D;
+            color: #7d7d7d;
         }
         .status-1 {
-            color: #FFAA00;
+            color: #ffaa00;
         }
         .status-2 {
-            color: #2199F8;
+            color: #2199f8;
         }
     }
     .pagination-wrap {
@@ -376,7 +363,7 @@ function deleteUser(item) {
         bottom: 10px;
         .btn-l {
             padding: 12px 44px;
-            background: #F0AC37;
+            background: #f0ac37;
             border-radius: 4px;
             font-size: 16px;
             color: #fff;
@@ -384,7 +371,7 @@ function deleteUser(item) {
         .btn-r {
             margin-left: 30px;
             padding: 12px 36px;
-            background: #2199F8;
+            background: #2199f8;
             border-radius: 4px;
             font-size: 16px;
             color: #fff;