From 158dba5e1befa29ff2537bd729045f14690e5327 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=AE=B8=E5=AE=8F=E6=9D=B0?= <1943105267@qq.com>
Date: Mon, 24 Feb 2025 13:04:39 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AE=A1=E7=90=86=E7=AB=AF=E5=B0=8F=E7=A8=8B?=
 =?UTF-8?q?=E5=BA=8F=E8=B5=84=E4=BA=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../auditPages/assetsManagement/program.vue   | 158 ++++++++++--
 .../assetsManagement/programDialog.js         | 200 +++++++++++++++
 .../assetsManagement/programDialog.vue        | 230 ++++++++++++++++++
 3 files changed, 574 insertions(+), 14 deletions(-)
 create mode 100644 src/views/auditPages/components/assetsManagement/programDialog.js
 create mode 100644 src/views/auditPages/components/assetsManagement/programDialog.vue

diff --git a/src/views/auditPages/assetsManagement/program.vue b/src/views/auditPages/assetsManagement/program.vue
index f93a2c2..3ee46ac 100644
--- a/src/views/auditPages/assetsManagement/program.vue
+++ b/src/views/auditPages/assetsManagement/program.vue
@@ -14,15 +14,30 @@
       />
     </template>
     <template v-slot:tablec>
-      <el-button type="info" plain icon="el-icon-upload2" size="mini"
+      <el-button
+        type="info"
+        plain
+        icon="el-icon-upload2"
+        size="mini"
+        @click="handleImport"
         >导入</el-button
       >
 
-      <el-button type="warning" plain icon="el-icon-download" size="mini"
+      <el-button
+        type="warning"
+        plain
+        icon="el-icon-download"
+        size="mini"
+        @click="handleExport"
         >导出</el-button
       >
 
-      <el-button type="primary" plain icon="el-icon-plus" size="mini"
+      <el-button
+        type="primary"
+        plain
+        icon="el-icon-plus"
+        size="mini"
+        @click="handleDialog()"
         >新增资产</el-button
       >
     </template>
@@ -33,6 +48,7 @@
         size="small"
         :inline="true"
         label-width="100px"
+        class="search-form"
       >
         <el-form-item label="所属单位：" prop="dwmc">
           <el-input
@@ -102,7 +118,12 @@
           align="center"
         >
           <template slot-scope="scope">
-            <el-button type="primary" size="mini" plain icon="el-icon-view"
+            <el-button
+              type="primary"
+              size="mini"
+              plain
+              icon="el-icon-view"
+              @click="handleDialog(scope.row.id, true)"
               >查看</el-button
             >
             <el-button
@@ -110,9 +131,15 @@
               size="mini"
               plain
               icon="el-icon-edit-outline"
+              @click="handleDialog(scope.row.id)"
               >修改</el-button
             >
-            <el-button type="danger" size="mini" plain icon="el-icon-delete"
+            <el-button
+              type="danger"
+              size="mini"
+              plain
+              icon="el-icon-delete"
+              @click="handleDel(scope.row.id)"
               >删除</el-button
             >
           </template>
@@ -128,6 +155,50 @@
         :limit.sync="formInline.size"
         @pagination="getList"
       />
+
+      <!-- 新增修改查看弹窗 -->
+      <program-dialog ref="myDialog" @finish="handleQuery"></program-dialog>
+
+      <!-- 资产导入对话框 -->
+      <el-dialog
+        :title="upload.title"
+        :visible.sync="upload.open"
+        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
+        >
+          <i class="el-icon-upload"></i>
+          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
+          <div class="el-upload__tip text-center" slot="tip">
+            <!-- <div class="el-upload__tip" slot="tip">
+                <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的用户数据
+              </div> -->
+            <span>仅允许导入xls、xlsx格式文件。</span>
+            <el-link
+              type="primary"
+              :underline="false"
+              style="font-size: 12px; vertical-align: baseline"
+              @click="importTemplate"
+              >下载模板</el-link
+            >
+          </div>
+        </el-upload>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="submitFileForm">确 定</el-button>
+          <el-button @click="upload.open = false">取 消</el-button>
+        </div>
+      </el-dialog>
     </template>
   </main-app>
 </template>
@@ -139,8 +210,11 @@ import {
   deleteMiniPrograms,
   schema,
 } from "@/api/auditPagesApi/index";
+
+import programDialog from "@/views/auditPages/components/assetsManagement/programDialog.vue";
 export default {
   dicts: ["gzh_state"],
+  components: { programDialog },
   data() {
     return {
       // 部门树选项
@@ -162,6 +236,7 @@ export default {
       tableData: [],
       loading: false,
       tabHeader: 585,
+
       // 用户导入参数
       upload: {
         // 是否显示弹出层（用户导入）
@@ -185,6 +260,35 @@ export default {
     this.getDeptTree();
   },
   methods: {
+    // 导出
+    handleExport() {
+      this.download(
+        "/tc/miniPrograms/export",
+        {
+          ...this.formInline,
+        },
+        `小程序资产${new Date().getTime()}.xlsx`
+      );
+    },
+    //删除
+    handleDel(id) {
+      this.$modal
+        .confirm('是否确认删除用户编号为"' + id + '"的数据项？')
+        .then(function () {
+          return deleteMiniPrograms(id);
+        })
+        .then(() => {
+          this.getList();
+          this.$modal.msgSuccess("删除成功");
+        })
+        .catch(() => {});
+    },
+
+    // 弹窗操作
+    handleDialog(id, disabled) {
+      this.$refs.myDialog.openDialog(id, disabled);
+    },
+
     // 修改table背景色
     tableRowClassName({ row, rowIndex }) {
       if (rowIndex % 2 !== 0) {
@@ -246,16 +350,42 @@ export default {
         this.tableData = res.data.records;
       });
     },
+    // 导入
+    handleImport() {
+      this.upload.open = true;
+    },
+    /** 下载模板操作 */
+    importTemplate() {
+      this.download(
+        "/tc/miniPrograms/importTemplate",
+        {},
+        `小程序资产导入模板${new Date().getTime()}.xlsx`
+      );
+    },
+    // 文件上传中处理
+    handleFileUploadProgress(event, file, fileList) {
+      this.upload.isUploading = true;
+    },
+    // 文件上传成功处理
+    handleFileSuccess(response, file, fileList) {
+      this.upload.open = false;
+      this.upload.isUploading = false;
+      this.$refs.upload.clearFiles();
+      this.$alert(
+        "<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
+          response.msg +
+          "</div>",
+        "导入结果",
+        { dangerouslyUseHTMLString: true }
+      );
+      this.getList();
+    },
+    // 提交上传文件
+    submitFileForm() {
+      this.$refs.upload.submit();
+    },
   },
 };
 </script>
 
-<style lang="scss" scoped>
-::v-deep .el-form-item__content {
-  width: 280px;
-  .el-select,
-  .el-date-editor {
-    width: 100%;
-  }
-}
-</style>
+<style lang="scss" scoped></style>
diff --git a/src/views/auditPages/components/assetsManagement/programDialog.js b/src/views/auditPages/components/assetsManagement/programDialog.js
new file mode 100644
index 0000000..dba0da1
--- /dev/null
+++ b/src/views/auditPages/components/assetsManagement/programDialog.js
@@ -0,0 +1,200 @@
+import { unitAllList } from "@/api/auditPagesApi/index";
+
+const formData = [
+  {
+    key: "ssdw",
+    label: "所属单位",
+    type: "autocomplete",
+    prop: "ssdw",
+  },
+  {
+    key: "xcxmc",
+    label: "小程序名称",
+    type: "input",
+    prop: "xcxmc",
+  },
+  {
+    key: "appId",
+    label: "APPID",
+    type: "input",
+    prop: "appId",
+  },
+
+  {
+    key: "rzzt",
+    label: "认证主体",
+    type: "input",
+    prop: "rzzt",
+  },
+  {
+    key: "tyshxydm",
+    label: "统一社会信用代码",
+    type: "input",
+    prop: "tyshxydm",
+  },
+  {
+    key: "state",
+    label: "小程序状态",
+    type: "select",
+    prop: "state",
+    dict: "gzh_state",
+  },
+  {
+    key: "ysId",
+    label: "账号原始ID",
+    type: "input",
+    prop: "ysId",
+  },
+  {
+    key: "packState",
+    label: "小程序包状态",
+    type: "select",
+    prop: "packState",
+    dict: "email_state",
+  },
+  {
+    key: "rzState",
+    label: "认证状态",
+    type: "select",
+    prop: "rzState",
+    dict: "gzh_rzzt",
+  },
+  {
+    key: "rzsj",
+    label: "认证时间",
+    type: "date",
+    prop: "rzsj",
+  },
+  {
+    key: "rzlx",
+    label: "认证类型",
+    type: "select",
+    prop: "rzlx",
+    dict: "gzh_rzlx",
+  },
+
+  {
+    key: "icpState",
+    label: "icp备案状态",
+    type: "input",
+    prop: "icpState",
+  },
+  {
+    key: "ymbmd",
+    label: "域名白名单",
+    type: "input",
+    prop: "ymbmd",
+  },
+  {
+    key: "fwlm",
+    label: "服务类目",
+    type: "input",
+    prop: "fwlm",
+  },
+  {
+    key: "hydzyx",
+    label: "行业电子邮箱",
+    type: "input",
+    prop: "hydzyx",
+  },
+  {
+    key: "sshy",
+    label: "所属行业",
+    type: "select",
+    prop: "sshy",
+    dict: "app_sshy",
+  },
+  {
+    key: "zdhy",
+    label: "重点行业",
+    type: "select",
+    prop: "zdhy",
+    dict: "app_zdhy",
+  },
+  {
+    key: "xzqh",
+    label: "行政区划",
+    type: "select",
+    prop: "xzqh",
+    dict: "app_xzqh",
+  },
+  {
+    key: "xtzrr",
+    label: "系统责任人",
+    type: "input",
+    prop: "xtzrr",
+  },
+  {
+    key: "xtzrrdh",
+    label: "系统责任人电话",
+    type: "input",
+    prop: "xtzrrdh",
+  },
+  {
+    key: "xtzrryx",
+    label: "系统责任人邮箱",
+    type: "input",
+    prop: "xtzrryx",
+  },
+  {
+    key: "xtzrrdz",
+    label: "系统责任人地址",
+    type: "input",
+    prop: "xtzrrdz",
+  },
+  {
+    key: "yycjAppid",
+    label: "引入插件（APPID）",
+    type: "input",
+    prop: "yycjAppid",
+  },
+  {
+    key: "yycjKfz",
+    label: "引用插件（开发者）",
+    type: "input",
+    prop: "yycjKfz",
+  },
+  {
+    key: "xtjj",
+    label: "系统简介",
+    type: "textarea",
+    prop: "xtjj",
+  },
+];
+
+const formRules = {
+  ssdw: [{ required: true, message: "请填写", trigger: "blur" }],
+  xcxmc: [{ required: true, message: "请填写", trigger: "blur" }],
+  appId: [{ required: true, message: "请填写" }],
+  rzzt: [{ required: true, message: "请填写", trigger: "blur" }],
+  tyshxydm: [{ required: true, message: "请填写", trigger: "blur" }],
+  state: [{ required: true, message: "请填写", trigger: "change" }],
+
+  ysId: [{ required: true, message: "请填写", trigger: "blur" }],
+
+  packState: [{ required: true, message: "请填写", trigger: "change" }],
+
+  rzState: [{ required: true, message: "请填写", trigger: "change" }],
+
+  rzsj: [{ required: true, message: "请填写", trigger: "change" }],
+
+  rzlx: [{ required: true, message: "请填写", trigger: "change" }],
+  icpState: [{ required: true, message: "请填写", trigger: "blur" }],
+  ymbmd: [{ required: true, message: "请填写", trigger: "blur" }],
+  fwlm: [{ required: true, message: "请填写", trigger: "blur" }],
+  hydzyx: [{ required: true, message: "请填写", trigger: "blur" }],
+  sshy: [{ required: true, message: "请填写", trigger: "change" }],
+
+  zdhy: [{ required: true, message: "请填写", trigger: "change" }],
+  xzqh: [{ required: true, message: "请填写", trigger: "change" }],
+  xtzrr: [{ required: true, message: "请填写", trigger: "blur" }],
+  xtzrrdh: [{ required: true, message: "请填写", trigger: "blur" }],
+  xtzrryx: [{ required: true, message: "请填写", trigger: "blur" }],
+
+  xtzrrdz: [{ required: true, message: "请填写", trigger: "blur" }],
+  yycjAppid: [{ required: true, message: "请填写", trigger: "blur" }],
+  yycjKfz: [{ required: true, message: "请填写", trigger: "blur" }],
+  xtjj: [{ required: true, message: "请填写", trigger: "blur" }],
+};
+
+export { formData, formRules };
diff --git a/src/views/auditPages/components/assetsManagement/programDialog.vue b/src/views/auditPages/components/assetsManagement/programDialog.vue
new file mode 100644
index 0000000..13a22bb
--- /dev/null
+++ b/src/views/auditPages/components/assetsManagement/programDialog.vue
@@ -0,0 +1,230 @@
+<template>
+  <el-dialog
+    :title="title"
+    :visible.sync="open"
+    append-to-body
+    fullscreen
+    center
+  >
+    <el-form
+      :model="ruleForm"
+      :rules="rules"
+      ref="ruleForm"
+      label-width="170px"
+      label-position="right"
+      :disabled="disabled"
+    >
+      <form-title title="基本信息"></form-title>
+
+      <div class="grid-container">
+        <el-form-item
+          :label="item.label"
+          v-for="(item, index) in list"
+          :key="index"
+          :prop="item.prop"
+          :class="item.type == 'textarea' ? 'full-width' : ''"
+        >
+          <el-select
+            v-if="item.type == 'autocomplete'"
+            v-model="ruleForm[item.key]"
+            filterable
+            remote
+            placeholder="请输入关键词"
+            :remote-method="remoteMethod"
+            :loading="loading"
+          >
+            <el-option
+              v-for="item in options"
+              :key="item.id"
+              :label="item.nickName"
+              :value="item.nickName"
+            >
+            </el-option>
+          </el-select>
+
+          <!-- 输入框 -->
+          <el-input
+            v-if="item.type == 'input'"
+            v-model="ruleForm[item.key]"
+            :placeholder="'请输入' + item.label"
+          ></el-input>
+          <!-- 选择框 -->
+          <el-select
+            v-if="item.type == 'select'"
+            v-model="ruleForm[item.key]"
+            :placeholder="'请选择' + item.label"
+          >
+            <el-option
+              v-for="dict in dict.type[item.dict]"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            />
+          </el-select>
+          <!-- 日期框 -->
+          <el-date-picker
+            v-if="item.type == 'date'"
+            v-model="ruleForm[item.key]"
+            type="date"
+            format="yyyy-MM-dd"
+            value-format="yyyy-MM-dd"
+            placeholder="选择日期"
+          >
+          </el-date-picker>
+          <!-- 多行文本框 -->
+          <el-input
+            v-if="item.type == 'textarea'"
+            type="textarea"
+            resize="none"
+            placeholder="请输入系统简介"
+            :rows="5"
+            v-model="ruleForm[item.key]"
+          ></el-input>
+        </el-form-item>
+      </div>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="open = false" size="medium">返 回</el-button>
+      <el-button
+        type="primary"
+        size="medium"
+        @click="submit()"
+        v-show="!disabled"
+        >确 定</el-button
+      >
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import {
+  assetMiniPrograms,
+  miniProgramsInfo,
+  unitAllList,
+} from "@/api/auditPagesApi/index";
+import { formData, formRules } from "./programDialog.js";
+import formTitle from "../formTitle.vue";
+import { checkRole } from "@/utils/permission"; // 权限判断函数
+export default {
+  dicts: [
+    "app_xzqh",
+    "app_sshy",
+    "app_zdhy",
+    "gzh_state",
+    "gzh_rzzt",
+    "gzh_rzlx",
+    "email_state",
+  ],
+  components: { formTitle },
+  data() {
+    return {
+      loading: false,
+      options: [],
+      list: formData,
+      title: "",
+      open: false,
+      ruleForm: {},
+      rules: formRules,
+      disabled: false,
+    };
+  },
+  mounted() {
+    this.remoteMethod();
+  },
+  methods: {
+    /** 打开对话框 */
+    openDialog(id, disabled) {
+      if (!id) {
+        this.title = "新增小程序资产";
+        this.open = true;
+        this.resetForm("ruleForm");
+      } else {
+        this.getInfo(id);
+        this.disabled = disabled;
+      }
+    },
+
+    /**详情 */
+    async getInfo(id) {
+      let res = await miniProgramsInfo(id);
+      this.title = "修改小程序资产";
+      this.open = true;
+      this.resetForm("ruleForm");
+      this.ruleForm = res.data;
+    },
+
+    /**单位名称模糊查询 */
+    async remoteMethod(query) {
+      let res = await unitAllList({ nickName: query });
+      this.options = res.data;
+      if (this.options.length == 0) {
+        this.ruleForm.ssdw = "";
+        this.$message.error("请输入正确的企业");
+      }
+    },
+
+    /**提交 */
+    submit() {
+      let isUnit = checkRole(["unit"]);
+      const portion = ["ssdw", "xcxmc"];
+      let index = 0;
+      if (isUnit) {
+        // 全部校验
+        this.$refs["ruleForm"].validate((valid) => {
+          if (valid) {
+            this.submitFu();
+          } else {
+            console.log("error submit!!");
+            return false;
+          }
+        });
+      } else {
+        //部分校验
+        this.$refs["ruleForm"].validateField(portion, (errors) => {
+          if (errors) {
+            console.log("部分字段验证失败:", errors);
+          } else {
+            index++;
+            if (index == portion.length) {
+              this.submitFu();
+            }
+          }
+        });
+      }
+    },
+    async submitFu() {
+      this.loading = true;
+      if (this.ruleForm.id != null) {
+        await assetMiniPrograms("put", this.ruleForm);
+        this.$modal.msgSuccess("修改成功");
+      } else {
+        await assetMiniPrograms("post", this.ruleForm);
+        this.$modal.msgSuccess("新增成功");
+      }
+      this.loading = false;
+      this.open = false;
+      this.$emit("finish");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.grid-container {
+  display: grid;
+  /* 设置网格布局为一行两列 */
+  grid-template-columns: repeat(2, 1fr);
+  gap: 10px;
+}
+/* 定义强制占一行的类样式 */
+.full-width {
+  /* 让元素跨越两列，从而占满一行 */
+  grid-column: span 2;
+}
+::v-deep .el-select,
+.el-cascader,
+.el-date-editor,
+.el-autocomplete {
+  width: 100%;
+}
+</style>