degug

src/api/spacetask.js

@@ -0,0 +1,23 @@
+
+import httputils from '@/api/httputils'
+// 空间类型功能树
+export function building_floor(params) {
+    return httputils.getJson(`/clmt/query/building_floor`, params)
+}
+// 字典查询
+export function dict_types(params) {
+    return httputils.getJson(`/clmt/dict/types`, params)
+}
+
+// 查询任务空间
+export function space_job(params) {
+    return httputils.postJson(`/clmt/job/space_job`, params)
+}
+// 设置空间任务
+export function set_job(params) {
+    return httputils.postJson(`/clmt/job/set_job`, params)
+}
+// 二维码详情
+export function quey_qrcode(params) {
+    return httputils.postJson(`/clmt/query/qrcode`, params)
+}

src/views/spacetask.vue

@@ -3,115 +3,396 @@
     <div class="top">
       <div class="top-item">
         <span>建筑/楼层:</span>
-        <el-select v-model="value" placeholder="请选择">
+        <el-select
+          v-model="floorValue"
+          @change="changeFloor"
+          placeholder="请选择"
+        >
           <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
+            v-for="item in floorOptions"
+            :key="item.id"
+            :label="item.localName"
+            :value="item.id"
           >
           </el-option>
         </el-select>
       </div>
       <div class="top-item">
         <span>功能分区:</span>
-        <el-select v-model="value" placeholder="请选择">
+        <el-select
+          v-model="parttionValue"
+          @change="spaceJob"
+          placeholder="请选择"
+        >
           <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
+            v-for="item in partitioneList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
           >
           </el-option>
         </el-select>
       </div>
       <el-input
         :style="{ width: '300px' }"
-        v-model="input"
+        v-model="serarchValue"
         placeholder="请输入内容"
       ></el-input>
       <div class="top-item">
         <span>任务状态:</span>
-        <el-select v-model="value" placeholder="请选择">
+        <el-select
+          v-model="jobStatusValue"
+          @change="changeFloor"
+          placeholder="请选择"
+        >
           <el-option
-            v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value"
+            v-for="(item, key) in jobList"
+            :key="key"
+            :label="item.name"
+            :value="item.code"
           >
           </el-option>
         </el-select>
       </div>
-      <el-button type="primary" plain>重置状态</el-button>
-      <el-button type="primary" plain>新建空间结构核查任务</el-button>
-      <el-button type="primary" plain>新建“现场勘探任务”</el-button>
+      <el-button type="primary" @click="clearjobStatus" plain
+        >重置状态</el-button
+      >
+      <el-button type="primary" @click="CreatSpaceCheck" plain
+        >新建空间结构核查任务</el-button
+      >
+      <el-button type="primary" @click="createTask" plain
+        >新建“现场勘探任务”</el-button
+      >
     </div>
     <div class="table">
-      <el-table :data="tableData" style="width: 100%">
-        <el-table-column prop="date" label="日期" width="180">
+      <el-table
+        v-if="tableHeight"
+        @selection-change="handleSelectionChange"
+        :data="tableData"
+        ref="multipleTable"
+        style="width: 100%"
+        :height="tableHeight"
+      >
+        <el-table-column type="selection" width="55"> </el-table-column>
+        <el-table-column
+          v-for="(item, key) in tableHead"
+          :prop="item.prop"
+          :label="item.lable"
+          :width="item.width"
+          :key="key"
+        >
+          <template slot-scope="scope">
+            <div>
+              <div v-if="item.prop == 'job'">
+                {{ statusObj[scope.row[item.prop]] }}
+              </div>
+              <div v-else-if="item.prop == 'Arcode'">
+                <el-button type="text" @click="ArcodeMsg(scope)"
+                  >详情</el-button
+                >
+              </div>
+              <div v-else>
+                {{ scope.row[item.prop] ? scope.row[item.prop] : "--" }}
+              </div>
+            </div>
+          </template>
         </el-table-column>
-        <el-table-column prop="name" label="姓名" width="180">
-        </el-table-column>
-        <el-table-column prop="address" label="地址"> </el-table-column>
       </el-table>
     </div>
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="40%"
+      :before-close="handleClose"
+    >
+      <div>
+        <ul class="dlalog-top">
+          <li>
+            <span class="title">建筑：</span
+            ><span>{{
+              detailSpace.buildName ? detailSpace.buildName : ""
+            }}</span>
+          </li>
+          <li>
+            <span class="title">楼层：</span>
+            <span>{{
+              detailSpace.floorName ? detailSpace.floorName : ""
+            }}</span>
+          </li>
+          <li>
+            <span class="title">空间本地名称：</span>
+            <span>{{
+              detailSpace.localName ? detailSpace.localName : ""
+            }}</span>
+          </li>
+          <li>
+            <span class="title">本地编码：</span>
+            <span>{{
+              detailSpace.classCode ? detailSpace.classCode : ""
+            }}</span>
+          </li>
+          <li>
+            <span class="title">数字化交付编码：</span>
+            <span>{{ detailSpace.id ? detailSpace.id : "" }}</span>
+          </li>
+        </ul>
+        <div class="body">
+          <img v-for="(obj, key) in urls" :key="key" :src="obj.url" alt="" />
+        </div>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
+import {
+  building_floor,
+  dict_types,
+  space_job,
+  set_job,
+  quey_qrcode,
+} from "@/api/spacetask.js";
+import { space_zone } from "@/api/workScope.js";
+import QRCode from "qrcode";
+const statusObj = {
+  all: "全部",
+  "00": "新空间未核查",
+  "01": "有结构核查任务",
+  "02": "有结构问题",
+  "03": "结构核查完毕",
+  "04": "有现场勘测任务",
+  "05": "已完成勘测任务",
+};
+const tableHead = [
+  {
+    lable: "建筑",
+    prop: "buildName",
+    width: "180",
+  },
+  {
+    lable: "楼层",
+    prop: "floorName",
+    width: "180",
+  },
+  {
+    lable: "空间本地名称",
+    prop: "localName",
+    width: "180",
+  },
+  {
+    lable: "空间本地编码",
+    prop: "classCode",
+    width: "180",
+  },
+  {
+    lable: "数字化交付编码编码",
+    prop: "id",
+    width: "380",
+  },
+  {
+    lable: "空间状态",
+    prop: "job",
+    width: "180",
+  },
+  {
+    lable: "空间二维码粘贴位置",
+    prop: "Arcode",
+    width: "180",
+  },
+];
 export default {
   data() {
     return {
-      options: [
-        {
-          value: "选项1",
-          label: "黄金糕",
-        },
-        {
-          value: "选项2",
-          label: "双皮奶",
-        },
-        {
-          value: "选项3",
-          label: "蚵仔煎",
-        },
-        {
-          value: "选项4",
-          label: "龙须面",
-        },
-        {
-          value: "选项5",
-          label: "北京烤鸭",
-        },
-      ],
-      value: "",
-      tableData: [
-        {
-          date: "2016-05-02",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1518 弄",
-        },
-        {
-          date: "2016-05-04",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1517 弄",
-        },
-        {
-          date: "2016-05-01",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1519 弄",
-        },
-        {
-          date: "2016-05-03",
-          name: "王小虎",
-          address: "上海市普陀区金沙江路 1516 弄",
-        },
-      ],
+      statusObj,
+      tableHead,
+      serarchValue: "", //搜索内容
+      floorOptions: [], //楼层
+      partitioneList: [], //功能分区
+      jobList: [], //任务状态
+      floorValue: "",
+      parttionValue: "",
+      jobStatusValue: "",
+      buildingId: "", //建筑id
+      buildName: "", // 建筑名称
+      currentFloorName: "",
+      tableData: [],
+      choiceSpace: [], //选中的空间
+      tableHeight: 0, //table高度
+      detailSpace: {}, //空间详情
+      dialogVisible: false, // 弹窗显示
+      urls: [], // 二维码路径
     };
   },
+  created() {
+    Promise.all([
+      this.getBuildFloor(),
+      this.spaceZone(),
+      this.dictTypes(),
+    ]).then((res) => {
+      this.spaceJob();
+    });
+  },
+  mounted() {
+    const box = document.getElementById("spaceTast");
+    this.tableHeight = box.offsetHeight - 60;
+  },
+  methods: {
+    // 获取楼层
+    getBuildFloor() {
+      return new Promise((reslove, reject) => {
+        building_floor({ target: "rtn" })
+          .then((res) => {
+            this.floorOptions = res.rtn[0].floor;
+            this.buildingId = res.rtn[0].id;
+            this.buildName = res.rtn[0].localName;
+            reslove();
+          })
+          .catch(() => {
+            reject();
+          });
+      });
+    },
+    //请求空间区域类型
+    spaceZone() {
+      return new Promise((reslove, reject) => {
+        space_zone({})
+          .then((res) => {
+            res.rtn.forEach((item) => {
+              this.partitioneList.push({
+                name: item.name,
+                id: item.code,
+              });
+            });
+            reslove();
+          })
+          .catch(() => {
+            reject();
+          });
+      });
+    },
+    // 获取任务状态
+    dictTypes() {
+      return new Promise((reslove, reject) => {
+        dict_types({ target: "job" })
+          .then((res) => {
+            this.jobList = res.job;
+            reslove();
+          })
+          .catch(() => {
+            reject();
+          });
+      });
+    },
+    // 获取任务状态
+    spaceJob() {
+      const jobStatus =
+        (this.jobStatusValue == "all") | (this.jobStatusValue == "")
+          ? []
+          : [this.jobStatusValue];
+      const data = {
+        buildingId: this.buildingId,
+        floorId: this.floorValue,
+        zoneType: this.parttionValue,
+        jobStatus,
+        target: "rtn",
+      };
+      space_job(data).then((res) => {
+        this.tableData = res.rtn.map((obj) => {
+          obj.buildName = this.buildName;
+          // obj.floorName = this.currentFloorName;
+          return obj;
+        });
+      });
+    },
+    // 改变楼层
+    changeFloor(a, b) {
+      this.spaceJob();
+    },
+    //重置工作状态
+    clearjobStatus() {
+      this.setStatus("00");
+    },
+    //新建空间结构核查任务
+    CreatSpaceCheck() {
+      this.setStatus("01");
+    },
+    //新建“现场勘探任务”
+    createTask() {
+      this.setStatus("04");
+    },
+    // table勾选回调
+    handleSelectionChange(val) {
+      this.choiceSpace = val;
+    },
+    // 设置工作状态
+    setStatus(status) {
+      if (this.choiceSpace.length) {
+        //获取对应勾选id
+        const spaceIdList = [];
+        this.choiceSpace.forEach((obj) => {
+          spaceIdList.push(obj.id);
+        });
+        const data = {
+          spaceId: spaceIdList,
+          buildingId: this.buildingId,
+          floorId: this.floorValue,
+          jobStatus: status,
+          target: "action",
+        };
+        set_job(data).then(() => {
+          // 设置完成后调用获取新的table
+          this.spaceJob();
+          this.toggleSelection();
+        });
+      } else {
+        this.$message("勾选对应空间后方可设置!!!");
+      }
+    },
+    //清空勾选
+    toggleSelection() {
+      this.$refs.multipleTable.clearSelection();
+    },
+    // 点击打开详情
+    ArcodeMsg(obj) {
+      this.detailSpace = obj.row;
+      this.urls = [];
+      const data = {
+        objId: this.detailSpace.id,
+        target: "rtn",
+      };
+      quey_qrcode(data).then((res) => {
+        if (res.rtn && res.rtn.length) {
+          res.rtn.forEach((a) => {
+            QRCode.toDataURL(a.qr_code)
+              .then((url) => {
+                this.urls.push({
+                  url,
+                  qr_code: a.qr_code,
+                });
+              })
+              .catch((err) => {
+                console.error(err);
+              });
+          });
+        }
+        this.dialogVisible = true;
+      });
+    },
+    // 关闭弹窗
+    handleClose() {
+      this.dialogVisible = false;
+    },
+  },
 };
 </script>
 <style lang="less" scoped>
+ul,
+li {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+}
 #spaceTast {
+  height: 100%;
   .top {
     display: flex;
     align-items: center;
@@ -124,5 +405,16 @@ export default {
       }
     }
   }
+  .dlalog-top {
+    li {
+      width: 700px;
+      display: flex;
+      align-items: center;
+      justify-content: start;
+      .title {
+        width: 220px;
+      }
+    }
+  }
 }
 </style>

vue.config.js

@@ -15,4 +15,9 @@ module.exports = {
         // lintOnSave: false
     },
     lintOnSave: false,
+    publicPath: '/poc_web',
+    // 打包名称
+    outputDir: 'poc_web',
+    // 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
+    assetsDir: 'static',
 };