'保安项目提交'

src/views/backOfficeSystem/basicsmanage/watchman-zb/watchman-zbtx/index.vue

@@ -0,0 +1,209 @@
+<template>
+  <div>
+    <div class="titleBox">
+      <div class="title">巡防装备到期提醒</div>
+    </div>
+    <div class="searchBox" ref="searchBox">
+      <el-form :model="listQuery" :inline="true">
+        <el-form-item label="所属部门">
+          <MOSTY.Department
+            width="100%"
+            clearable
+            v-model="listQuery.ssbmdm"
+          />
+        </el-form-item>
+        <el-form-item label="装备类型">
+          <el-select v-model="zbLx" @change="checkZblx">
+            <el-option value="1" label="智能装备"></el-option>
+            <el-option value="2" label="常用装备"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button @click="handleFilter"> 查询 </el-button>
+          <el-button @click="reset()"> 重置 </el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="tabBox">
+      <el-table
+        :data="tableData"
+        border
+        row-key="id"
+        :tree-props="{ children: 'itemList', hasChildren: true }"
+        style="width: 100%"
+        :height="tableHeight"
+        :key="keyCount"
+        v-loading="loadingTable"
+        element-loading-background="rgba(0,0,0,0.3)"
+        element-loading-text="数据加载中。。"
+      >
+        <el-table-column
+          type="index"
+          show-overflow-tooltip
+          align="center"
+          width="60px"
+          label="序号"
+        >
+        </el-table-column>
+        <el-table-column
+          sortable
+          prop="ssbm"
+          show-overflow-tooltip
+          align="center"
+          label="所属部门"
+        >
+        </el-table-column>
+        <el-table-column
+          sortable
+          prop="sbmc"
+          show-overflow-tooltip
+          align="center"
+          label="装备名称"
+        >
+          <template #default="{ row }">
+            <div>
+              {{ row.sbmc || row.qxMc }}
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column
+          sortable
+          prop="cgrq"
+          show-overflow-tooltip
+          align="center"
+          label="生产日期"
+        >
+        </el-table-column>
+        <el-table-column
+          sortable
+          prop="dqsj"
+          show-overflow-tooltip
+          align="center"
+          label="到期时间"
+        >
+        </el-table-column>
+      </el-table>
+      <div class="fenye" :style="{ top: tableHeight + 'px' }">
+        <el-pagination
+          class="pagination"
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="listQuery.pageCurrent"
+          :page-sizes="[10, 20, 50, 100]"
+          :page-size="listQuery.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total"
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { getZnzbTx, getJyqxTx } from "@/api/basicsmanage/watchmanZbtx.js";
+import * as MOSTY from "@/components/MyComponents/index";
+import { ref, reactive, onMounted, onUnmounted, getCurrentInstance } from "vue";
+const { proxy } = getCurrentInstance();
+const listQuery = ref({
+  pageCurrent: 1,
+  pageSize: 20
+});
+onMounted(() => {
+  getListData();
+  tabHeightFn();
+  window.onresize = function () {
+    tabHeightFn();
+  };
+  proxy.mittBus.on("mittFn", (data) => {
+    keyCount.value = data;
+  });
+});
+onUnmounted(() => {
+  proxy.mittBus.off("mittFn");
+});
+const searchBox = ref(null); // 搜索盒子
+const keyCount = ref(0); //tabel组件刷新值
+const tableHeight = ref(); // 表格高度
+const loadingTable = ref(true);
+const tableData = ref([]); //表单数据
+
+const zbLx = ref("1");
+const total = ref(0); //总数据
+const dialogFormVisible = ref(false);
+const handleFilter = () => {
+  listQuery.value.pageCurrent = 1;
+  getListData();
+};
+
+//获取数据
+const getListData = () => {
+  loadingTable.value = true;
+  if (zbLx.value == 1) {
+    let prams = {
+      pageCurrent: listQuery.value.pageCurrent,
+      pageSize: listQuery.value.pageSize,
+      ssbmid: listQuery.value.ssbmdm || "",
+      sbmc: listQuery.value.sbmc || ""
+    };
+    getZnzbTx(prams).then((res) => {
+      tableData.value = res.records;
+      total.value = res.total;
+      loadingTable.value = false;
+    });
+  } else {
+    let prams = {
+      pageCurrent: listQuery.value.pageCurrent,
+      pageSize: listQuery.value.pageSize,
+      ssbmid: listQuery.value.ssbmdm || "",
+      qxMc: listQuery.value.sbmc || ""
+    };
+    getJyqxTx(prams).then((res) => {
+      tableData.value = res.records;
+      total.value = res.total;
+      loadingTable.value = false;
+    }).catch(()=>{
+      loadingTable.value = false;
+    });
+  }
+};
+function checkZblx() {
+  getListData();
+}
+const reset = () => {
+  listQuery.value = {
+    pageCurrent: 1,
+    pageSize: 20
+  };
+  getListData();
+};
+const addDict = (row) => {
+  isEdit.value = false;
+  dialogForm.value = {};
+  dialogFormVisible.value = true;
+};
+// 表格高度计算
+const tabHeightFn = () => {
+ tableHeight.value = window.innerHeight - searchBox.value.offsetHeight - 240;
+};
+/**
+ * size 改变触发
+ */
+const handleSizeChange = (currentSize) => {
+  listQuery.value.pageSize = currentSize;
+  getListData();
+};
+
+/**
+ * 页码改变触发
+ */
+const handleCurrentChange = (currentPage) => {
+  listQuery.value.pageCurrent = currentPage;
+  getListData();
+};
+</script>
+
+<style lang="scss" scoped>
+@import "~@/assets/css/layout.scss";
+@import "~@/assets/css/element-plus.scss";
+</style>