feat：完善虚拟展厅

src/api/org.js

@@ -52,7 +52,6 @@ export function deleteMuseum(id) {
   return request({
     url: `/sys/dept/${id}`,
     method: 'delete',
-    data
   })
 }
 

src/components/Breadcrumb/index.vue

@@ -33,7 +33,7 @@ export default {
       const first = matched[0]
 
       if (!this.isDashboard(first)) {
-        matched = [{ path: '/dashboard', meta: { title: 'Dashboard' }}].concat(matched)
+        matched = [{ path: '/dashboard', meta: { title: '首页' }}].concat(matched)
       }
 
       this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)

src/router/index.js

@@ -42,24 +42,23 @@ export const constantRoutes = [{
     hidden: true
   },
 
-  // {
-  //   path: '/',
-  //   component: Layout,
-  //   redirect: '/dashboard',
-  //   children: [{
-  //     path: 'dashboard',
-  //     name: 'Dashboard',
-  //     component: () => import('@/views/dashboard/index'),
-  //     meta: {
-  //       title: 'Dashboard',
-  //       icon: 'dashboard'
-  //     }
-  //   }]
-  // },
   {
     path: '/',
     component: Layout,
-    redirect: '/display',
+    redirect: '/dashboard',
+    children: [{
+      path: 'dashboard',
+      name: 'Dashboard',
+      component: () => import('@/views/dashboard/index'),
+      meta: {
+        title: '首页',
+        icon: 'dashboard'
+      }
+    }]
+  },
+  {
+    path: '/display',
+    component: Layout,
     children: [{
       path: 'display',
       name: 'Display',

src/views/dashboard/index.vue

 <template>
   <div class="dashboard-container">
-    <div class="dashboard-text">name: {{ name }}</div>
+    <div class="dashboard-text">数据看板</div>
   </div>
 </template>
 

src/views/museum/components/InfoEditDialog.vue

@@ -28,6 +28,7 @@
             :props="optionProps"
             placeholder="请选择所属部门"
             :key="pidModalKey"
+            disabled
           >
           </el-cascader>
         </el-form-item>
@@ -43,21 +44,26 @@
           </el-cascader>
         </el-form-item>
 
-        <el-form-item label="经度" :label-width="formLabelWidth">
-          <el-input
-            v-model="dialogForm.longitude"
-            autocomplete="off"
-            placeholder="请输入经度"
-          ></el-input>
-        </el-form-item>
-
-        <el-form-item label="纬度" :label-width="formLabelWidth">
-          <el-input
-            v-model="dialogForm.latitude"
-            autocomplete="off"
-            placeholder="请输入纬度"
-          ></el-input>
-        </el-form-item>
+        <el-row :gutter="5">
+          <el-col :span="12">
+            <el-form-item label="经度" :label-width="formLabelWidth">
+              <el-input
+                style="width: 100%"
+                v-model="dialogForm.longitude"
+                autocomplete="off"
+                placeholder="请输入经度"
+              ></el-input>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12"
+            ><el-form-item label="纬度" :label-width="formLabelWidth">
+              <el-input
+                v-model="dialogForm.latitude"
+                autocomplete="off"
+                placeholder="请输入纬度"
+              ></el-input> </el-form-item
+          ></el-col>
+        </el-row>
         <el-form-item label="状态" :label-width="formLabelWidth">
           <el-switch v-model="status"> </el-switch>
         </el-form-item>
@@ -142,6 +148,7 @@ export default {
       handler: function (value) {
         let that = this;
         that.dialogForm = JSON.parse(JSON.stringify(value));
+
         // 编辑状态
         if (that.dialogForm.id) {
           that.status = Boolean(Number(that.dialogForm.status));
@@ -156,41 +163,21 @@ export default {
             ];
           }
           // 编辑状态下禁用当前所属地之下的节点
-          if (this.regionTree.length > 0) {
-            this.regionTree.forEach((item, index) => {
-              // TODO:
-              if (item.regionCode == this.dialogForm.regionCode) {
-                item.disabled = true;
-                // 修改当前这一层和下面一层为禁用
-                // for (let index = 0; index < this.regionTree.length; index++) {
-                //  this.regionTree[index].disabled = true
-                //  if (this.regionTree[index].children) {
-                  
-                //  }
-                // }
-              }
-            });
-          }
         }
       },
       immediate: true,
       deep: true,
     },
-    orgTreeData(value) {
-      // 遍历，如果children为空，则直接去掉children，以免选择器中显示无结果
-      if (value) {
-        let tree = [...value];
-        loopTree(tree);
-        function loopTree(arr) {
-          arr.forEach((item) => {
-            if (item.children && item.children.length == 0) {
-              delete item.children;
-            } else {
-              loopTree(item.children);
-            }
-          });
+    orgTreeData: {
+      handler: function (value) {
+        if (value && value.length > 0) {
+          if (value.length > 0 && !this.dialogForm.id) {
+            this.dialogForm.pid = value[0].id; //新增状态下，将所属部门默认填写为树结构根节点
+          }
         }
-      }
+      },
+      immediate: true,
+      deep: true,
     },
     status(value) {
       console.log(value);

src/views/museum/index.vue

@@ -83,7 +83,7 @@ import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
 import InfoEditDialog from "./components/InfoEditDialog";
 import SearchBar from "@/components/SearchBar";
-import { deleteFiles } from "@/api/file";
+import { deleteMuseum } from "@/api/org";
 export default {
   components: {
     TablePage,
@@ -135,10 +135,6 @@ export default {
         this.dict = value;
       }
     },
-    orgTreeData(value) {
-      console.log("123", value);
-      // setTimeout(()=>{value},500)
-    },
   },
   computed: {
     tableTitle() {
@@ -244,9 +240,10 @@ export default {
           break;
         case "delete":
           const { id } = row;
-          let res = await deleteFiles([id]);
+          let res = await deleteMuseum(id);
           if (res.code == 0) {
             this.$message.success("删除成功！");
+           this.loadData(true);
           }
           break;
       }
@@ -261,7 +258,7 @@ export default {
       };
       let res = await editCulturalRelic(params);
       if (res.code == 0) {
-        this.loadData();
+        this.loadData(true);
         this.$message.success("修改成功！");
       }
     },
@@ -273,13 +270,13 @@ export default {
     // 改变页容量
     handleSizeChange(value) {
       this.list.size = value;
-      this.loadData();
+      this.loadData(true);
     },
 
     // 改变当前显示页
     handleCurrentChange(value) {
       this.list.current = value;
-      this.loadData();
+     this.loadData(true);
     },
 
     // 搜索

src/views/virtual/components/InfoEditDialog.vue

@@ -23,7 +23,7 @@
         <el-form-item label="所属博物馆" :label-width="formLabelWidth">
           <el-cascader
             style="width: 100%"
-            v-model="dialogForm.pid"
+            v-model="dialogForm.deptId"
             :options="orgTreeData"
             :props="optionProps"
             placeholder="请选择所属博物馆"
@@ -109,7 +109,7 @@ export default {
       set: function () {},
     },
     title() {
-      if (this.dialogForm.id) {
+      if (this.dialogForm.bvId) {
         return "修改虚拟展厅信息";
       } else {
         return "添加虚拟展厅";
@@ -128,7 +128,8 @@ export default {
         let that = this;
         that.dialogForm = JSON.parse(JSON.stringify(value));
         // 编辑状态
-        if (that.dialogForm.id) {
+        if (that.dialogForm.bvId) {
+          console.log('that.dialogForm.',that.dialogForm);
           that.status = Boolean(Number(that.dialogForm.status));
           // 回填封面
           if (this.dialogForm.faceImage) {
@@ -140,22 +141,6 @@ export default {
               },
             ];
           }
-          // 编辑状态下禁用当前所属地之下的节点
-          if (this.regionTree.length > 0) {
-            this.regionTree.forEach((item, index) => {
-              // TODO:
-              if (item.regionCode == this.dialogForm.regionCode) {
-                item.disabled = true;
-                // 修改当前这一层和下面一层为禁用
-                // for (let index = 0; index < this.regionTree.length; index++) {
-                //  this.regionTree[index].disabled = true
-                //  if (this.regionTree[index].children) {
-
-                //  }
-                // }
-              }
-            });
-          }
         }
       },
       immediate: true,
@@ -236,7 +221,7 @@ export default {
       });
     },
     async handleSubmit() {
-      if (this.dialogForm.id) {
+      if (this.dialogForm.bvId) {
         let params = { ...this.dialogForm };
         // 回填图片
         if (this.faceImage.length > 0) {
@@ -248,8 +233,8 @@ export default {
           params.regionCode = params.regionCode[params.regionCode.length - 1];
         }
         // 处理所属部门
-        if (params.pid instanceof Array) {
-          params.pid = params.pid[params.pid.length - 1];
+        if (params.deptId instanceof Array) {
+          params.deptId = params.deptId[params.deptId.length - 1];
         }
         // 处理状态
         // debugger
@@ -268,7 +253,7 @@ export default {
         // 处理行政区划
         params.regionCode = params.regionCode[params.regionCode.length - 1];
         // 处理所属部门
-        params.pid = params.pid[params.pid.length - 1];
+        params.deptId = params.deptId[params.deptId.length - 1];
         // 处理状态
         params.status = this.status ? 1 : 0;
         // return

src/views/virtual/config.js

@@ -10,9 +10,10 @@ export const title = [{
     columnAlign: 'center',
   },
   {
-    prop: "faceImage",
+    prop: "faceImageUrl",
     label: "封面",
     columnAlign: 'center',
+    isFaceImage: true,
   },
   {
     prop: "regionName",
@@ -23,12 +24,14 @@ export const title = [{
     prop: "status",
     label: "状态",
     columnAlign: 'center',
-    isStatus: true
+    isStatus: true,
+    width:100
   },
   {
     prop: "url",
     label: "链接",
     columnAlign: 'center',
+    width:350
   },
  
 ]

src/views/virtual/index.vue

@@ -6,7 +6,7 @@
         type="primary"
         @click.native="handleOperation({ type: 'add' })"
       >
-        <i class="el-icon-s-promotion"></i>
+        <i class="el-icon-s-promotion" />
         发布</el-button
       >
     </div>
@@ -15,10 +15,20 @@
       :tableTitle="tableTitle"
       :operates="tableOperates"
     >
+      <template v-slot:faceImageUrl="data">
+        <img
+          :src="data.scope.faceImageUrl"
+          alt="查看大图"
+          v-if="data.scope.faceImageUrl"
+          style="cursor: pointer"
+          width="100px"
+          @click="handelPreviewImages(data.scope.faceImageUrl)"
+        />
+      </template>
       <template v-slot:status="data">
         <el-popconfirm
           :title="getStatusTitle(data.scope.status)"
-          @confirm="handleChangeStatus(data.scope.status)"
+          @onConfirm="handleChangeStatus(data.scope)"
         >
           <el-switch
             slot="reference"
@@ -26,6 +36,7 @@
           ></el-switch>
         </el-popconfirm>
       </template>
+
       <template v-slot:operates="scope">
         <TableOperation
           :operations="tableOperations"
@@ -48,9 +59,15 @@
     <InfoEditDialog
       :visible="drawerVisible"
       :form="form"
+      :orgTreeData="orgTreeData"
       @handleClose="handleClose"
       @refresh="loadData"
     />
+    <el-image-viewer
+      v-if="imgViewerVisible"
+      :on-close="closeImgViewer"
+      :url-list="imgList"
+    />
   </div>
 </template>
 
@@ -58,7 +75,7 @@
 import TablePage from "@/components/Table/TablePage.vue";
 import TableOperation from "@/components/Table/TableOperation.vue";
 import { title, operates, operations } from "./config";
-import { deleteVirtual, getVirtualList } from "@/api/vitual";
+import { deleteVirtual, editVirtual, getVirtualList } from "@/api/vitual";
 import InfoEditDialog from "./components/InfoEditDialog";
 import SearchBar from "@/components/SearchBar";
 
@@ -68,6 +85,8 @@ export default {
     TableOperation,
     InfoEditDialog,
     SearchBar,
+    "el-image-viewer": () =>
+      import("element-ui/packages/image/src/image-viewer"),
   },
   data() {
     return {
@@ -106,13 +125,16 @@ export default {
       drawerVisible: false,
       form: {
         name: "", //名称
-        pid: "", //所属博物馆
+        deptId: "", //所属博物馆
         regionCode: "", //所属地code
         status: false, //上下架状态
         faceImage: "", //封面
         url: "", //链接
       },
       loading: false,
+      orgTreeData: [],
+      imgViewerVisible: false,
+      imgList: [],
     };
   },
   watch: {
@@ -144,6 +166,7 @@ export default {
   },
   mounted() {
     this.loadData();
+    this.loadOrgTree();
   },
   methods: {
     async search(form) {
@@ -177,7 +200,11 @@ export default {
         this.list = res.data;
       }
     },
-
+    loadOrgTree() {
+      this.$store.dispatch("org/getMuseumTreeData", true).then((res) => {
+        this.orgTreeData = res;
+      });
+    },
     async handleOperation(value, row) {
       console.log("handleOperation", value, row);
       switch (value.type) {
@@ -192,7 +219,7 @@ export default {
           this.drawerVisible = true;
           break;
         case "delete":
-          let deleteRes = await deleteVirtual([row.crId]);
+          let deleteRes = await deleteVirtual([row.bvId]);
           if (deleteRes.code == 0) {
             this.$message.success("删除成功！");
             this.loadData();
@@ -200,6 +227,20 @@ export default {
           break;
       }
     },
+    // 关闭预览图片
+    closeImgViewer() {
+      this.imgViewerVisible = false;
+    },
+    // 预览图片
+    handelPreviewImages(images) {
+      this.imgViewerVisible = true;
+      if (images.length > 1) {
+        this.imgList = images.split(",");
+      } else {
+        this.imgList = [images];
+      }
+    },
+
     async handleChangeStatus(row) {
       console.log("status", row);
       const { status } = row;
@@ -208,7 +249,7 @@ export default {
         ...row,
         status: newStatus,
       };
-      let res = await editCulturalRelic(params);
+      let res = await editVirtual(params);
       if (res.code == 0) {
         this.loadData();
         this.$message.success("修改成功！");
@@ -251,6 +292,9 @@ export default {
     // 关闭Dialog
     handleClose() {
       this.drawerVisible = false;
+      this.form = {
+        status: true,
+      };
     },
   },
 };

vue.config.js

@@ -27,7 +27,8 @@ module.exports = {
   publicPath: '/',
   outputDir: 'dist',
   assetsDir: 'static',
-  lintOnSave: process.env.NODE_ENV === 'development',
+  // lintOnSave: process.env.NODE_ENV === 'development',
+  lintOnSave:false,
   productionSourceMap: false,
   devServer: {
     port: port,