From b6e1778e9948eaa78e9226ceac9faf66393886d5 Mon Sep 17 00:00:00 2001
From: 2153917462 <2153917462@qq.com>
Date: Sat, 24 May 2025 16:00:58 +0800
Subject: [PATCH] =?UTF-8?q?web=E8=B5=84=E4=BA=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/aaa/a1/index.vue                    |   3 -
 src/views/aaa/webZC/components/webZC-info.vue |   0
 src/views/aaa/webZC/index.vue                 | 604 ++++++++++++++++++
 3 files changed, 604 insertions(+), 3 deletions(-)
 delete mode 100644 src/views/aaa/a1/index.vue
 create mode 100644 src/views/aaa/webZC/components/webZC-info.vue
 create mode 100644 src/views/aaa/webZC/index.vue

diff --git a/src/views/aaa/a1/index.vue b/src/views/aaa/a1/index.vue
deleted file mode 100644
index e1a03f0..0000000
--- a/src/views/aaa/a1/index.vue
+++ /dev/null
@@ -1,3 +0,0 @@
-<template>
-    <div>123</div>
-</template>
\ No newline at end of file
diff --git a/src/views/aaa/webZC/components/webZC-info.vue b/src/views/aaa/webZC/components/webZC-info.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/aaa/webZC/index.vue b/src/views/aaa/webZC/index.vue
new file mode 100644
index 0000000..80ef7a8
--- /dev/null
+++ b/src/views/aaa/webZC/index.vue
@@ -0,0 +1,604 @@
+<!--assetsManage/assets-->
+<template>
+  <el-row
+    :gutter="20"
+    style="height: 100%; background-color: #f2f4f6; display: flex"
+  >
+    <!--部门数据-->
+    <el-col
+      :span="3"
+      :xs="24"
+      style="
+        margin-right: 10px;
+        height: 100%;
+        background-color: #fff;
+        padding-top: 20px;
+      "
+    >
+      <div class="head-container">
+        <el-tree
+          :data="deptOptions"
+          :props="defaultProps"
+          :expand-on-click-node="false"
+          :filter-node-method="filterNode"
+          ref="tree"
+          node-key="id"
+          default-expand-all
+          highlight-current
+          @node-click="handleNodeClick"
+        />
+      </div>
+    </el-col>
+    <el-col :span="20" :xs="24" style="height: 100%; flex: 1">
+      <div class="L-main" id="L-size-main">
+        <div class="content-search" id="L-header">
+          <div class="search-title">查询条件</div>
+          <el-form
+            :inline="true"
+            ref="queryForm"
+            :model="formInline"
+            size="small"
+            class="demo-form-inline"
+          >
+            <el-row>
+              <el-col :span="7">
+                <el-form-item label="系统名称：" prop="xtmc">
+                  <el-input
+                    v-model="formInline.xtmc"
+                    placeholder="请输入系统名称"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="7">
+                <el-form-item label="系统类型：" prop="xtlx">
+                  <el-select
+                    v-model="formInline.xtlx"
+                    placeholder="请选择系统类型"
+                  >
+                    <el-option
+                      v-for="dict in zc_xtlx"
+                      :key="dict.value"
+                      :label="dict.label"
+                      :value="dict.value"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="7">
+                <el-form-item label="新增时间：" prop="time">
+                  <el-date-picker
+                    v-model="formInline.time"
+                    format="yyyy-MM-dd HH:mm:ss"
+                    value-format="yyyy-MM-dd HH:mm:ss"
+                    type="datetimerange"
+                    start-placeholder="开始时间"
+                    end-placeholder="结束时间"
+                    placeholder="请选择"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row>
+              <el-col :span="7">
+                <el-form-item label="单位名称：" prop="dwmc">
+                  <el-input
+                    v-model="formInline.dwmc"
+                    placeholder="请输入单位名称"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="7">
+                <el-form-item label="系统状态：" prop="xtzt">
+                  <el-select
+                    v-model="formInline.xtzt"
+                    placeholder="请选择系统状态"
+                  >
+                    <el-option
+                      v-for="dict in zc_xtzt"
+                      :key="dict.value"
+                      :label="dict.label"
+                      :value="dict.value"
+                    >
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="9" style="text-align: right; padding-right: 35px">
+                <el-form-item>
+                  <el-button size="mini" @click="resetQuery">重置</el-button>
+                  <el-button size="mini" type="primary" @click="handleQuery"
+                    >查询</el-button
+                  >
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+        <main>
+          <div class="search-title">
+            <span class="search-title-span">资产列表</span>
+            <el-row :gutter="10" class="mb8">
+              <el-col :span="1.5">
+                <el-button
+                  type="info"
+                  plain
+                  icon="Upload"
+                  size="mini"
+                  @click="handleImport"
+                  >导入</el-button
+                >
+              </el-col>
+              <el-col :span="1.5">
+                <el-button
+                  type="warning"
+                  plain
+                  icon="Download"
+                  size="mini"
+                  @click="handleExport"
+                  >导出</el-button
+                >
+              </el-col>
+              <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  plain
+                  icon="Plus"
+                  size="mini"
+                  @click="handleAdd"
+                  >新增资产</el-button
+                >
+              </el-col>
+            </el-row>
+          </div>
+          <section>
+            <el-table
+              v-loading="loading"
+              :data="tableData"
+              :height="tabHeader"
+              :row-class-name="tableRowClassName"
+              :max-height="tabHeader"
+            >
+              <el-table-column
+                type="index"
+                width="60"
+                label="序号"
+                align="center"
+              />
+              <el-table-column
+                label="系统名称"
+                key="xtmc"
+                width="200px"
+                prop="xtmc"
+                align="center"
+              />
+              <el-table-column
+                label="系统类型"
+                key="xtlx"
+                prop="xtlx"
+                align="center"
+              >
+                <template #default="scope">
+                  <dict-tag :options="zc_xtlx" :value="scope.row.xtlx" />
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="单位名称"
+                key="dwmc"
+                prop="dwmc"
+                align="center"
+              />
+              <el-table-column
+                label="新增时间"
+                key="createTime"
+                prop="createTime"
+                align="center"
+              />
+              <el-table-column
+                label="系统状态"
+                key="status"
+                prop="status"
+                class-name="table-status"
+                align="center"
+              >
+                <template #default="scope">
+                  <span v-if="scope.row.xtzt == 1" style="color: #16b771"
+                    >已安装</span
+                  >
+                  <span v-if="scope.row.xtzt == 2" style="color: #f58a0c"
+                    >测试中</span
+                  >
+                  <span v-if="scope.row.xtzt == 3" style="color: #1485ef"
+                    >使用中</span
+                  >
+                  <span v-if="scope.row.xtzt == 4" style="color: #29a07a"
+                    >维护中</span
+                  >
+                  <span v-if="scope.row.xtzt == 5" style="color: #f50c0c"
+                    >关停</span
+                  >
+                  <span v-if="scope.row.xtzt == 6" style="color: #f50c0c"
+                    >备用</span
+                  >
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="操作"
+                prop="userId"
+                class-name="table-operation"
+                align="center"
+              >
+                <template #default="scope">
+                  <div
+                    style="
+                      display: flex;
+                      align-items: center;
+                      justify-content: center;
+                    "
+                  >
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        cursor: pointer;
+                      "
+                      @click="goInfo(scope.row, 1)"
+                    >
+                      <el-icon><View /></el-icon>
+                      <span
+                        class="look-info"
+                        style="color: #1485ef; margin-right: 15px"
+                        >查看</span
+                      >
+                    </div>
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        cursor: pointer;
+                      "
+                      @click="goInfo(scope.row, 2)"
+                    >
+                      <el-icon><Edit /></el-icon>
+                      <span
+                        class="look-info"
+                        style="color: #1485ef; margin-right: 15px"
+                        >编辑</span
+                      >
+                    </div>
+                    <div
+                      style="
+                        display: flex;
+                        align-items: center;
+                        cursor: pointer;
+                      "
+                      @click="goInfo(scope.row, 3)"
+                    >
+                      <el-icon><Delete /></el-icon>
+                      <span
+                        class="look-info"
+                        style="color: #f50c0c; margin-right: 15px"
+                        >删除</span
+                      >
+                    </div>
+                  </div>
+                </template>
+              </el-table-column>
+            </el-table>
+          </section>
+          <my-pagination
+            id="L-pagination"
+            :total="total"
+            :page="formInline.current"
+            :limit="formInline.size"
+            @pagination="getPagination"
+            v-model:current-page="formInline.current"
+          />
+        </main>
+        <!-- 资产导入对话框 -->
+        <el-dialog
+          v-model="upload.open"
+          :title="upload.title"
+          width="400px"
+          append-to-body
+        >
+          <el-upload
+            ref="upload"
+            :limit="1"
+            accept=".xlsx, .xls"
+            :headers="upload.headers"
+            :action="upload.url + '?updateSupport=' + upload.updateSupport"
+            :disabled="upload.isUploading"
+            :on-progress="handleFileUploadProgress"
+            :on-success="handleFileSuccess"
+            :auto-upload="false"
+            drag
+          >
+            <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+            <div class="el-upload__text">
+              将文件拖到此处，或<em>点击上传</em>
+            </div>
+            <template #tip>
+              <div class="el-upload__tip">
+                <span>仅允许导入xls、xlsx格式文件。</span>
+                <el-link
+                  type="primary"
+                  :underline="false"
+                  style="font-size: 12px; vertical-align: baseline"
+                  @click="importTemplate"
+                  >下载模板</el-link
+                >
+              </div>
+            </template>
+          </el-upload>
+          <template #footer>
+            <div class="dialog-footer">
+              <el-button type="primary" @click="submitFileForm"
+                >确 定</el-button
+              >
+              <el-button @click="upload.open = false">取 消</el-button>
+            </div>
+          </template>
+        </el-dialog>
+      </div>
+    </el-col>
+  </el-row>
+</template>
+<script setup>
+import { ref, reactive, onMounted, onUnmounted, getCurrentInstance } from "vue";
+import { useRouter } from "vue-router";
+import myPagination from "@/views/components/Pagination/index.vue";
+import { getToken } from "@/utils/auth";
+import { assetUnit, deleteAssetInfo, schema } from "@/api/auditPagesApi/index";
+import { useDict } from "@/utils/dict";
+import { ElMessage, ElMessageBox } from "element-plus";
+import {
+  View,
+  Edit,
+  Delete,
+  Upload,
+  Download,
+  Plus,
+  UploadFilled,
+} from "@element-plus/icons-vue";
+
+const { proxy } = getCurrentInstance();
+const router = useRouter();
+
+// 字典数据
+const { zc_xtzt, zc_xtlx } = useDict("zc_xtzt", "zc_xtlx");
+
+// 部门树选项
+const deptOptions = ref();
+const tree = ref(null);
+
+const defaultProps = {
+  children: "children",
+  label: "label",
+};
+
+const formInline = reactive({
+  xtmc: "",
+  xtlx: "",
+  time: [],
+  startTime: "",
+  endTime: "",
+  dwmc: "",
+  xtzt: "",
+  current: 1,
+  size: 20,
+});
+
+const total = ref(0);
+const tableData = ref([]);
+const loading = ref(false);
+const tabHeader = ref();
+
+// 用户导入参数
+const upload = reactive({
+  // 是否显示弹出层（用户导入）
+  open: false,
+  // 弹出层标题（用户导入）
+  title: "web资产导入",
+  // 是否禁用上传
+  isUploading: false,
+  // 是否更新已经存在的用户数据
+  updateSupport: 0,
+  // 设置上传的请求头部
+  headers: { Authorization: "Bearer " + getToken() },
+  // 上传的地址
+  url: location.origin + "/api/tc/assetCurrent/importData",
+});
+
+/** 查询部门下拉树结构 */
+const getDeptTree = () => {
+  schema({ type: 0 }).then((response) => {
+    deptOptions.value = response.data;
+  });
+};
+
+// 筛选节点
+const filterNode = (value, data) => {
+  if (!value) return true;
+  return data.label.indexOf(value) !== -1;
+};
+
+// 节点单击事件
+const handleNodeClick = (data) => {
+  formInline.deptId = data.id;
+  handleQuery();
+};
+
+// 获取列表
+const getList = () => {
+  loading.value = true;
+  assetUnit("get", formInline).then((res) => {
+    loading.value = false;
+    total.value = res.data.total;
+    tableData.value = res.data.records;
+  });
+};
+
+// 重置
+const resetQuery = () => {
+  proxy.$refs["queryForm"].resetFields();
+  formInline.deptId = undefined;
+  tree.value.setCurrentKey(null);
+  handleQuery();
+};
+
+// 查询
+const handleQuery = () => {
+  formInline.current = 1;
+  formInline.size = 20;
+  if (formInline.time) {
+    formInline.startTime = formInline.time[0];
+    formInline.endTime = formInline.time[1];
+  }
+  formInline.time = [];
+  getList();
+};
+
+// 页码获取
+const getPagination = (pages) => {
+  formInline.current = pages.page;
+  formInline.size = pages.limit;
+  getList();
+};
+
+// 导入
+const handleImport = () => {
+  upload.open = true;
+};
+
+// 导出
+const handleExport = () => {
+  proxy.download(
+    "/tc/assetCurrent/export",
+    {
+      ...formInline,
+    },
+    `web资产${new Date().getTime()}.xlsx`
+  );
+};
+
+/** 下载模板操作 */
+const importTemplate = () => {
+  proxy.download(
+    "/tc/assetCurrent/importTemplate",
+    {},
+    `web资产导入模板${new Date().getTime()}.xlsx`
+  );
+};
+
+// 文件上传中处理
+const handleFileUploadProgress = () => {
+  upload.isUploading = true;
+};
+
+// 文件上传成功处理
+const handleFileSuccess = (response, file, fileList) => {
+  upload.open = false;
+  upload.isUploading = false;
+  proxy.$refs.upload.clearFiles();
+  ElMessageBox.alert(
+    `<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>${response.msg}</div>`,
+    "导入结果",
+    { dangerouslyUseHTMLString: true }
+  );
+  getList();
+};
+
+// 提交上传文件
+const submitFileForm = () => {
+  proxy.$refs.upload.submit();
+};
+
+// 新增资产
+const handleAdd = () => {
+  router.push({
+    name: "AssetsAuth",
+    query: {
+      pageType: "add",
+      type: 0,
+    },
+  });
+};
+
+// 查看详情
+const goInfo = (row, id) => {
+  if (id === 1) {
+    router.push({
+      name: "AssetsAuth",
+      query: {
+        pageType: "look",
+        type: 0,
+        id: row.id,
+        queryData: formInline,
+      },
+      meta: {
+        title: "新增资产",
+        icon: "user",
+        activeMenu: "/assetsManage/program",
+      },
+    });
+  } else if (id === 2) {
+    router.push({
+      name: "AssetsAuth",
+      query: {
+        pageType: "change",
+        type: 0,
+        id: row.id,
+        queryData: formInline,
+      },
+    });
+  } else if (id === 3) {
+    const userIds = row.id;
+    ElMessageBox.confirm(`是否确认删除用户编号为"${userIds}"的数据项？`)
+      .then(() => {
+        return deleteAssetInfo(userIds);
+      })
+      .then(() => {
+        getList();
+        ElMessage.success("删除成功");
+      })
+      .catch(() => {});
+  }
+};
+
+// 修改table背景色
+const tableRowClassName = ({ rowIndex }) => {
+  if (rowIndex % 2 !== 0) {
+    return "evenNumber-row";
+  }
+  return "";
+};
+
+const cancalDebounce = () => {
+  const element = document.getElementById("L-size-main");
+  const header = document.getElementById("L-header");
+  const pagination = document.getElementById("L-pagination");
+  const elementHeight = element.offsetHeight;
+  const headerHeight = header.offsetHeight;
+  const paginationtHeight = pagination.offsetHeight;
+  tabHeader.value = elementHeight - headerHeight - paginationtHeight - 110;
+};
+
+onMounted(() => {
+  if (Object.keys(router.currentRoute.value.params).length !== 0) {
+    Object.assign(formInline, router.currentRoute.value.params);
+  } else {
+    formInline.current = 1;
+    formInline.size = 20;
+  }
+  getList();
+  getDeptTree();
+  cancalDebounce();
+  window.addEventListener("resize", cancalDebounce);
+});
+
+onUnmounted(() => {
+  window.removeEventListener("resize", cancalDebounce);
+});
+</script>