fix

src/utils/ruoyi.js

@@ -1,249 +1,249 @@
-
-
-/**
- * 通用js方法封装处理
- * Copyright (c) 2019 ruoyi
- */
-
-// 日期格式化
-export function parseTime(time, pattern) {
-  if (arguments.length === 0 || !time) {
-    return null
-  }
-  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
-  let date
-  if (typeof time === 'object') {
-    date = time
-  } else {
-    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
-      time = parseInt(time)
-    } else if (typeof time === 'string') {
-      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
-    }
-    if ((typeof time === 'number') && (time.toString().length === 10)) {
-      time = time * 1000
-    }
-    date = new Date(time)
-  }
-  const formatObj = {
-    y: date.getFullYear(),
-    m: date.getMonth() + 1,
-    d: date.getDate(),
-    h: date.getHours(),
-    i: date.getMinutes(),
-    s: date.getSeconds(),
-    a: date.getDay()
-  }
-  const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
-    let value = formatObj[key]
-    // Note: getDay() returns 0 on Sunday
-    if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
-    if (result.length > 0 && value < 10) {
-      value = '0' + value
-    }
-    return value || 0
-  })
-  return time_str
-}
-
-// 表单重置
-export function resetForm(refName) {
-  if (this.$refs[refName]) {
-    this.$refs[refName].resetFields();
-  }
-}
-
-// 添加日期范围
-export function addDateRange(params, dateRange, propName) {
-  let search = params;
-  search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
-  dateRange = Array.isArray(dateRange) ? dateRange : [];
-  if (typeof (propName) === 'undefined') {
-    search.params['beginTime'] = dateRange[0];
-    search.params['endTime'] = dateRange[1];
-  } else {
-    search.params['begin' + propName] = dateRange[0];
-    search.params['end' + propName] = dateRange[1];
-  }
-  return search;
-}
-
-// 回显数据字典 
-export function selectDictLabel(datas, value) {
-  if (value === undefined) {
-    return "";
-  }
-  var actions = [];
-  Object.keys(datas).some((key) => {
-    if (datas[key].value == ('' + value)) {
-      actions.push(datas[key].label);
-      return true;
-    }
-  })
-  if (actions.length === 0) {
-    actions.push(value);
-  }
-  return actions.join('');
-}
-
-// 回显数据字典（字符串数组）
-export function selectDictLabels(datas, value, separator) {
-  if (value === undefined) {
-    return "";
-  }
-  var actions = [];
-  var currentSeparator = undefined === separator ? "," : separator;
-  var temp = value.split(currentSeparator);
-  Object.keys(value.split(currentSeparator)).some((val) => {
-    var match = false;
-    Object.keys(datas).some((key) => {
-      if (datas[key].value == ('' + temp[val])) {
-        actions.push(datas[key].label + currentSeparator);
-        match = true;
-      }
-    })
-    if (!match) {
-      actions.push(temp[val] + currentSeparator);
-    }
-  })
-  return actions.join('').substring(0, actions.join('').length - 1);
-}
-
-// 字符串格式化(%s )
-export function sprintf(str) {
-  var args = arguments, flag = true, i = 1;
-  str = str.replace(/%s/g, function () {
-    var arg = args[i++];
-    if (typeof arg === 'undefined') {
-      flag = false;
-      return '';
-    }
-    return arg;
-  });
-  return flag ? str : '';
-}
-
-// 转换字符串，undefined,null等转化为""
-export function parseStrEmpty(str) {
-  if (!str || str == "undefined" || str == "null") {
-    return "";
-  }
-  return str;
-}
-
-// 数据合并
-export function mergeRecursive(source, target) {
-  for (var p in target) {
-    try {
-      if (target[p].constructor == Object) {
-        source[p] = mergeRecursive(source[p], target[p]);
-      } else {
-        source[p] = target[p];
-      }
-    } catch (e) {
-      source[p] = target[p];
-    }
-  }
-  return source;
-};
-
-/**
- * 构造树型结构数据
- * @param {*} data 数据源
- * @param {*} id id字段 默认 'id'
- * @param {*} parentId 父节点字段 默认 'parentId'
- * @param {*} children 孩子节点字段 默认 'children'
- */
-export function handleTree(data, id, parentId, children) {
-  let config = {
-    id: id || 'id',
-    parentId: parentId || 'parentId',
-    childrenList: children || 'children'
-  };
-
-  var childrenListMap = {};
-  var nodeIds = {};
-  var tree = [];
-
-  for (let d of data) {
-    let parentId = d[config.parentId];
-    if (childrenListMap[parentId] == null) {
-      childrenListMap[parentId] = [];
-    }
-    nodeIds[d[config.id]] = d;
-    childrenListMap[parentId].push(d);
-  }
-
-  for (let d of data) {
-    let parentId = d[config.parentId];
-    if (nodeIds[parentId] == null) {
-      tree.push(d);
-    }
-  }
-
-  for (let t of tree) {
-    adaptToChildrenList(t);
-  }
-
-  function adaptToChildrenList(o) {
-    if (childrenListMap[o[config.id]] !== null) {
-      o[config.childrenList] = childrenListMap[o[config.id]];
-    }
-    if (o[config.childrenList]) {
-      for (let c of o[config.childrenList]) {
-        adaptToChildrenList(c);
-      }
-    }
-  }
-  return tree;
-}
-
-/**
-* 参数处理
-* @param {*} params  参数
-*/
-export function tansParams(params) {
-  let result = ''
-  for (const propName of Object.keys(params)) {
-    const value = params[propName];
-    var part = encodeURIComponent(propName) + "=";
-    if (value !== null && typeof (value) !== "undefined") {
-      if (typeof value === 'object') {
-        for (const key of Object.keys(value)) {
-          if (value[key] !== null && typeof (value[key]) !== 'undefined') {
-            let params = propName + '[' + key + ']';
-            var subPart = encodeURIComponent(params) + "=";
-            result += subPart + encodeURIComponent(value[key]) + "&";
-          }
-        }
-      } else {
-        result += part + encodeURIComponent(value) + "&";
-      }
-    }
-  }
-  return result
-}
-
-
-// 返回项目路径
-export function getNormalPath(p) {
-  if (p.length === 0 || !p || p == 'undefined') {
-    return p
-  };
-  let res = p.replace('//', '/')
-  if (res[res.length - 1] === '/') {
-    return res.slice(0, res.length - 1)
-  }
-  return res;
-}
-
-// 验证是否为blob格式
-export async function blobValidate(data) {
-  try {
-    const text = await data.text();
-    JSON.parse(text);
-    return false;
-  } catch (error) {
-    return true;
-  }
+/**
+ * 通用js方法封装处理
+ * Copyright (c) 2019 ruoyi
+ */
+
+// 日期格式化
+export function parseTime(time, pattern) {
+    if (arguments.length === 0 || !time) {
+        return null
+    }
+    const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
+    let date
+    if (typeof time === 'object') {
+        date = time
+    } else {
+        if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
+            time = parseInt(time)
+        } else if (typeof time === 'string') {
+            time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
+        }
+        if ((typeof time === 'number') && (time.toString().length === 10)) {
+            time = time * 1000
+        }
+        date = new Date(time)
+    }
+    const formatObj = {
+        y: date.getFullYear(),
+        m: date.getMonth() + 1,
+        d: date.getDate(),
+        h: date.getHours(),
+        i: date.getMinutes(),
+        s: date.getSeconds(),
+        a: date.getDay()
+    }
+    const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
+        let value = formatObj[key]
+            // Note: getDay() returns 0 on Sunday
+        if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
+        if (result.length > 0 && value < 10) {
+            value = '0' + value
+        }
+        return value || 0
+    })
+    return time_str
+}
+
+// 表单重置
+export function resetForm(refName) {
+    if (this.$refs[refName]) {
+        this.$refs[refName].resetFields();
+    }
+}
+
+// 添加日期范围
+export function addDateRange(params, dateRange, propName) {
+    let search = params;
+    search.params = typeof(search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
+    dateRange = Array.isArray(dateRange) ? dateRange : [];
+    if (typeof(propName) === 'undefined') {
+        search.params['beginTime'] = dateRange[0];
+        search.params['endTime'] = dateRange[1];
+    } else {
+        search.params['begin' + propName] = dateRange[0];
+        search.params['end' + propName] = dateRange[1];
+    }
+    return search;
+}
+
+// 回显数据字典
+export function selectDictLabel(datas, value) {
+    if (value === undefined) {
+        return "";
+    }
+    var actions = [];
+    Object.keys(datas).some((key) => {
+        if (datas[key].value == ('' + value)) {
+            actions.push(datas[key].label);
+            return true;
+        }
+    })
+    if (actions.length === 0) {
+        actions.push(value);
+    }
+    return actions.join('');
+}
+
+// 回显数据字典（字符串数组）
+export function selectDictLabels(datas, value, separator) {
+    if (value === undefined) {
+        return "";
+    }
+    var actions = [];
+    var currentSeparator = undefined === separator ? "," : separator;
+    var temp = value.split(currentSeparator);
+    Object.keys(value.split(currentSeparator)).some((val) => {
+        var match = false;
+        Object.keys(datas).some((key) => {
+            if (datas[key].value == ('' + temp[val])) {
+                actions.push(datas[key].label + currentSeparator);
+                match = true;
+            }
+        })
+        if (!match) {
+            actions.push(temp[val] + currentSeparator);
+        }
+    })
+    return actions.join('').substring(0, actions.join('').length - 1);
+}
+
+// 字符串格式化(%s )
+export function sprintf(str) {
+    var args = arguments,
+        flag = true,
+        i = 1;
+    str = str.replace(/%s/g, function() {
+        var arg = args[i++];
+        if (typeof arg === 'undefined') {
+            flag = false;
+            return '';
+        }
+        return arg;
+    });
+    return flag ? str : '';
+}
+
+// 转换字符串，undefined,null等转化为""
+export function parseStrEmpty(str) {
+    if (!str || str == "undefined" || str == "null") {
+        return "";
+    }
+    return str;
+}
+
+// 数据合并
+export function mergeRecursive(source, target) {
+    for (var p in target) {
+        try {
+            if (target[p].constructor == Object) {
+                source[p] = mergeRecursive(source[p], target[p]);
+            } else {
+                source[p] = target[p];
+            }
+        } catch (e) {
+            source[p] = target[p];
+        }
+    }
+    return source;
+};
+
+/**
+ * 构造树型结构数据
+ * @param {*} data 数据源
+ * @param {*} id id字段 默认 'id'
+ * @param {*} parentId 父节点字段 默认 'parentId'
+ * @param {*} children 孩子节点字段 默认 'children'
+ */
+export function handleTree(data, id, parentId, children) {
+    let config = {
+        id: id || 'id',
+        parentId: parentId || 'parentId',
+        childrenList: children || 'children'
+    };
+
+    var childrenListMap = {};
+    var nodeIds = {};
+    var tree = [];
+
+    for (let d of data) {
+        let parentId = d[config.parentId];
+        if (childrenListMap[parentId] == null) {
+            childrenListMap[parentId] = [];
+        }
+        nodeIds[d[config.id]] = d;
+        childrenListMap[parentId].push(d);
+    }
+
+    for (let d of data) {
+        let parentId = d[config.parentId];
+        if (nodeIds[parentId] == null) {
+            tree.push(d);
+        }
+    }
+
+    for (let t of tree) {
+        adaptToChildrenList(t);
+    }
+
+    function adaptToChildrenList(o) {
+        if (childrenListMap[o[config.id]] !== null) {
+            o[config.childrenList] = childrenListMap[o[config.id]];
+        }
+        if (o[config.childrenList]) {
+            for (let c of o[config.childrenList]) {
+                adaptToChildrenList(c);
+            }
+        }
+    }
+    return tree;
+}
+
+/**
+ * 参数处理
+ * @param {*} params  参数
+ */
+export function tansParams(params) {
+    let result = ''
+    for (const propName of Object.keys(params)) {
+        const value = params[propName];
+        var part = encodeURIComponent(propName) + "=";
+        if (value !== null && typeof(value) !== "undefined") {
+            if (typeof value === 'object') {
+                for (const key of Object.keys(value)) {
+                    if (value[key] !== null && typeof(value[key]) !== 'undefined') {
+                        let params = propName + '[' + key + ']';
+                        var subPart = encodeURIComponent(params) + "=";
+                        result += subPart + encodeURIComponent(value[key]) + "&";
+                    }
+                }
+            } else {
+                result += part + encodeURIComponent(value) + "&";
+            }
+        }
+    }
+    return result
+}
+
+
+// 返回项目路径
+export function getNormalPath(p) {
+    if (p.length === 0 || !p || p == 'undefined') {
+        return p
+    };
+    let res = p.replace('//', '/')
+    if (res[res.length - 1] === '/') {
+        return res.slice(0, res.length - 1)
+    }
+    return res;
+}
+
+// 验证是否为blob格式
+export async function blobValidate(data) {
+    try {
+        const text = await data.text();
+        JSON.parse(text);
+        return false;
+    } catch (error) {
+        return true;
+    }
 }

src/views/detection/list/index.vue

@@ -1,12 +1,421 @@
 <template>
-  <div>1</div>
+  <div style="padding: 10px">
+    <div class="formbody">
+      <el-form
+        :inline="true"
+        v-model="queryparameters"
+        class="demo-form-inline"
+      >
+        <el-form-item label="设施台账">
+          <el-select
+            v-model="queryparameters.facilitiesId"
+            class="m-1"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in alldevices"
+              :label="item.exId"
+              :value="item.exId"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="计划状态" v-if="currentstatus == 1">
+          <el-select
+            v-model="queryparameters.status"
+            class="m-1"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in detection_status"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="道路名">
+          <el-select
+            v-model="queryparameters.taskArea"
+            class="m-2"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in alldevices"
+              :label="item.roadName"
+              :value="item.roadName"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <div style="float: right">
+          <el-form-item>
+            <el-button type="primary" @click="getList">查询</el-button>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="success" @click="adddetection">新增</el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+
+      <div>
+        <el-table
+          :data="tableData"
+          class="eltable"
+          style="width: 100%"
+          @row-click="tblrowclick"
+        >
+          <el-table-column label="设备台账">
+            <template #default="scope">
+              {{
+                alldevices.filter((i) => i.id === scope.row.facilitiesId)[0]
+                  ?.exId ?? "-"
+              }}
+            </template>
+          </el-table-column>
+
+          <el-table-column prop="taskCode" label="设施道路">
+            <template #default="scope">
+              {{
+                alldevices.filter((i) => i.id === scope.row.facilitiesId)[0]
+                  ?.roadName ?? "-"
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="detectionYear" label="年计划" width="180" />
+          <el-table-column prop="detectionMonth" label="月计划" width="180" />
+          <el-table-column label="运维设施长度" width="180">
+            <template #default="scope">
+              {{
+                alldevices.filter((i) => i.id === scope.row.facilitiesId)[0]
+                  ?.fLength ?? ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="计划状态" width="180">
+            <template #default="scope">
+              {{
+                detection_status.filter(
+                  (i) => i.value === scope.row.status + ""
+                )[0]?.label ?? "-"
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="检测类型">
+            <template #default="scope">
+              {{
+                detection_type.filter(
+                  (i) => i.value === scope.row.status + ""
+                )[0]?.label ?? "-"
+              }}
+            </template>
+          </el-table-column>
+
+          <el-table-column prop="ext1" label="责任人" width="180">
+            <template #default="scope">
+              {{ scope.row.ext1 === "" ? "未派发" : scope.row.ext1 }}
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="position: relative; padding-right: 20px; margin-top: -20px">
+          <Pagination
+            :total="pagedata.total ?? 0"
+            v-show="pagedata.total > 0"
+            v-model:page="queryparameters.pageNum"
+            v-model:limit="queryparameters.pageSize"
+            @pagination="getList"
+          ></Pagination>
+          <!-- <el-pagination
+          style="float: right"
+          small
+          background
+          :page-sizes="[10, 20, 30, 50]"
+
+          :page-size="10"
+          layout=" sizes,prev, pager, next"
+          :total="pagedata.total??0"
+          class="mt-4"
+        /> -->
+        </div>
+      </div>
+    </div>
+
+    <el-dialog
+      v-model="showadd"
+      v-loading="loading"
+      title="新增检测计划"
+      width="70%"
+      draggable
+    >
+      <div>
+        <el-form :model="detectioninfo">
+          <el-row>
+            <el-col :span="12">
+              <el-form-item label="关联设施" label-width="150px">
+                <el-select
+                  v-model="detectioninfo.facilitiesId"
+                  filterable
+                  placeholder="请选择"
+                >
+                  <el-option
+                    v-for="item in alldevices"
+                    :label="item.name"
+                    :value="item.id"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="12">
+              <el-form-item label="检测类型" label-width="150px">
+                <el-select
+                  v-model="detectioninfo.detectionType"
+                  filterable
+                  placeholder="请选择类型"
+                >
+                  <el-option
+                    v-for="item in detection_type"
+                    :label="item.label"
+                    :value="item.value"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
+            </el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="8">
+              <el-form-item label="计划年" label-width="150px">
+                <el-select
+                  v-model="detectioninfo.detectionYear"
+                  filterable
+                  placeholder="请选择计划年"
+                >
+                  <el-option
+                    v-for="item in getyears()"
+                    :label="item"
+                    :value="item"
+                  ></el-option>
+                </el-select> </el-form-item
+            ></el-col>
+            <el-col :span="8">
+              <el-form-item label="计划月" label-width="150px">
+                <el-select
+                  v-model="detectioninfo.detectionMonth"
+                  filterable
+                  placeholder="请选择计划月"
+                >
+                  <el-option
+                    v-for="item in getmonth()"
+                    :label="item"
+                    :value="item"
+                  ></el-option> </el-select></el-form-item
+            ></el-col>
+            <el-col :span="8">
+              <el-form-item label="计划周" label-width="150px">
+                <el-input
+                  v-model="detectioninfo.detectionWeek"
+                  placeholder="请输入周"
+                ></el-input> </el-form-item
+            ></el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="12"
+              ><el-form-item label="计划作业组" label-width="150px">
+                <el-tree-select
+                  v-model="detectioninfo.detectionDept"
+                  multiple
+                  :data="treedept"
+                  check-strictly="true"
+                /> </el-form-item
+            ></el-col>
+            <el-col :span="12"
+              ><el-form-item label="计划备注" label-width="150px">
+                <el-input
+                  v-model="detectioninfo.detectionDes"
+                  type="textarea"
+                  placeholder="请输入"
+                ></el-input> </el-form-item
+            ></el-col>
+          </el-row>
+
+          <el-row>
+            <el-col :span="24"
+              ><el-form-item label="备注" label-width="150px">
+                <el-input
+                  v-model="detectioninfo.detectionRemark"
+                  type="textarea"
+                  placeholder="请输入"
+                ></el-input> </el-form-item
+            ></el-col>
+          </el-row>
+        </el-form>
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="showadd = false">取消</el-button>
+          <el-button type="primary" @click="onadd">保存</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
-<script lang="ts">
-import { defineComponent } from 'vue'
 
-export default defineComponent({
-  setup() {
+<script setup>
+import { defineComponent, ref, reactive, onMounted, computed } from "vue";
+import { useDict } from "@/utils/dict";
+import router from "../../../router";
+// 分页组件
+import Pagination from "@/components/Pagination";
+
+import { listFacilities } from "@/api/system/facilities";
+
+import { listDetection,addDetection } from "@/api/system/detection";
+import { listDept, getDept } from "@/api/system/dept";
+import { treeselect as deptTreeselect } from "@/api/system/dept";
+import { cloneDeep } from "lodash";
+
+import { useRoute } from "vue-router";
+
+const { detection_status, detection_type } = useDict(
+  "detection_status",
+  "detection_type"
+);
+
+const queryparameters = ref({
+  status: "",
+  facilitiesId: "",
+  pageNum: 1,
+  pageSize: 10,
+});
 
-  },
-})
+const { proxy } = getCurrentInstance();
+const showadd = ref(false);
+const loading = ref(false);
+const tableData = ref([]);
+const pagedata = ref({});
+const route = useRoute();
+const currentstatus = computed(() => route.params.status);
+
+const alldevices = ref([]);
+
+listFacilities().then((res) => {
+  alldevices.value = res.rows;
+});
+
+const detectioninfo = ref({});
+const maintaininfo = ref();
+const initadd = () => {
+  detectioninfo.value = {
+    detectionDept: "",
+    detectionDes: "",
+    detectionLogs: null,
+    detectionMonth: "",
+    detectionRemark: "",
+    detectionType: null,
+    detectionWeek: "",
+    detectionYear: "",
+    ext1: "",
+    ext2: "",
+    facilitiesId: 1,
+    remark: null,
+    status: 1,
+  };
+};
+initadd();
+
+const adddetection = () => {
+  initadd();
+  showadd.value = true;
+};
+
+const tblrowclick = (row) => {
+  // console.log(row)
+  router.push(`/detection/detail/${row.id}`);
+};
+
+const onadd = () => {
+
+  loading.value = true;
+ var detectioninfoobj = cloneDeep(detectioninfo.value);
+  // delete detectioninfoobj.detectionDept;
+  detectioninfoobj.detectionDept = (detectioninfo.value.detectionDept instanceof Array) ? detectioninfo.value.detectionDept.join(","):'';
+  addDetection(detectioninfoobj).then(res => {
+    loading.value = false;
+    showadd.value = false;
+    getList();
+  })
+
+};
+
+const getList = () => {
+  if (currentstatus.value != 1) {
+    if (currentstatus.value == 2) {
+      queryparameters.value.status = 1;
+    } else {
+      queryparameters.value.status = currentstatus.value;
+    }
+  } else {
+    queryparameters.value.status = "";
+  }
+  listDetection(queryparameters.value).then((response) => {
+    tableData.value = response.rows;
+    pagedata.value = response;
+  });
+};
+getList();
+
+const getyears = () => {
+  var years = [];
+  for (var i = 0; i <= 100; i++) {
+    years.push((2019 + i).toString());
+  }
+  return years;
+};
+const getmonth = () => {
+  var months = [];
+  for (var i = 0; i < 12; i++) {
+    if (i < 9) {
+      months.push("0" + (1 + i).toString());
+    } else {
+      months.push((1 + i).toString());
+    }
+  }
+  return months;
+};
+
+onMounted(() => {});
+function setdatakey(dept) {
+  if (dept.children) {
+    dept.children = dept.children.map((i) => {
+      return setdatakey(i);
+    });
+  }
+  dept["value"] = dept.id;
+  return dept;
+}
+const treedept = ref([]);
+deptTreeselect().then((res) => {
+  treedept.value = [setdatakey(res.data[0])];
+});
 </script>
+
+<style lang="scss" scoped>
+.formbody {
+  background: #fff;
+  width: 100%;
+  border-radius: 5px;
+  min-height: 80vh;
+  padding: 15px 10px;
+  .eltable {
+    border: 1px solid #e5e9f2;
+    border-radius: 5px;
+  }
+}
+</style>
+
+<style>
+.el-table__row:hover {
+  cursor: pointer;
+}
+.el-select {
+  width: 100%;
+}
+</style>

src/views/maintain/list/index.vue

@@ -1,12 +1,363 @@
 <template>
-  <div>4</div>
+  <div style="padding: 10px">
+    <div class="formbody">
+      <el-form
+        :inline="true"
+        v-model="queryparameters"
+        class="demo-form-inline"
+      >
+        <el-form-item label="设施名称">
+          <el-select
+            v-model="queryparameters.facilitiesId"
+            class="m-1"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in alldevices"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="计划状态" v-if="currentstatus == 1">
+          <el-select
+            v-model="queryparameters.status"
+            class="m-1"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in maintain_status"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="计划类型">
+          <el-select
+            v-model="queryparameters.maintainType"
+            class="m-2"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in maintain_type"
+              :label="item.label"
+              :value="item.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <div style="float: right">
+          <el-form-item>
+            <el-button type="primary" @click="getList">查询</el-button>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="success" @click="addmaintain">新增</el-button>
+          </el-form-item>
+        </div>
+      </el-form>
+
+      <div>
+        <el-table
+          :data="tableData"
+          class="eltable"
+          style="width: 100%"
+          @row-click="tblrowclick"
+        >
+          <el-table-column prop="taskCode" label="设施道路">
+            <template #default="scope">
+              {{
+                alldevices.filter((i) => i.id === scope.row.facilitiesId)[0]
+                  ?.roadName ?? "-"
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="maintainYear" label="年计划" width="180" />
+          <el-table-column prop="maintainMonth" label="月计划" width="180" />
+          <el-table-column label="运维设施长度" width="180">
+            <template #default="scope">
+              {{
+                alldevices.filter((i) => i.id === scope.row.facilitiesId)[0]
+                  ?.fLength ?? ""
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="计划状态" width="180">
+            <template #default="scope">
+              {{
+                maintain_status.filter(
+                  (i) => i.value === scope.row.status + ""
+                )[0]?.label ?? "-"
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column label="养护类型">
+            <template #default="scope">
+              {{
+                maintain_type.filter(
+                  (i) => i.value === scope.row.status + ""
+                )[0]?.label ?? "-"
+              }}
+            </template>
+          </el-table-column>
+          <el-table-column prop="maintainUnit" label="养护单位" />
+          <el-table-column prop="ext1" label="责任人" width="180">
+            <template #default="scope">
+              {{ (scope.row.ext1 == null || scope.row.ext1 === "")? "暂无" : scope.row.ext1 }}
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="position: relative; padding-right: 20px; margin-top: -20px">
+          <Pagination
+            :total="pagedata.total ?? 0"
+            v-show="pagedata.total > 0"
+            v-model:page="queryparameters.pageNum"
+            v-model:limit="queryparameters.pageSize"
+            @pagination="getList"
+          ></Pagination>
+        </div>
+      </div>
+    </div>
+
+    <el-dialog
+      v-model="showadd"
+      v-loading="loading"
+      title="新增养护计划"
+      width="70%"
+      draggable
+    >
+      <div>
+        <el-form :model="maintaininfo">
+          <el-row>
+            <el-col :span="12"
+              ><el-form-item label="关联设施" label-width="150px">
+                <el-select
+                  v-model="maintaininfo.facilitiesId"
+                  filterable
+                  placeholder="请选择设备"
+                >
+                  <el-option
+                    v-for="item in alldevices"
+                    :label="item.name"
+                    :value="item.id"
+                  ></el-option>
+                </el-select> </el-form-item
+            ></el-col>
+            <el-col :span="12">
+              <el-form-item label="养护类型" label-width="150px">
+                  <el-select
+                  v-model="maintaininfo.maintainType"
+                  filterable
+                  placeholder="请选择类型"
+                >
+                  <el-option
+                    v-for="item in maintain_type"
+                    :label="item.label"
+                    :value="item.value"
+                  ></el-option>
+                </el-select>
+                </el-form-item
+            ></el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12"><el-form-item label="养护单位" label-width="150px">
+               <el-input
+                        v-model="maintaininfo.maintainUnit"
+                        placeholder="请输入"
+                      ></el-input></el-form-item></el-col>
+             <el-col :span="12"><el-form-item label="养护数量" label-width="150px">
+               <el-input
+                        v-model="maintaininfo.maintainCount"
+                        placeholder="请输入"
+                      ></el-input></el-form-item></el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12"> <el-form-item label="计划年" label-width="150px">
+                <el-select
+                  v-model="maintaininfo.maintainYear"
+                  filterable
+                  placeholder="请选择类型"
+                >
+                  <el-option
+                    v-for="item in getyears()"
+                    :label="item"
+                    :value="item"
+                  ></el-option>
+                </el-select></el-form-item></el-col>
+             <el-col :span="12"> <el-form-item label="计划月" label-width="150px">
+               <el-select
+                  v-model="maintaininfo.maintainMonth"
+                  filterable
+                  placeholder="请选择类型"
+                >
+                  <el-option
+                    v-for="item in getmonth()"
+                    :label="item"
+                    :value="item"
+                  ></el-option>
+                </el-select></el-form-item></el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="12"> <el-form-item label="计划备注" label-width="150px">
+               <el-input
+                        v-model="maintaininfo.maintainDes"
+                        type="textarea"
+                        placeholder="请输入"
+                      ></el-input></el-form-item></el-col>
+             <el-col :span="12"> <el-form-item label="备注" label-width="150px">
+              <el-input
+                        v-model="maintaininfo.maintainRemark"
+                        type="textarea"
+                        placeholder="请输入"
+                      ></el-input></el-form-item></el-col>
+          </el-row>
+        </el-form>
+      </div>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="showadd = false">取消</el-button>
+          <el-button type="primary" @click="onadd">保存</el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </div>
 </template>
-<script lang="ts">
-import { defineComponent } from 'vue'
 
-export default defineComponent({
-  setup() {
+<script setup>
+import { defineComponent, ref, reactive, onMounted, computed } from "vue";
+import { useDict } from "@/utils/dict";
+import router from "../../../router";
+// 分页组件
+import Pagination from "@/components/Pagination";
+
+import { listFacilities } from "@/api/system/facilities";
+
+import { listMaintain ,addMaintain} from "@/api/system/maintain";
+
+import { cloneDeep } from "lodash";
+
+import { useRoute } from "vue-router";
+
+const { maintain_status, maintain_type } = useDict(
+  "maintain_status",
+  "maintain_type"
+);
+
+const queryparameters = ref({
+  status: "",
+  maintainType:"",
+  facilitiesId: "",
+  pageNum: 1,
+  pageSize: 10,
+});
+
+const { proxy } = getCurrentInstance();
+const showadd = ref(false);
+const loading = ref(false);
+const tableData = ref([]);
+const pagedata = ref({});
+const route = useRoute();
+const currentstatus = computed(() => route.params.status);
+
+const alldevices = ref([]);
 
-  },
-})
+listFacilities().then((res) => {
+  alldevices.value = res.rows;
+});
+
+const maintaininfo = ref();
+const initadd = () => {
+  maintaininfo.value = {
+    facilitiesId: 1,
+    maintainCount: 0,
+    maintainDes: "",
+    maintainMonth: "",
+    maintainRemark: "",
+    maintainType: "",
+    maintainUnit: "",
+    maintainYear: "",
+    status: 1,
+  };
+}
+initadd();
+
+const addmaintain = () => {
+  initadd();
+  showadd.value = true;
+};
+const getyears = () => {
+  var years = [];
+  for (var i = 0; i <= 100; i++) {
+    years.push((2019 + i).toString());
+  }
+  return years;
+}
+const getmonth = () => {
+  var months = [];
+  for (var i = 0; i < 12; i++) {
+    if (i < 9) {
+       months.push("0"+(1 + i).toString());
+
+    } else {
+       months.push((1 + i).toString());
+    }
+  }
+  return months;
+}
+
+const tblrowclick = (row) => {
+  // console.log(row)
+  router.push(`/maintain/detail/${row.id}`);
+};
+
+const onadd = () => {
+  // Element.loading();
+  loading.value = true;
+  addMaintain(maintaininfo.value).then(res => {
+    loading.value = false;
+    showadd.value = false;
+    getList();
+  })
+};
+
+const getList = () => {
+  if (currentstatus.value != 1) {
+    if (currentstatus.value == 2) {
+      queryparameters.value.status = 1;
+    } else {
+      queryparameters.value.status = currentstatus.value;
+    }
+  } else {
+    queryparameters.value.status = "";
+  }
+  listMaintain(queryparameters.value).then((response) => {
+    tableData.value = response.rows;
+    pagedata.value = response;
+  });
+};
+getList();
+
+onMounted(() => {});
 </script>
+
+<style lang="scss" scoped>
+.formbody {
+  background: #fff;
+  width: 100%;
+  border-radius: 5px;
+  min-height: 80vh;
+  padding: 15px 10px;
+  .eltable {
+    border: 1px solid #e5e9f2;
+    border-radius: 5px;
+  }
+}
+
+.el-select {
+  width: 100%;
+}
+</style>
+
+<style>
+.el-table__row:hover {
+  cursor: pointer;
+}
+</style>