perf: 优化页面组件

sample-form-manager-ui/admin/.env

 
 #门户
 VUE_APP_API_portal_URL=http://192.168.0.98:11072
-# 系统名称
-VUE_APP_sysName = '数字化样表系统'
+

sample-form-manager-ui/admin/.env.development

 #开发环境
 NODE_ENV = "development"
 VUE_APP_API_BASE_URL=http://192.168.0.98:11078
-#图片地址拼接
-VUE_APP_API_IMG_URL=http://192.168.0.98:11078/
\ No newline at end of file

sample-form-manager-ui/admin/.env.production

@@ -4,5 +4,4 @@ VUE_APP_API_BASE_URL=/basics_api
 
 #门户
 VUE_APP_API_portal_URL=/portal_home
-#图片地址拼接
-VUE_APP_API_IMG_URL=
+

sample-form-manager-ui/admin/src/assets/css/common.less

@@ -353,21 +353,21 @@
 .auto-scroll{
   overflow-y: auto;
 }
-::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-  overflow-y: auto;
-}
+// ::-webkit-scrollbar {
+//   width: 6px;
+//   height: 6px;
+//   overflow-y: auto;
+// }
 
-::-webkit-scrollbar-thumb {
-  border-radius: 6px;
-  background-color: rgba(144, 147, 153, 0.5);
-}
+// ::-webkit-scrollbar-thumb {
+//   border-radius: 6px;
+//   background-color: rgba(144, 147, 153, 0.5);
+// }
 
-::-webkit-scrollbar-track {
-  border-radius: 6px;
-  background: rbga(0, 0, 0, 0);
-}
+// ::-webkit-scrollbar-track {
+//   border-radius: 6px;
+//   background: rbga(0, 0, 0, 0);
+// }
 
 .autoWidth {
   min-width: 120px;

sample-form-manager-ui/admin/src/components/autoRegister/TabHeader.vue

+<template>
+  <div class="tab-header">
+    <i v-if="icon" :class="['mr5', 'primary', icon]"></i>
+    <span class="label">{{ label }}</span>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "TabHeader",
+  props: {
+    icon: {
+      type: String,
+      default: "",
+    },
+    label: {
+      type: String,
+      default: "",
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.tab-header {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  height: 40px;
+  padding: 0px 15px;
+  font-size: 14px;
+  position: relative;
+  cursor: default;
+  &::after {
+    content: "";
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+    height: 2px;
+    background-color: #e4e7ed;
+    z-index: 1;
+  }
+  .label {
+    font-weight: bold;
+    color: rgba(0, 0, 0, 0.65);
+  }
+}
+</style>

sample-form-manager-ui/admin/src/components/autoRegister/YDatePicker.vue

+<template>
+  <el-date-picker
+    :value="value"
+    type="daterange"
+    :value-format="valueFormat"
+    unlink-panels
+    :picker-options="pickerOptions"
+    :clearable="Clearable"
+    v-bind="$attrs"
+    @input="handleChange"
+    v-on="$listeners"
+  >
+  </el-date-picker>
+</template>
+
+<script>
+export default {
+  name: "YDatePicker",
+  model: {
+    event: "change",
+    prop: "value",
+  },
+
+  props: {
+    value: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    clearable: {
+      type: Boolean,
+      default: false,
+    },
+    valueFormat: {
+      type: String,
+      default: "yyyy-MM-dd",
+    },
+  },
+  data() {
+    return {
+      pickerOptions: {
+        shortcuts: [
+          {
+            text: "今天",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              picker.$emit("pick", [start, end]);
+            },
+          },
+          {
+            text: "最近一周",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+          {
+            text: "最近一个月",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+          {
+            text: "最近三个月",
+            onClick(picker) {
+              const end = new Date();
+              const start = new Date();
+              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+              picker.$emit("pick", [start, end]);
+            },
+          },
+        ],
+      },
+    };
+  },
+  computed: {
+    Clearable() {
+      return !!this.clearable;
+    },
+  },
+  methods: {
+    handleChange(val) {
+      this.$emit("change", val);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

sample-form-manager-ui/admin/src/components/autoRegister/YPagination.vue

+<template>
+  <div class="pagination" v-if="total">
+    <el-pagination
+      :background="background"
+      :layout="layout"
+      :pager-count="5"
+      :total="total"
+      :current-page="current"
+      :page-size="PageSize"
+      :page-sizes="pageSizes"
+      v-bind="$attrs"
+      @current-change="changePagination"
+      @size-change="changeSize"
+      v-on="$listeners"
+    >
+    </el-pagination>
+  </div>
+</template>
+
+<script>
+import { pageSizeOptions } from "@/config";
+export default {
+  name: "YPagination",
+  props: {
+    total: {
+      required: true,
+      type: Number,
+      default: 0,
+    },
+    pageSize: {
+      required: true,
+      type: Number,
+      default: 10,
+    },
+    page: {
+      required: true,
+      type: Number,
+      default: 1,
+    },
+    layout: {
+      type: String,
+      default: "total,prev,pager,next,sizes,jumper",
+    },
+    pageSizes: {
+      type: Array,
+      default: () => pageSizeOptions,
+    },
+    background: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    PageSize: {
+      get() {
+        return this.pageSize;
+      },
+      set(value) {
+        this.$emit("update:pageSize", value);
+      },
+    },
+    current: {
+      get() {
+        return this.page;
+      },
+      set(value) {
+        this.$emit("update:page", value);
+      },
+    },
+  },
+  methods: {
+    changePagination(cur) {
+      this.current = cur;
+      if (this.$listeners.change) {
+        this.$listeners.change();
+      }
+      this.$emit("currentChange", cur);
+    },
+    changeSize(size) {
+      this.PageSize = size;
+      if (this.$listeners.change) {
+        this.$listeners.change();
+      }
+      this.$emit("sizeChange", size);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped></style>

sample-form-manager-ui/admin/src/components/autoRegister/YSwitch.vue

+<template>
+  <div>
+    <el-switch
+      :value="value"
+      class="y-switch"
+      :active-value="activeValue"
+      :inactive-value="inactiveValue"
+      v-bind="$attrs"
+      v-on="$listeners"
+    >
+    </el-switch>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "YSwitch",
+  model: {
+    prop: "value",
+    event: "change",
+  },
+  props: {
+    value: {
+      default: 0,
+    },
+    activeValue: {
+      default: 1,
+    },
+    inactiveValue: {
+      default: 0,
+    },
+  },
+  methods: {},
+};
+</script>
+
+<style lang="less" scoped>
+:deep(.el-switch) {
+  .el-switch__label {
+    position: absolute;
+    display: none;
+    color: #fff;
+  }
+  .el-switch__label--right {
+    z-index: 1;
+    left: 0px; /*不同场景下可能不同，自行调整*/
+  }
+  .el-switch__label--left {
+    z-index: 1;
+    right: 0px; /*不同场景下可能不同，自行调整*/
+  }
+  .el-switch__label.is-active {
+    display: block;
+  }
+  .el-switch__core,
+  .el-switch .el-switch__label {
+    width: 60px !important; /*开关按钮的宽度大小*/
+  }
+}
+</style>

sample-form-manager-ui/admin/src/components/autoRegister/YTable.vue

+<template>
+  <div class="y-table">
+    <el-table
+      ref="MyTable"
+      v-loading="loading"
+      :data="data"
+      style="width: 100%"
+      :size="size"
+      :row-key="rowkey"
+      v-bind="$attrs"
+      v-on="$listeners"
+    >
+      <template v-for="(v, i) in column">
+        <el-table-column
+          v-if="!v.slot"
+          :key="i"
+          :reserve-selection="v.reserveSelection"
+          :prop="v.prop"
+          :type="v.type"
+          :index="v.index"
+          :label="v.label"
+          :width="v.width"
+          :align="v.align"
+          :fixed="v.fixed"
+          :formatter="v.formatter"
+          :min-width="v.minWidth"
+          :show-overflow-tooltip="v.showOverflowTooltip"
+        >
+        </el-table-column>
+        <el-table-column
+          v-else
+          :key="'a' + i"
+          :reserve-selection="v.reserveSelection"
+          :prop="v.prop"
+          :type="v.type"
+          :index="v.index"
+          :label="v.label"
+          :width="v.width"
+          :align="v.align"
+          :fixed="v.fixed"
+          :formatter="v.formatter"
+          :min-width="v.minWidth"
+          :show-overflow-tooltip="v.showOverflowTooltip"
+        >
+          <template slot-scope="scope">
+            <slot :name="v.prop" v-bind="scope"></slot>
+          </template>
+        </el-table-column>
+      </template>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "YTable",
+  props: {
+    loading: {
+      type: Boolean,
+      default: false,
+    },
+    size: {
+      type: String,
+      default: "",
+    },
+
+    data: {
+      type: Array,
+      default: () => [],
+    },
+    column: {
+      type: Array,
+      default: () => [],
+    },
+    rowkey: {
+      type: [String, Function],
+      default: "id",
+    },
+  },
+  data() {
+    return {};
+  },
+  watch: {
+    data: {
+      handler() {
+        this.$nextTick(() => {
+          this.$refs.MyTable.bodyWrapper.scrollTop = 0;
+          this.$refs.MyTable.bodyWrapper.scrollLeft = 0;
+        });
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
+  computed: {},
+  created() {},
+  methods: {
+    clearSelection() {
+      this.$refs.MyTable.clearSelection();
+    },
+    toggleAllSelection() {
+      this.$refs.MyTable.toggleAllSelection();
+    },
+    clearSort() {
+      this.$refs.MyTable.clearSort();
+    },
+    doLayout() {
+      this.$refs.MyTable.doLayout();
+    },
+    clearFilter() {
+      this.$refs.MyTable.clearFilter(...arguments);
+    },
+    sort() {
+      this.$refs.MyTable.sort(...arguments);
+    },
+    toggleRowExpansion() {
+      this.$refs.MyTable.toggleRowExpansion(...arguments);
+    },
+    setCurrentRow() {
+      this.$refs.MyTable.setCurrentRow(...arguments);
+    },
+    toggleRowSelection() {
+      this.$refs.MyTable.toggleRowSelection(...arguments);
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.y-table {
+  width: 100%;
+  height: 100%;
+}
+</style>

sample-form-manager-ui/admin/src/components/autoRegister/YUpload.vue

+<template>
+  <div>
+    <el-upload
+      v-if="listType === 'picture' || listType === 'text'"
+      ref="upload"
+      :headers="Headers"
+      :name="name"
+      :list-type="listType"
+      :action="action"
+      :multiple="multiple"
+      :accept="accept"
+      :limit="limit"
+      :file-list="FileList"
+      v-bind="$attrs"
+      v-on="$listeners"
+      :before-upload="beforeUpload"
+      :on-preview="handlePreview"
+      :on-success="handleSuccess"
+      :on-remove="handleRemove"
+      :on-exceed="handleExceed"
+    >
+      <slot>
+        <el-button size="small" type="primary">点击上传</el-button>
+      </slot>
+    </el-upload>
+    <el-upload
+      v-else
+      ref="upload"
+      :headers="Headers"
+      :name="name"
+      :list-type="listType"
+      :action="action"
+      :multiple="multiple"
+      :accept="accept"
+      :limit="limit"
+      :file-list="FileList"
+      v-bind="$attrs"
+      v-on="$listeners"
+      :before-upload="beforeUpload"
+      :on-preview="handlePreview"
+      :on-success="handleSuccess"
+      :on-remove="handleRemove"
+      :on-exceed="handleExceed"
+    >
+      <slot>
+        <i class="el-icon-plus"></i>
+      </slot>
+    </el-upload>
+
+    <!-- 图片查看 -->
+    <el-image-viewer
+      v-if="preview"
+      :appendToBody="false"
+      :on-close="closePreview"
+      :url-list="filepaths"
+    />
+    <!-- 视频\音频预览 -->
+    <div class="preview-box" v-if="show">
+      <video
+        v-if="previewData.type === 'video'"
+        class="h-[400px]"
+        :src="previewData.url"
+        autoplay
+        muted
+        controls
+      ></video>
+      <audio
+        v-else-if="previewData.type === 'audio'"
+        :src="previewData.url"
+        autoplay
+        controls
+      ></audio>
+      <i class="el-icon-circle-close" @click="show = false"></i>
+    </div>
+  </div>
+</template>
+
+<script>
+import ElImageViewer from "element-ui/packages/image/src/image-viewer";
+import { mapGetters } from "vuex";
+export default {
+  name: "YUpload",
+  model: {
+    prop: "value",
+    event: "success",
+  },
+  components: {
+    ElImageViewer,
+  },
+  props: {
+    name: {
+      type: String,
+      default: "file",
+    },
+    listType: {
+      type: String,
+      default: "text",
+    },
+    fileList: {
+      type: Array,
+      default: () => [],
+    },
+    multiple: {
+      type: Boolean,
+      default: false,
+    },
+    value: {
+      required: true,
+      type: [String, Array],
+      default: "",
+    },
+    headers: {
+      type: Object,
+      default: () => {},
+    },
+    // 文件限制
+    accept: {
+      type: String,
+      default: "",
+    },
+    // 上传数量
+    limit: {
+      type: Number,
+      validator: (value) => {
+        return value >= 0;
+      },
+      default: 1, // 0为不限制
+    },
+    // 上传文件大小限制mb 0为不限制
+    maxSize: {
+      type: Number,
+      validator: (value) => {
+        return value >= 0;
+      },
+      default: 10,
+    },
+    action: {
+      type: String,
+      default: "/fm/file/commonupload",
+    },
+  },
+
+  data() {
+    return {
+      FileList: [],
+      imageType: ["png", "jpg", "jpeg", "gif", "svg"],
+      videoType: ["mp4", "avi", "wmv", "rmvb", "flv", "mkv"],
+      audioType: [
+        "mp3",
+        "wav",
+        "amr",
+        "aac",
+        "ogg",
+        "wma",
+        "flac",
+        "ape",
+        "mid",
+        "m4a",
+        "m4r",
+        "m4p",
+        "m4b",
+      ],
+      // 图片预览
+      filepaths: [],
+      preview: false,
+      previewData: {
+        type: "",
+        url: "",
+      },
+
+      show: false,
+    };
+  },
+  watch: {
+    fileList: {
+      handler(newValue) {
+        this.initFileList(newValue);
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+
+  computed: {
+    ...mapGetters(["token"]),
+    Headers() {
+      let form = {
+        Authorization: this.token,
+      };
+      return {
+        ...form,
+        ...this.headers,
+      };
+    },
+  },
+
+  created() {},
+
+  methods: {
+    // 初始化文件列表
+    initFileList(fileList) {
+      this.FileList = fileList.map((v) => {
+        return {
+          uid: v.url,
+          name: v.name,
+          url: v.url,
+          status: "success",
+        };
+      });
+    },
+    // 上传成功
+    handleSuccess(response, file, fileList) {
+      if (this.limit) {
+        fileList = fileList.slice(-this.limit);
+      }
+      // this.FileList = [...fileList];
+      if (file.status == "success") {
+        if (file.response && file.response.code === -1) {
+          let msg = file.response.msg || "上传失败";
+          this.$message.error(msg);
+          fileList = fileList.filter((file) => file.response.code !== -1);
+        }
+        fileList = fileList.map((v) => {
+          if (v.response) {
+            v.url = v.response.url;
+          }
+          return v;
+        });
+
+        let value;
+        if (Array.isArray(this.value)) {
+          value = fileList.map((v) => v.url);
+        } else {
+          value = fileList.map((v) => v.url).join(",");
+        }
+        this.$emit("success", value);
+        this.$emit("change", { file, fileList });
+      }
+    },
+    // 删除文件
+    handleRemove(file, fileList) {
+      let value;
+      if (Array.isArray(this.value)) {
+        value = fileList.map((v) => v.url);
+      } else {
+        value = fileList.map((v) => v.url).join(",");
+      }
+      this.$emit("success", value);
+      this.$emit("change", { file, fileList });
+    },
+    // 上传之前
+    beforeUpload(file) {
+      let isType = true;
+      let isExceed = true;
+      return new Promise((resolve, reject) => {
+        if (this.accept) {
+          const fileType = this.accept.split(","); // 限制文件类型
+          let index = file.name.lastIndexOf(".");
+          let type = file.name.slice(index);
+          isType = fileType.includes(type);
+        }
+        if (!isType) {
+          let msg = this.accept.replaceAll(",", "或者");
+          this.$message.error(`请上传${msg}文件!`);
+        }
+
+        if (this.maxSize) {
+          isExceed = file.size / 1024 / 1024 <= this.maxSize;
+        }
+        if (!isExceed) {
+          this.$message.error(`文件大小不能超过${this.maxSize}MB!`);
+        }
+        if (isType && isExceed) {
+          resolve(file);
+        } else {
+          reject();
+        }
+      });
+    },
+    // 预览
+    handlePreview(file) {
+      let { url } = file;
+      if (!url) return;
+      let index = url.lastIndexOf(".");
+      let type = url.slice(index + 1);
+      if (this.imageType.includes(type)) {
+        this.filepaths = [url];
+        this.preview = true;
+      } else if (this.videoType.includes(type)) {
+        this.previewData.type = "video";
+        this.previewData.url = url;
+        this.show = true;
+      } else if (this.audioType.includes(type)) {
+        this.previewData.type = "audio";
+        this.previewData.url = url;
+        this.show = true;
+      } else {
+        let a = document.createElement("a");
+        a.href = url;
+        a.download = file.name;
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+      }
+    },
+    // 超出上传数量提示
+    handleExceed() {
+      this.$message.warning(
+        `文件数量超出限制，当前限制为 ${this.limit} 个文件`
+      );
+    },
+    closePreview() {
+      this.preview = false;
+      this.filepaths = [];
+    },
+    clearFiles() {
+      this.$refs.upload.clearFiles();
+    },
+    abort() {
+      this.$refs.upload.abort(...arguments);
+    },
+    submit() {
+      this.$refs.upload.submit();
+    },
+  },
+  beforeDestroy() {
+    this.$refs.upload.clearFiles();
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.preview-box {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  left: 0px;
+  top: 0px;
+  z-index: 999;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 15px;
+  .el-icon-circle-close {
+    font-size: 40px;
+    color: #fff;
+    cursor: pointer;
+  }
+}
+</style>

sample-form-manager-ui/admin/src/components/index.js

+let customComponents = {
+  install: function (Vue) {
+    //在use的时候vue会自动调用此方法
+    const files = require.context("@/components/autoRegister", true, /\.vue$/); //返回的是一个函数
+    // require.context()的参数
+    // 参数一 {String}：读取文件的目录路径
+    // 参数二 {Boolean}：是否深入遍历，即是否遍历子目录（二级目录）
+    // 参数三 {RegExp}：匹配目录内文件的正则表达式/\.vue$/表示匹配所有.vue后缀名的文件
+    files.keys().forEach((item) => {
+      const componentConfig = files(item);
+      const name =
+        componentConfig.default.name ||
+        item
+          .split("/")
+          .pop()
+          .replace(/\.\w+$/, "");
+      const component = componentConfig.default || componentConfig;
+      Vue.component(name, component); //注册当前组件
+    });
+  },
+};
+export default customComponents;

sample-form-manager-ui/admin/src/config/index.js

+export const pageSizeOptions = [10, 30, 50, 100, 200]; // 翻页-每页显示数量
+export const systemName = "智慧数字化样表服务系统"; // 系统名称
+// 服务器请求错误状态码
+export const responseErr = {
+  400: "请求参数错误",
+  403: "禁止访问",
+  404: "请求错误,未找到该资源",
+  405: "请求方法未允许",
+  408: "请求超时",
+  500: "服务器内部错误",
+  501: "服务未实现",
+  502: "网关错误",
+  503: "服务不可用",
+  504: "网关超时",
+  505: "http版本不支持该请求",
+};
+// 登录失效状态码
+export const loginErr = [401, 201, 9001, 9002];

sample-form-manager-ui/admin/src/main.js

@@ -24,6 +24,10 @@ Vue.prototype.$message = message;
 import { resetForm } from "@/utils";
 Vue.prototype.resetForm = resetForm;
 
+// 注册全局组件
+import customComponents from "@/components";
+Vue.use(customComponents);
+
 // 表格生成
 import plugins from "./components/formDes/index";
 Vue.use(plugins);

sample-form-manager-ui/admin/src/pages/hardware/NumberWriteDevice.vue

@@ -6,8 +6,8 @@
         <div slot="left">
           <!-- <el-button size="small" type="primary" @click="handleAdd"
             >新 增</el-button
-          > 
-          <el-dropdown class="ml15" @command="handleMore">
+          > -->
+          <!-- <el-dropdown class="ml15" @command="handleMore">
             <el-button type="primary" size="small">
               更多操作<i class="el-icon-arrow-down el-icon--right"></i>
             </el-button>
@@ -15,8 +15,7 @@
               <el-dropdown-item command="1">模板下载</el-dropdown-item>
               <el-dropdown-item command="2">导入</el-dropdown-item>
             </el-dropdown-menu>
-          </el-dropdown>
-          -->
+          </el-dropdown> -->
         </div>
         <div slot="right" class="flex">
           <el-select
@@ -48,36 +47,16 @@
       </TableHeader>
       <!-- 表格 -->
       <div class="table-content">
-        <el-table
-          ref="multipleTable"
-          v-loading="loading"
-          border
+        <y-table
+          :max-height="650"
           :data="tableData"
+          :column="columns"
+          border
+          :loading="loading"
           tooltip-effect="dark"
-          style="width: 100%"
-          :row-key="(row) => row.id"
-        >
-          <el-table-column
-            type="index"
-            label="序号"
-            width="55"
-            align="center"
-            :index="(index) => (current - 1) * size + index + 1"
-          >
-          </el-table-column>
-          <el-table-column
-            show-overflow-tooltip
-            label="设备名称"
-            align="center"
-            prop="deviceName"
+          ref="multipleTable"
         >
-          </el-table-column>
-          <el-table-column align="center" prop="deviceMac" label="mac地址">
-          </el-table-column>
-          <el-table-column align="center" prop="ip" label="IP地址">
-          </el-table-column>
-          <el-table-column align="center" label="设备位置">
-            <template slot-scope="scope">
+          <template slot="center" slot-scope="scope">
             <span
               v-if="
                 scope.row.deviceInBuilding ||
@@ -87,9 +66,7 @@
               "
               >{{
                 `${
-                    scope.row.deviceInBuilding
-                      ? scope.row.deviceInBuilding
-                      : "--"
+                  scope.row.deviceInBuilding ? scope.row.deviceInBuilding : "--"
                 }栋/${
                   scope.row.deviceInFloor ? scope.row.deviceInFloor : "--"
                 }楼/${scope.row.lon ? scope.row.lon : "--"},${
@@ -99,21 +76,8 @@
             >
             <span v-else>--</span>
           </template>
-          </el-table-column>
-          <el-table-column align="center" prop="resolution" label="分辨率">
-          </el-table-column>
-          <el-table-column align="center" prop="leadingOfficial" label="负责人">
-          </el-table-column>
-          <el-table-column
-            align="center"
-            prop="leadingOfficialTelephone"
-            label="联系电话"
-          >
-          </el-table-column>
-          <el-table-column align="center" prop="belong" label="所属机构">
-          </el-table-column>
-          <el-table-column align="center" label="状态">
-            <template slot-scope="scope">
+
+          <template slot="deviceStatus" slot-scope="scope">
             <el-tag
               size="small"
               v-if="scope.row.deviceStatus == 2"
@@ -128,9 +92,8 @@
             >
             <el-tag size="small" v-else type="danger">离线</el-tag>
           </template>
-          </el-table-column>
-          <el-table-column align="center" prop="enabled" label="启用/停用">
-            <template slot-scope="scope">
+
+          <template slot="enabled" slot-scope="scope">
             <el-switch
               class="tableScopeSwitch"
               :active-value="1"
@@ -142,11 +105,8 @@
             >
             </el-switch>
           </template>
-          </el-table-column>
-          <el-table-column align="center" prop="deviceRemark" label="备注">
-          </el-table-column>
-          <el-table-column align="center" label="操作" width="200">
-            <template slot-scope="scope">
+
+          <template slot="action" slot-scope="scope">
             <div class="flex jca">
               <span
                 v-if="scope.row.deviceStatus == 0"
@@ -171,18 +131,15 @@
               >
             </div>
           </template>
-          </el-table-column>
-        </el-table>
+        </y-table>
       </div>
-      <Pagination
+      <y-pagination
         :total="total"
-        :current="current"
-        :size="size"
-        @currentChange="changePagination"
-        @sizeChange="changeSize"
-      ></Pagination>
+        :page.sync="page"
+        :pageSize.sync="size"
+        @change="getDeviceList"
+      ></y-pagination>
     </div>
-
     <!-- 新增设备 -->
     <AddDevice
       :dict="dict"
@@ -198,10 +155,8 @@
 
 <script>
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
 import AddMatter from "./modal/AddMatter.vue";
 import AddDevice from "./modal/AddDevice.vue";
-import TabHeader from "@/components/TabHeader.vue";
 import {
   getDeviceList,
   saveDeviceEnable,
@@ -220,8 +175,6 @@ export default {
     TableHeader,
     AddDevice,
     AddMatter,
-    Pagination,
-    TabHeader,
   },
   data() {
     return {
@@ -232,7 +185,7 @@ export default {
         : "",
       tableData: [],
       total: 0,
-      current: 1,
+      page: 1,
       size: 10,
       dialogVisible: false,
       title: "新增数字样表设备",
@@ -240,6 +193,86 @@ export default {
       matterDrawer: false,
       dict: {}, // 字典
       type: "deviceName",
+      columns: [
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "设备名称",
+          prop: "deviceName",
+          align: "center",
+          showOverflowTooltip: true,
+        },
+        {
+          label: "mac地址",
+          align: "center",
+          prop: "deviceMac",
+        },
+        {
+          label: "IP地址",
+          align: "center",
+          prop: "ip",
+        },
+        {
+          label: "设备位置",
+          slot: true,
+          prop: "center",
+          align: "center",
+          showOverflowTooltip: true,
+        },
+
+        {
+          label: "分辨率",
+          prop: "resolution",
+          align: "center",
+        },
+        {
+          label: "负责人",
+          prop: "leadingOfficial",
+          align: "center",
+        },
+        {
+          label: "联系电话",
+          prop: "leadingOfficialTelephone",
+          align: "center",
+        },
+        {
+          label: "所属机构",
+          prop: "belong",
+          align: "center",
+        },
+        {
+          label: "状态",
+          slot: true,
+          prop: "deviceStatus",
+          align: "center",
+        },
+        {
+          label: "启用/停用",
+          slot: true,
+          prop: "enabled",
+          align: "center",
+        },
+        {
+          label: "备注",
+          prop: "deviceRemark",
+          align: "center",
+        },
+
+        {
+          label: "操作",
+          slot: true,
+          prop: "action",
+          align: "center",
+          width: "200",
+        },
+      ],
     };
   },
   created() {
@@ -251,12 +284,11 @@ export default {
       this.loading = true;
       let obj = {
         siteId: this.siteId,
-        page: this.current,
+        page: this.page,
         size: this.size,
       };
       let value = `%${this.searchVal}%`;
       obj[this.type] = value;
-
       let res = await getDeviceList(obj);
       this.loading = false;
       if (res.data.code == 1) {
@@ -264,7 +296,6 @@ export default {
         this.total = total;
         this.tableData = data;
         this.dict = dict;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
     },
     // 新增
@@ -275,27 +306,17 @@ export default {
     },
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.getDeviceList();
     },
 
     // 重置
     searchReset() {
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.type = "deviceName";
       this.getDeviceList();
     },
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getDeviceList();
-    },
-    // 改变每页显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getDeviceList();
-    },
     // 更多操作
     handleMore(item) {
       console.log(item);

sample-form-manager-ui/admin/src/pages/hardware/modal/AddDevice.vue

@@ -9,7 +9,7 @@
     >
       <el-form
         ref="form"
-        size="small"
+        size="medium"
         :model="form"
         :rules="rules"
         label-width="80px"
@@ -164,8 +164,8 @@
         </el-row>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleReset">重 置</el-button>
-        <el-button size="small" type="primary" @click="handleOk"
+        <el-button size="medium" @click="handleReset">重 置</el-button>
+        <el-button size="medium" type="primary" @click="handleOk"
           >确 定</el-button
         >
       </span>

sample-form-manager-ui/admin/src/pages/hardware/modal/AddMatter.vue

@@ -106,9 +106,10 @@
           <!-- 表格 -->
           <div class="table-content">
             <div @click.stop>
-              <el-table
+              <y-table
                 ref="curTable"
-                v-loading="loading"
+                :column="columns"
+                :loading="loading"
                 :data="tableData"
                 size="small"
                 tooltip-effect="dark"
@@ -118,64 +119,27 @@
                 :row-key="(row) => row.id"
                 @selection-change="handleSelectionChange"
               >
-                <el-table-column
-                  type="selection"
-                  reserve-selection
-                  width="40"
-                  align="center"
-                >
-                </el-table-column>
-                <el-table-column
-                  type="index"
-                  label="序号"
-                  width="50"
-                  align="center"
-                  :index="(index) => (current - 1) * size + index + 1"
-                >
-                </el-table-column>
-                <el-table-column
-                  prop="name"
-                  show-overflow-tooltip
-                  label="事项名称"
-                >
-                  <template slot-scope="scope">
+                <template slot="matterName" slot-scope="scope">
                   <p class="short">{{ scope.row.matterName }}</p>
                   <p class="full-name">
                     事项全称：{{ scope.row.matterFullName }}
                   </p>
                 </template>
-                </el-table-column>
-                <el-table-column
-                  label="部门"
-                  align="center"
-                  width="180"
-                  prop="deptName"
-                >
-                </el-table-column>
-                <el-table-column
-                  prop="datumCount"
-                  label="材料数量"
-                  align="center"
-                  width="80"
-                >
-                </el-table-column>
-                <el-table-column align="center" label="操作" width="80">
-                  <template slot-scope="scope">
+
+                <template slot="action" slot-scope="scope">
                   <span class="primary pointer" @click="handleJoin(scope.row)"
                     >选择</span
                   >
                 </template>
-                </el-table-column>
-              </el-table>
+              </y-table>
             </div>
           </div>
-          <Pagination
+          <y-pagination
             :total="total"
-            :current="current"
-            :size="size"
-            @currentChange="changePagination"
-            @sizeChange="changeSize"
-          ></Pagination>
+            :page.sync="page"
+            :pageSize.sync="size"
+            @change="getSampleformMatterList"
+          ></y-pagination>
         </div>
       </div>
       <div class="footer">
@@ -191,7 +155,6 @@
 <script>
 import { mapGetters } from "vuex";
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
 import { getSampleformMatterList } from "@/api/matter";
 import {
   getDeviceMatterList,
@@ -203,7 +166,6 @@ import local from "@/utils/local";
 export default {
   components: {
     TableHeader,
-    Pagination,
   },
   props: {
     matterDrawer: {
@@ -220,7 +182,7 @@ export default {
         : "",
       department: "",
       searchVal: "",
-      current: 1,
+      page: 1,
       size: 10,
       total: 0,
       tableData: [],
@@ -228,6 +190,52 @@ export default {
       selectionKeys: [],
       devInfo: {},
       devMatterIdList: [],
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+
+        {
+          label: "事项名称",
+          slot: true,
+          prop: "matterName",
+          showOverflowTooltip: true,
+        },
+        {
+          label: "所属部门",
+          prop: "deptName",
+          align: "center",
+          showOverflowTooltip: true,
+          width: "180",
+        },
+        {
+          label: "材料数量",
+          prop: "datumCount",
+          align: "center",
+          width: "80",
+        },
+
+        {
+          label: "操作",
+          slot: true,
+          prop: "action",
+          align: "center",
+          width: "80",
+        },
+      ],
     };
   },
   computed: {
@@ -277,7 +285,7 @@ export default {
     async getSampleformMatterList() {
       this.loading = true;
       let res = await getSampleformMatterList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         matterFullName: `%${this.searchVal}%`,
         deptCode: this.department,
@@ -289,12 +297,11 @@ export default {
         let { data, total } = res.data.data;
         this.tableData = data;
         this.total = total;
-        this.$refs.curTable.bodyWrapper.scrollTop = 0;
       }
     },
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.curTable.clearSelection();
       this.getSampleformMatterList();
     },
@@ -302,20 +309,11 @@ export default {
     handleReset() {
       this.department = "";
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.$refs.curTable.clearSelection();
       this.getSampleformMatterList();
     },
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getSampleformMatterList();
-    },
-    // 改变每页显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getSampleformMatterList();
-    },
+
     // 表格批量选中
     handleSelectionChange(select) {
       this.selectionKeys = select;
@@ -396,7 +394,7 @@ export default {
       this.$refs.curTable.clearSelection();
       this.department = "";
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.size = 10;
       this.drawer = false;
     },

sample-form-manager-ui/admin/src/pages/layouts/Layouts.vue

@@ -48,13 +48,14 @@ import { getdeptList } from "@/api/department";
 import { mapMutations, mapState } from "vuex";
 import local from "@/utils/local";
 import { findBottomSubarrays } from "@/utils";
+import { systemName } from "@/config";
 export default {
   components: {
     Header,
   },
   data() {
     return {
-      systemName: process.env.VUE_APP_sysName,
+      systemName,
       portalUrl: process.env.VUE_APP_API_portal_URL,
       breads: [],
       subMenus: [],

sample-form-manager-ui/admin/src/pages/layouts/components/Header.vue

@@ -3,7 +3,7 @@
     <div class="left flex aic">
       <img
         class="pointer mr10 logo"
-        :src="sysLogo ? api + sysLogo : require('@/assets/img/logo.png')"
+        :src="sysLogo ? sysLogo : require('@/assets/img/logo.png')"
         alt="LOGO"
         @click="handleGoHome"
       />
@@ -54,7 +54,7 @@
     <!-- 返回门户 -->
     <div class="back-btn">
       <el-tooltip effect="dark" content="返回门户" placement="bottom">
-        <a class="pointer" :href="portal + (path ? path : '')">
+        <a class="pointer" :href="portal + (path ? path : '/')">
           <i class="el-icon-s-home"></i> 返回门户
         </a>
       </el-tooltip>
@@ -64,6 +64,7 @@
 
 <script>
 import HeaderSite from "./HeaderSite.vue";
+import { systemName } from "@/config";
 import { mapState } from "vuex";
 export default {
   components: {
@@ -71,8 +72,7 @@ export default {
   },
   data() {
     return {
-      systemName: process.env.VUE_APP_sysName,
-      api: process.env.VUE_APP_API_IMG_URL,
+      systemName,
       portal: process.env.VUE_APP_API_portal_URL + "/#",
     };
   },

sample-form-manager-ui/admin/src/pages/software/basics/BasicsSet.vue

@@ -55,8 +55,8 @@
         </el-button>
       </div>
       <div class="mt50">
-        <el-button size="small" @click="handleReset">重 置</el-button>
-        <el-button size="small" type="primary" @click="handleOk"
+        <el-button size="medium" @click="handleReset">重 置</el-button>
+        <el-button size="medium" type="primary" @click="handleOk"
           >确 定
         </el-button>
       </div>

sample-form-manager-ui/admin/src/pages/software/librarymanage/LibraryManage.vue

@@ -48,49 +48,22 @@
       </TableHeader>
       <!-- 表格 -->
       <div class="table-content">
-        <el-table
-          ref="multipleTable"
-          v-loading="loading"
+        <y-table
+          :max-height="650"
           :data="tableData"
+          :column="columns"
           border
+          :loading="loading"
           tooltip-effect="dark"
-          style="width: 100%"
-          :row-key="(row) => row.id"
           @selection-change="handleSelectionChange"
+          ref="multipleTable"
         >
-          <el-table-column type="selection" width="55" align="center">
-          </el-table-column>
-          <el-table-column
-            type="index"
-            label="序号"
-            width="55"
-            align="center"
-            :index="(index) => (current - 1) * size + index + 1"
-          >
-          </el-table-column>
-          <el-table-column
-            show-overflow-tooltip
-            label="部门名称"
-            align="center"
-            prop="deptName"
-            width="200"
-          >
-          </el-table-column>
-          <el-table-column prop="name" show-overflow-tooltip label="材料名称">
-            <template slot-scope="scope">
+          <template slot="materialName" slot-scope="scope">
             <p class="short">{{ scope.row.materialName }}</p>
             <p class="full-name">材料全称：{{ scope.row.materiaFullName }}</p>
           </template>
-          </el-table-column>
-          <el-table-column
-            prop="createTime"
-            label="添加时间"
-            align="center"
-            width="150"
-          >
-          </el-table-column>
-          <el-table-column label="操作" align="center" width="100">
-            <template slot-scope="scope">
+
+          <template slot="action" slot-scope="scope">
             <div class="flex jca">
               <span class="primary pointer" @click="handlePreview(scope.row)"
                 >预览</span
@@ -100,18 +73,15 @@
               >
             </div>
           </template>
-          </el-table-column>
-        </el-table>
+        </y-table>
       </div>
-      <Pagination
+      <y-pagination
         :total="total"
-        :current="current"
-        :size="size"
-        @currentChange="changePagination"
-        @sizeChange="changeSize"
-      ></Pagination>
+        :page.sync="page"
+        :pageSize.sync="size"
+        @change="getPbuList"
+      ></y-pagination>
     </div>
-
     <!-- 添加材料 -->
     <!--    <AddMaterals
       ref="AddMaterals"
@@ -129,31 +99,75 @@
 <script>
 import TableHeader from "@/components/TableHeader.vue";
 import PreviewMaterals from "./modal/PreviewMaterals.vue";
-import Pagination from "@/components/Pagination.vue";
-import TabHeader from "@/components/TabHeader.vue";
+import local from "@/utils/local";
 import { getPubdatumList, delPubdatum } from "@/api/libray";
 import { mapGetters } from "vuex";
 export default {
   components: {
     TableHeader,
     PreviewMaterals,
-    Pagination,
-    TabHeader,
   },
   data() {
     return {
       department: "",
       searchVal: "",
       tableData: [],
-      current: 1,
+      page: 1,
       size: 10,
       total: 10,
       loading: false,
       selectKeys: [],
       depList: [],
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "部门名称",
+          prop: "deptName",
+          align: "center",
+          showOverflowTooltip: true,
+          width: "200",
+        },
+        {
+          label: "材料名称",
+          slot: true,
+          prop: "materialName",
+          showOverflowTooltip: true,
+        },
+
+        {
+          label: "添加时间",
+          prop: "createTime",
+          align: "center",
+          width: "150",
+        },
+
+        {
+          label: "操作",
+          slot: true,
+          prop: "action",
+          align: "center",
+          width: "100",
+        },
+      ],
       libVisible: false,
       materalsInfo: {},
       previewVisible: false,
+      siteId: local.getLocal("writeSiteId"),
     };
   },
   created() {
@@ -167,21 +181,21 @@ export default {
     async getPbuList() {
       this.loading = true;
       let res = await getPubdatumList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         materiaFullName: `%${this.searchVal}%`,
         deptCode: this.department,
+        siteId: this.siteId,
       });
       this.loading = false;
       if (res.data.code === 1) {
         let { data, total } = res.data.data;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getPbuList();
         }
         this.tableData = data;
         this.total = total;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
     },
 
@@ -195,13 +209,12 @@ export default {
         this.$message.warning("请先勾选数据");
         return;
       }
-
       let ids = this.selectKeys.map((v) => v.id).join(",");
       this.handleDel(ids);
     },
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getPbuList();
     },
@@ -209,6 +222,7 @@ export default {
     handleReset() {
       this.department = "";
       this.searchVal = "";
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getPbuList();
     },
@@ -216,17 +230,7 @@ export default {
     handleSelectionChange(select) {
       this.selectKeys = select;
     },
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getPbuList();
-    },
 
-    // 改变没有显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getPbuList();
-    },
     // 预览
     handlePreview(row) {
       this.materalsInfo = row;
@@ -251,7 +255,6 @@ export default {
             this.$message.success(msg);
             this.getPbuList();
             this.$refs.multipleTable.clearSelection();
-            this.selectKeys = [];
           }
         })
         .catch(() => {
@@ -277,6 +280,7 @@ export default {
     text-overflow: ellipsis;
     white-space: nowrap;
   }
+
   // .table-content {
   //   height: 550px;
   // }

sample-form-manager-ui/admin/src/pages/software/librarymanage/modal/PreviewMaterals.vue

 <template>
   <div>
-    <el-dialog title="材料预览" :visible.sync="Visible" width="50%" top="2vh">
+    <el-dialog
+      title="材料预览"
+      destroy-on-close
+      :visible.sync="Visible"
+      width="50%"
+      top="2vh"
+    >
       <div class="main flex flexc aic">
         <div class="header tac mb20">
           <div class="materals-name mb10">{{ materialsInfo.materialName }}</div>
@@ -9,7 +15,7 @@
           </p>
         </div>
         <div class="preview-box">
-          <img class="sample-sheet-img" :src="api2 + materialsPreview" />
+          <img class="sample-sheet-img" :src="materialsPreview" />
         </div>
       </div>
       <div slot="footer" class="tac">
@@ -55,15 +61,13 @@ export default {
   },
   data() {
     return {
-      api: process.env.VUE_APP_API_BASE_URL + "/",
-      api2: process.env.VUE_APP_API_IMG_URL,
       loading: false,
     };
   },
   methods: {
     handlePrint(info) {
       const a = document.createElement("a");
-      a.href = this.api2 + info.samplePath;
+      a.href = info.samplePath;
       a.download = info.sampleName;
       a.click();
     },
@@ -75,20 +79,6 @@ export default {
 :deep(.el-dialog__body) {
   height: 78vh;
   overflow-y: auto;
-  &::-webkit-scrollbar {
-    width: 6px;
-    overflow-y: auto;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    border-radius: 6px;
-    background-color: rgba(144, 147, 153, 0.5);
-  }
-
-  &::-webkit-scrollbar-track {
-    border-radius: 6px;
-    background: #fff;
-  }
 }
 .main {
   width: 100%;

sample-form-manager-ui/admin/src/pages/software/materials/MaterialsManage.vue

@@ -11,7 +11,7 @@
           </div>
           <div slot="right" class="flex">
             <el-select
-              v-model="departmentLeft"
+              v-model="sampleformMatterTable.searchForm.deptCode"
               size="small"
               style="width: 120px"
               placeholder="选择部门"
@@ -34,7 +34,7 @@
             </el-select>
             <el-input
               size="small"
-              v-model="leftSearch"
+              v-model="sampleformMatterTable.searchForm.matterFullName"
               style="width: 200px"
               class="ml10 mr10"
               placeholder="请输入事项全称搜索"
@@ -49,63 +49,33 @@
         <!-- 表格 -->
         <div class="table-content">
           <div @click.stop>
-            <el-table
-              ref="leftTable"
-              v-loading="loadingLeft"
-              :data="LeftTableData"
+            <y-table
+              :data="sampleformMatterTable.data"
+              :max-height="650"
+              :column="sampleformMatterTable.columns"
+              highlight-current-row
               size="small"
               border
+              :loading="sampleformMatterTable.loading"
               tooltip-effect="dark"
-              style="width: 100%"
-              highlight-current-row
-              reserve-selection
-              :row-key="(row) => row.id"
               @current-change="handleCurrentChange"
+              ref="leftTable"
             >
-              <el-table-column
-                type="index"
-                label="序号"
-                width="55"
-                align="center"
-                :index="(index) => (leftCurrent - 1) * leftSize + index + 1"
-              >
-              </el-table-column>
-              <el-table-column
-                show-overflow-tooltip
-                label="部门名称"
-                align="center"
-                prop="deptName"
-              >
-              </el-table-column>
-              <el-table-column
-                prop="matterName"
-                show-overflow-tooltip
-                label="事项名称"
-              >
-                <template slot-scope="scope">
+              <template slot="matterName" slot-scope="scope">
                 <p class="short">{{ scope.row.matterName }}</p>
                 <p class="full-name">
                   事项全称：{{ scope.row.matterFullName }}
                 </p>
               </template>
-              </el-table-column>
-              <el-table-column
-                prop="datumCount"
-                label="材料数量"
-                align="center"
-                width="80"
-              >
-              </el-table-column>
-            </el-table>
+            </y-table>
           </div>
         </div>
-        <Pagination
-          :current="leftCurrent"
-          :size="leftSize"
-          :total="leftTotal"
-          @currentChange="leftChangePagination"
-          @sizeChange="leftChangeSize"
-        ></Pagination>
+        <y-pagination
+          :total="sampleformMatterTable.total"
+          :page.sync="sampleformMatterTable.page"
+          :pageSize.sync="sampleformMatterTable.size"
+          @change="getSampleformMatterList"
+        ></y-pagination>
       </div>
     </div>
     <div class="right h-full bgw flex flexc">
@@ -136,7 +106,7 @@
           </div>
           <div slot="right" class="flex">
             <el-select
-              v-model="departmentRight"
+              v-model="materialsTable.searchForm.deptCode"
               size="small"
               style="width: 120px"
               placeholder="选择部门"
@@ -159,7 +129,7 @@
             <el-input
               size="small"
               style="width: 200px"
-              v-model="rightSearch"
+              v-model="materialsTable.searchForm.materiaFullName"
               class="ml10 mr10"
               placeholder="请输入材料全称搜索"
               @keyup.native.enter="handleSearchRight"
@@ -172,62 +142,22 @@
         </TableHeader>
         <!-- 表格 -->
         <div class="table-content">
-          <el-table
+          <y-table
             ref="rightTable"
             size="small"
-            v-loading="loadingRight"
-            :data="rightTableData"
-            reserve-selection
+            :column="materialsTable.columns"
+            :loading="materialsTable.loading"
+            :data="materialsTable.data"
             border
             tooltip-effect="dark"
-            style="width: 100%"
-            :row-key="(row) => row.id"
             @selection-change="handleSelectionChangeRight"
           >
-            <el-table-column type="selection" width="55" align="center">
-            </el-table-column>
-            <el-table-column
-              type="index"
-              label="序号"
-              width="55"
-              align="center"
-              :index="(index) => (rightCurrent - 1) * rightSize + index + 1"
-            >
-            </el-table-column>
-            <el-table-column
-              show-overflow-tooltip
-              label="部门名称"
-              align="center"
-              prop="deptName"
-            >
-            </el-table-column>
-            <el-table-column prop="name" show-overflow-tooltip label="材料名称">
-              <template slot-scope="scope">
+            <template slot="materialName" slot-scope="scope">
               <p class="short">{{ scope.row.materialName }}</p>
-                <p class="full-name">
-                  材料全称：{{ scope.row.materiaFullName }}
-                </p>
+              <p class="full-name">材料全称：{{ scope.row.materiaFullName }}</p>
             </template>
-            </el-table-column>
-            <el-table-column
-              prop="categoryName"
-              show-overflow-tooltip
-              label="所属文件夹"
-              align="center"
-              width="100"
-            >
-            </el-table-column>
-            <el-table-column
-              prop="total"
-              label="查看次数"
-              align="center"
-              width="80"
-            >
-            </el-table-column>
-            <el-table-column prop="sort" label="排序" align="center" width="80">
-            </el-table-column>
-            <el-table-column label="操作" align="center" width="210">
-              <template slot-scope="scope">
+
+            <template slot="action" slot-scope="scope">
               <div class="flex jcb">
                 <div style="width: 60px">
                   <span
@@ -251,9 +181,7 @@
                     @click="addMaterialsToFolder(scope.row)"
                     >移动至</span
                   > -->
-                  <span
-                    class="primary pointer"
-                    @click="handlePreview(scope.row)"
+                <span class="primary pointer" @click="handlePreview(scope.row)"
                   >预览</span
                 >
                 <span class="delete pointer" @click="handleDel(scope.row.id)"
@@ -261,16 +189,14 @@
                 >
               </div>
             </template>
-            </el-table-column>
-          </el-table>
+          </y-table>
         </div>
-        <Pagination
-          :current="rightCurrent"
-          :size="rightSize"
-          :total="rightTotal"
-          @currentChange="rightChangePagination"
-          @sizeChange="rightChangeSize"
-        ></Pagination>
+        <y-pagination
+          :page.sync="materialsTable.page"
+          :pageSize.sync="materialsTable.size"
+          :total="materialsTable.total"
+          @change="getMaterialsList"
+        ></y-pagination>
       </div>
       <!-- 新增材料 -->
       <AddMaterials
@@ -312,7 +238,6 @@ import TableHeader from "@/components/TableHeader.vue";
 import AddMaterials from "./modal/AddMaterials.vue";
 import PreviewMaterials from "./modal/PreviewMaterials.vue";
 import CommonLib from "./modal/CommonLib.vue";
-import Pagination from "@/components/Pagination.vue";
 import AddFolders from "./modal/AddFolders.vue";
 import FolderList from "./modal/FolderList.vue";
 import TabHeader from "@/components/TabHeader.vue";
@@ -330,7 +255,6 @@ export default {
     AddMaterials,
     PreviewMaterials,
     CommonLib,
-    Pagination,
     AddFolders,
     FolderList,
     TabHeader,
@@ -340,6 +264,128 @@ export default {
       siteId: local.getLocal("sampleSiteId")
         ? local.getLocal("sampleSiteId")
         : "",
+      // 样表事项表格
+      sampleformMatterTable: {
+        loading: false,
+        page: 1,
+        size: 10,
+        total: 0,
+        data: [],
+        selectionKeys: [],
+        searchForm: {
+          matterFullName: "",
+          deptCode: "",
+        },
+        columns: [
+          {
+            label: "序号",
+            type: "index",
+            width: "55",
+            align: "center",
+            index: (index) => {
+              return (
+                (this.sampleformMatterTable.page - 1) *
+                  this.sampleformMatterTable.size +
+                index +
+                1
+              );
+            },
+          },
+          {
+            label: "部门名称",
+            prop: "deptName",
+            align: "center",
+            width: "180",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "事项名称",
+            slot: true,
+            prop: "matterName",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "材料数量",
+            prop: "datumCount",
+            align: "center",
+            width: "100",
+          },
+        ],
+      },
+      // 表单表格
+      materialsTable: {
+        loading: false,
+        page: 1,
+        size: 10,
+        total: 0,
+        data: [],
+        selectionKeys: [],
+        searchForm: {
+          materiaFullName: "",
+          deptCode: "",
+        },
+        columns: [
+          {
+            label: "全选",
+            type: "selection",
+            width: "55",
+            align: "center",
+            reserveSelection: true,
+          },
+          {
+            label: "序号",
+            type: "index",
+            width: "55",
+            align: "center",
+            index: (index) => {
+              return (
+                (this.materialsTable.page - 1) * this.materialsTable.size +
+                index +
+                1
+              );
+            },
+          },
+
+          {
+            label: "部门名称",
+            prop: "deptName",
+            align: "center",
+            width: "180",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "材料名称",
+            slot: true,
+            prop: "materialName",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "所属文件夹",
+            prop: "categoryName",
+            align: "center",
+            width: "100",
+          },
+          {
+            label: "查看次数",
+            prop: "total",
+            align: "center",
+            width: "80",
+          },
+          {
+            label: "排序",
+            prop: "sort",
+            align: "center",
+            width: "80",
+          },
+          {
+            label: "操作",
+            slot: true,
+            prop: "action",
+            align: "center",
+            width: "210",
+          },
+        ],
+      },
       departmentLeft: "",
       departmentRight: "",
       leftSearch: "",
@@ -378,55 +424,53 @@ export default {
   methods: {
     // 系统事项列表
     async getSampleformMatterList() {
-      this.loadingLeft = true;
+      this.sampleformMatterTable.loading = true;
       let res = await getSampleformMatterList({
-        page: this.leftCurrent,
-        size: this.leftSize,
-        matterFullName: `%${this.leftSearch}%`,
-        deptCode: this.departmentLeft,
+        page: this.sampleformMatterTable.page,
+        size: this.sampleformMatterTable.size,
+        matterFullName: `%${this.sampleformMatterTable.searchForm.matterFullName}%`,
+        deptCode: this.sampleformMatterTable.searchForm.deptCode,
         siteId: this.siteId,
       });
-      this.loadingLeft = false;
+      this.sampleformMatterTable.loading = false;
       if (res.data.code === 1) {
         let { data, total } = res.data.data;
-        this.LeftTableData = data;
-        this.leftTotal = total;
-        this.$refs.leftTable.bodyWrapper.scrollTop = 0;
+        this.sampleformMatterTable.data = data;
+        this.sampleformMatterTable.total = total;
       }
     },
 
     // 获取材料列表
     async getMaterialsList() {
-      this.loadingRight = true;
+      this.materialsTable.loading = true;
       let res = await getMaterialsList({
-        page: this.rightCurrent,
-        size: this.rightSize,
-        materiaFullName: `%${this.rightSearch}%`,
+        page: this.materialsTable.page,
+        size: this.materialsTable.size,
+        materiaFullName: `%${this.materialsTable.searchForm.materiaFullName}%`,
         matterId: this.activeDep.id,
-        deptCode: this.departmentRight,
+        deptCode: this.materialsTable.searchForm.deptCode,
         siteId: parseInt(this.siteId),
       });
-      this.loadingRight = false;
+      this.materialsTable.loading = false;
       let { data, total, recommendCount } = res.data.data;
-      if (!data.length && this.rightCurrent > 1) {
-        this.rightCurrent -= 1;
+      if (!data.length && this.materialsTable.page > 1) {
+        this.materialsTable.page -= 1;
         this.getMaterialsList();
       }
-      this.rightTotal = total;
-      this.rightTableData = data;
+      this.materialsTable.total = total;
+      this.materialsTable.data = data;
       this.recommendCount = recommendCount;
-      this.$refs.rightTable.bodyWrapper.scrollTop = 0;
     },
     // 左边搜索
     handleSearchLeft() {
-      this.leftCurrent = 1;
+      this.sampleformMatterTable.page = 1;
       this.getSampleformMatterList();
     },
     // 左边重置
     leftReset() {
-      this.departmentLeft = "";
-      this.leftSearch = "";
-      this.leftCurrent = 1;
+      this.sampleformMatterTable.searchForm.matterFullName = "";
+      this.sampleformMatterTable.searchForm.deptCode = "";
+      this.sampleformMatterTable.page = 1;
       this.getSampleformMatterList();
     },
 
@@ -434,7 +478,8 @@ export default {
     handleCurrentChange(currentRow) {
       if (currentRow) {
         this.activeDep = currentRow;
-        this.rightCurrent = 1;
+        this.materialsTable.page = 1;
+        this.$refs.rightTable.clearSelection();
         this.getMaterialsList();
       }
     },
@@ -442,20 +487,11 @@ export default {
     setCurrent() {
       this.$refs.leftTable.setCurrentRow();
       this.activeDep = {};
-      this.rightCurrent = 1;
+      this.materialsTable.page = 1;
+      this.$refs.rightTable.clearSelection();
       this.getMaterialsList();
     },
-    // 左边翻页
-    leftChangePagination(cur) {
-      this.leftCurrent = cur;
-      this.getSampleformMatterList();
-    },
 
-    // 左边改变每页显示数量
-    leftChangeSize(size) {
-      this.leftSize = size;
-      this.getSampleformMatterList();
-    },
     // 新增材料
     handleAddMaterial() {
       if (!this.activeDep.id) {
@@ -477,28 +513,28 @@ export default {
     },
     // 右边勾选
     handleSelectionChangeRight(select) {
-      this.rightSelectedRowKeys = select;
+      this.materialsTable.selectionKeys = select;
     },
     // 批量删除
     handleDelAll() {
-      if (!this.rightSelectedRowKeys.length) {
+      if (!this.materialsTable.selectionKeys.length) {
         this.$message.warning("请先勾选数据");
         return;
       }
-      let ids = this.rightSelectedRowKeys.map((v) => v.id).join(",");
+      let ids = this.materialsTable.selectionKeys.map((v) => v.id).join(",");
       this.handleDel(ids);
     },
     // 右边搜索
     handleSearchRight() {
-      this.rightCurrent = 1;
+      this.materialsTable.page = 1;
       this.$refs.rightTable.clearSelection();
       this.getMaterialsList();
     },
     // 右边重置
     rightReset() {
-      this.departmentRight = "";
-      this.rightSearch = "";
-      this.rightCurrent = 1;
+      this.materialsTable.page = 1;
+      this.materialsTable.searchForm.materiaFullName = "";
+      this.materialsTable.searchForm.deptCode = "";
       this.$refs.rightTable.clearSelection();
       this.getMaterialsList();
     },
@@ -538,23 +574,13 @@ export default {
             this.getMaterialsList();
             this.getSampleformMatterList();
             this.$refs.rightTable.clearSelection();
-            this.rightSelectedRowKeys = [];
           }
         })
         .catch(() => {
           console.log("取消成功！");
         });
     },
-    // 右边翻页
-    rightChangePagination(cur) {
-      this.rightCurrent = cur;
-      this.getMaterialsList();
-    },
-    // 右边改变每页显示数量
-    rightChangeSize(size) {
-      this.rightSize = size;
-      this.getMaterialsList();
-    },
+
     // 新增材料成功
     addSuccess() {
       this.getSampleformMatterList();
@@ -571,11 +597,14 @@ export default {
     },
     // 移动材料进事项文件夹
     addMaterialsToFolder() {
-      if (!this.rightSelectedRowKeys.length) {
+      if (!this.materialsTable.selectionKeys.length) {
         this.$message.warning("请先勾选材料");
         return;
       }
-      this.$refs.FolderList.onAdd(this.rightSelectedRowKeys, this.activeDep.id);
+      this.$refs.FolderList.onAdd(
+        this.materialsTable.selectionKeys,
+        this.activeDep.id
+      );
       this.folderListVisible = true;
     },
     materialsToFolderOk() {

sample-form-manager-ui/admin/src/pages/software/materials/modal/AddFolders.vue

@@ -8,25 +8,23 @@
       :close-on-click-modal="false"
     >
       <el-form
-        size="small"
+        size="medium"
         ref="form"
         :model="form"
         :rules="rules"
         label-width="100px"
       >
         <el-form-item label="所属事项">
-          <el-input size="small" disabled :value="form.matterName"></el-input>
+          <el-input disabled :value="form.matterName"></el-input>
         </el-form-item>
         <el-form-item label="文件夹名称" prop="categoryName">
           <el-input
-            size="small"
             v-model="form.categoryName"
             placeholder="请输入文件夹名称"
           ></el-input>
         </el-form-item>
         <el-form-item label="文件夹编码" prop="categoryCode">
           <el-input
-            size="small"
             v-model="form.categoryCode"
             placeholder="请输入文件夹编码"
           ></el-input>
@@ -40,10 +38,10 @@
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleRest">重 置</el-button>
+        <el-button size="medium" @click="handleRest">重 置</el-button>
         <el-button
           :loading="loading"
-          size="small"
+          size="medium"
           type="primary"
           @click="handleOk"
           >确 定</el-button

sample-form-manager-ui/admin/src/pages/software/materials/modal/AddMaterials.vue

@@ -8,7 +8,7 @@
       :close-on-click-modal="false"
     >
       <el-form
-        size="small"
+        size="medium"
         ref="form"
         :model="form"
         :rules="rules"
@@ -16,23 +16,21 @@
       >
         <el-form-item label="材料简称" prop="materialName">
           <el-input
-            size="small"
             v-model="form.materialName"
             placeholder="请输入材料简称"
           ></el-input>
         </el-form-item>
         <el-form-item label="材料全称" prop="materiaFullName">
           <el-input
-            size="small"
             v-model="form.materiaFullName"
             placeholder="请输入材料全称"
           ></el-input>
         </el-form-item>
         <el-form-item label="所属事项">
-          <el-input disabled size="small" v-model="form.matterName"></el-input>
+          <el-input disabled v-model="form.matterName"></el-input>
         </el-form-item>
         <el-form-item label="事项编码">
-          <el-input disabled size="small" v-model="form.matterNo"></el-input>
+          <el-input disabled v-model="form.matterNo"></el-input>
         </el-form-item>
         <el-form-item label="排序" prop="sort">
           <el-input-number
@@ -54,27 +52,22 @@
           </el-switch>
         </el-form-item>
         <el-form-item label="上传样表" prop="samplePath">
-          <el-upload
-            class="upload-demo"
-            :action="api + 'sampleform/file/commonupload'"
-            :on-remove="handleRemoveSamplePath"
-            :file-list="samplePathFileList"
-            :on-success="OnsuccessSamplePath"
-            :headers="{
-              Authorization: token,
-            }"
+          <YUpload
+            :fileList="samplePathFileList"
+            accept=".docx,.doc,.pdf,.png,.jpg,.jpeg"
+            :limit="1"
+            v-model="form.samplePath"
+            @change="handleFileName"
           >
-            <!-- accept="application/vnd.openxmlformats-officedocument.wordprocessingml.document" -->
-            <el-button size="small" type="primary">上传文件</el-button>
-            <!-- <span class="tips">提示：请上传.docx格式</span> -->
-          </el-upload>
+            <el-button type="primary">上传文件</el-button>
+          </YUpload>
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleRest">重 置</el-button>
+        <el-button size="medium" @click="handleRest">重 置</el-button>
         <el-button
           :loading="loading"
-          size="small"
+          size="medium"
           type="primary"
           @click="handleOk"
           >确 定</el-button
@@ -103,7 +96,6 @@ export default {
   },
   data() {
     return {
-      api: process.env.VUE_APP_API_BASE_URL + "/",
       form: {
         materialName: "", // 材料名称
         materiaFullName: "", // 材料全名
@@ -209,21 +201,11 @@ export default {
       this.loading = false;
       this.Visible = false;
     },
-    // 上传样表
-    OnsuccessSamplePath(response, file, fileList) {
-      if (response.code == 1) {
-        this.samplePathFileList = fileList.slice(-1);
-        this.form.samplePath = response.url;
-        this.form.sampleName = response.fileName;
-      } else {
-        let msg = response.msg || "上传失败";
-        this.$message.error(msg);
-      }
-    },
-    // 删除样表
-    handleRemoveSamplePath() {
-      this.form.samplePath = "";
-      this.form.sampleName = "";
+
+    handleFileName({ fileList }) {
+      let fileName = fileList.length ? fileList[0].name : "";
+      this.form.sampleName = fileName;
+      this.samplePathFileList = fileList;
     },
   },
 };

sample-form-manager-ui/admin/src/pages/software/materials/modal/CommonLib.vue

@@ -4,11 +4,30 @@
       :destroy-on-close="true"
       title="从公共库中选择"
       :visible.sync="Visible"
-      width="70%"
-      :close-on-click-modal="false"
+      width="50%"
     >
       <TableHeader>
         <div slot="right" class="flex">
+          <el-select
+            v-model="department"
+            class="autoWidth"
+            size="small"
+            placeholder="选择部门"
+            filterable
+          >
+            <template slot="prefix">
+              {{
+                (deptList.find((s) => s.deptNumber === department) || {}).name
+              }}
+            </template>
+            <el-option
+              v-for="item in deptList"
+              :key="item.deptNumber"
+              :label="item.name"
+              :value="item.deptNumber"
+            >
+            </el-option>
+          </el-select>
           <el-input
             size="small"
             style="width: 200px"
@@ -18,69 +37,41 @@
             @keyup.native.enter="handleSarch"
           ></el-input>
           <el-button size="small" type="primary" @click="handleSarch"
-            >搜 索
-          </el-button>
-          <el-button size="small" @click="resetSearch">重 置</el-button>
+            >搜索</el-button
+          >
+          <el-button size="small" @click="resetSearch">重置</el-button>
         </div>
       </TableHeader>
-      <el-table
+      <y-table
         ref="multipleTable"
-        v-loading="loading"
         size="small"
         :data="tableData"
-        reserve-selection
+        :column="columns"
+        :loading="loading"
         border
         tooltip-effect="dark"
         style="width: 100%"
-        max-height="500px"
+        max-height="460px"
         :row-key="(row) => row.id"
         @selection-change="handleSelectionChange"
       >
-        <el-table-column type="selection" width="55" align="center">
-        </el-table-column>
-        <el-table-column
-          type="index"
-          label="序号"
-          width="55"
-          align="center"
-          :index="(index) => (current - 1) * size + index + 1"
-        >
-        </el-table-column>
-        <el-table-column
-          show-overflow-tooltip
-          label="部门名称"
-          align="center"
-          prop="deptName"
-          width="300"
-        >
-        </el-table-column>
-        <el-table-column prop="name" show-overflow-tooltip label="材料名称">
-          <template slot-scope="scope">
+        <template slot="materialName" slot-scope="scope">
           <p class="short">{{ scope.row.materialName }}</p>
           <p class="full-name">材料全称：{{ scope.row.materiaFullName }}</p>
         </template>
-        </el-table-column>
-        <el-table-column
-          prop="createTime"
-          label="加入时间"
-          align="center"
-          width="140"
-        >
-        </el-table-column>
-      </el-table>
-      <Pagination
+      </y-table>
+      <y-pagination
         :total="total"
-        :current="current"
-        :size="size"
-        @currentChange="changePagination"
-        @sizeChange="changeSize"
-      ></Pagination>
+        :page.sync="page"
+        :pageSize.sync="size"
+        @change="getPbuList"
+      ></y-pagination>
 
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="Visible = false">取 消</el-button>
+        <el-button size="medium" @click="handleClose">取 消</el-button>
         <el-button
-          :loading="loading"
-          size="small"
+          :loading="addLoading"
+          size="medium"
           type="primary"
           @click="handleOk"
           >确 定</el-button
@@ -92,16 +83,13 @@
 
 <script>
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
-import { getPubdatumList } from "@/api/libray";
 import { addPubdatum } from "@/api/materials";
-import local from "@/utils/local";
+import { getPubdatumList } from "@/api/libray";
 import { mapGetters } from "vuex";
-
+import local from "@/utils/local";
 export default {
   components: {
     TableHeader,
-    Pagination,
   },
   props: {
     libVisible: {
@@ -110,11 +98,10 @@ export default {
       default: false,
     },
     matterId: {
-      required: false,
-      default: 0,
+      required: true,
+      default: "",
     },
   },
-  created() {},
   data() {
     return {
       siteId: local.getLocal("sampleSiteId")
@@ -123,12 +110,49 @@ export default {
       department: "",
       searchVal: "",
       tableData: [],
-      current: 1,
-      total: 10,
-      size: 10,
-      selectedRowKeys: [],
       loading: false,
       addLoading: false,
+      page: 1,
+      total: 10,
+      size: 10,
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "部门名称",
+          prop: "deptName",
+          align: "center",
+          width: "300",
+          showOverflowTooltip: true,
+        },
+        {
+          label: "材料名称",
+          slot: true,
+          prop: "materialName",
+          showOverflowTooltip: true,
+        },
+
+        {
+          label: "加入时间",
+          prop: "createTime",
+          align: "center",
+          width: "140",
+        },
+      ],
     };
   },
   computed: {
@@ -142,13 +166,15 @@ export default {
     },
     ...mapGetters(["deptList"]),
   },
+  created() {},
   methods: {
-    // 公共库材料列表
+    // 公共库材料
     async getPbuList() {
       this.loading = true;
       let res = await getPubdatumList({
-        page: this.current,
+        page: this.page,
         size: this.size,
+        deptCode: this.department,
         materiaFullName: `%${this.searchVal}%`,
       });
       this.loading = false;
@@ -156,7 +182,6 @@ export default {
         let { data, total } = res.data.data;
         this.tableData = data;
         this.total = total;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
     },
     async handleOk() {
@@ -170,34 +195,31 @@ export default {
       this.addLoading = false;
       if (code === 1) {
         this.$message.success(msg);
-        this.$refs.multipleTable.clearSelection();
-        this.Visible = false;
+        this.handleClose();
         this.$emit("ok");
       }
     },
     handleSarch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getPbuList();
     },
     resetSearch() {
-      this.current = 1;
       this.searchVal = "";
+      this.department = "";
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getPbuList();
     },
-    changePagination(cur) {
-      this.current = cur;
-      this.getPbuList();
-    },
 
-    changeSize(size) {
-      this.size = size;
-      this.getPbuList();
-    },
     handleSelectionChange(select) {
       this.selectedRowKeys = select.map((i) => i.id);
-      // console.log(select);
+    },
+    // 关闭
+    handleClose() {
+      Object.assign(this.$data, this.$options.data());
+      this.$refs.multipleTable.clearSelection();
+      this.Visible = false;
     },
   },
 };
@@ -209,7 +231,6 @@ export default {
   text-overflow: ellipsis;
   white-space: nowrap;
 }
-
 .full-name {
   color: rgb(172, 170, 170);
   overflow: hidden;

sample-form-manager-ui/admin/src/pages/software/materials/modal/FolderList.vue

@@ -45,10 +45,10 @@
       </div>
       <el-empty v-else description="暂无文件夹"></el-empty>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleClose">关 闭</el-button>
+        <el-button size="medium" @click="handleClose">关 闭</el-button>
         <el-button
           :loading="loading"
-          size="small"
+          size="medium"
           type="primary"
           @click="handleOk"
           >确 定</el-button

sample-form-manager-ui/admin/src/pages/software/materials/modal/PreviewMaterials.vue

@@ -17,7 +17,7 @@
           </div>
           <!-- 样表 -->
           <div class="sample-sheet flex1">
-            <img class="sample-sheet-img" :src="api2 + materialsPreview" />
+            <img class="sample-sheet-img" :src="materialsPreview" />
           </div>
         </div>
         <!--        <div class="right">-->
@@ -57,8 +57,6 @@ export default {
   },
   data() {
     return {
-      api: process.env.VUE_APP_API_BASE_URL + "/",
-      api2: process.env.VUE_APP_API_IMG_URL,
       val: "",
     };
   },

sample-form-manager-ui/admin/src/pages/software/matter/MatterManage.vue

@@ -15,10 +15,10 @@
           </div>
           <div slot="right" class="flex">
             <el-select
-              v-model="departmentLeft"
+              v-model="sampleformMatterTable.searchForm.deptCode"
               size="small"
-              style="width: 120px"
               placeholder="选择部门"
+              style="width: 120px"
               filterable
             >
               <!-- <template slot="prefix">
@@ -38,10 +38,10 @@
             <el-input
               size="small"
               style="width: 200px"
-              v-model="leftSearch"
-              @keyup.native.enter="searchLeft"
+              v-model="sampleformMatterTable.searchForm.matterFullName"
               class="ml10 mr10"
               placeholder="请输入事项全称搜索"
+              @keyup.native.enter="searchLeft"
             ></el-input>
             <el-button size="small" type="primary" @click="searchLeft"
               >搜 索</el-button
@@ -51,66 +51,23 @@
         </TableHeader>
         <!-- 表格 -->
         <div class="table-content">
-          <el-table
-            :data="LeftTableData"
+          <y-table
+            :data="sampleformMatterTable.data"
+            :max-height="650"
+            :column="sampleformMatterTable.columns"
             size="small"
             border
-            v-loading="loadingLeft"
+            :loading="sampleformMatterTable.loading"
             tooltip-effect="dark"
-            style="width: 100%"
-            :row-key="(row) => row.id"
             @selection-change="handleSelectionChange"
             ref="leftTable"
           >
-            <el-table-column type="selection" width="55" align="center">
-            </el-table-column>
-            <el-table-column
-              type="index"
-              label="序号"
-              width="55"
-              align="center"
-              :index="(index) => (leftCurrent - 1) * leftSize + index + 1"
-            >
-            </el-table-column>
-            <el-table-column
-              show-overflow-tooltip
-              label="部门名称"
-              align="center"
-              prop="deptName"
-            >
-            </el-table-column>
-            <el-table-column
-              prop="matterName"
-              show-overflow-tooltip
-              label="事项名称"
-            >
-              <template slot-scope="scope">
+            <template slot="matterName" slot-scope="scope">
               <p class="short">{{ scope.row.matterName }}</p>
-                <p class="full-name">
-                  事项全称：{{ scope.row.matterFullName }}
-                </p>
-              </template>
-            </el-table-column>
-            <el-table-column
-              prop="tid"
-              label="事项来源"
-              align="center"
-              width="80"
-            >
-              <template slot-scope="scope">
-                <span v-if="scope.row.source === 1">手动添加</span>
-                <span v-else-if="scope.row.source === 0">站点事项</span>
+              <p class="full-name">事项全称：{{ scope.row.matterFullName }}</p>
             </template>
-            </el-table-column>
-            <el-table-column
-              prop="total"
-              label="填单次数"
-              align="center"
-              width="80"
-            >
-            </el-table-column>
-            <el-table-column label="操作" align="center" width="160">
-              <template slot-scope="scope">
+            <!-- 操作 -->
+            <template slot="action" slot-scope="scope">
               <div class="flex jcb">
                 <div style="width: 60px">
                   <span
@@ -134,25 +91,15 @@
                 >
               </div>
             </template>
-            </el-table-column>
-          </el-table>
+          </y-table>
         </div>
-        <Pagination
-          :current="leftCurrent"
-          :size="leftSize"
-          :total="leftTotal"
-          @currentChange="leftChangePagination"
-          @sizeChange="leftChangeSize"
-        ></Pagination>
+        <y-pagination
+          :page.sync="sampleformMatterTable.page"
+          :pageSize.sync="sampleformMatterTable.size"
+          :total="sampleformMatterTable.total"
+          @change="getSampleformMatterList"
+        ></y-pagination>
       </div>
-      <!-- 新增事项 -->
-      <AddMatter
-        ref="AddMatter"
-        :addMatterVisible.sync="addMatterVisible"
-        :departmentList="deptList"
-        :title="title"
-        @addMatter="getSampleformMatterList"
-      ></AddMatter>
     </div>
     <!-- 右 -->
     <div class="right h-full bgw flex flexc">
@@ -167,10 +114,10 @@
           </div>
           <div slot="right" class="flex">
             <el-select
-              v-model="departmentRight"
+              v-model="siteMatterTable.searchForm.deptCode"
               size="small"
-              style="width: 120px"
               placeholder="选择部门"
+              style="width: 120px"
               filterable
             >
               <!-- <template slot="prefix">
@@ -190,7 +137,7 @@
             <el-input
               size="small"
               style="width: 200px"
-              v-model="rightSearch"
+              v-model="siteMatterTable.searchForm.matterName"
               class="ml10 mr10"
               placeholder="请输入事项名称搜索"
               @keyup.native.enter="handleSearchRight"
@@ -203,70 +150,45 @@
         </TableHeader>
         <!-- 表格 -->
         <div class="table-content">
-          <el-table
+          <y-table
+            :max-height="650"
+            :data="siteMatterTable.data"
+            :column="siteMatterTable.columns"
             size="small"
-            ref="rightTable"
-            :data="rightTableData"
             border
-            v-loading="loadingRight"
+            :loading="siteMatterTable.loading"
             tooltip-effect="dark"
-            style="width: 100%"
-            :row-key="(row) => row.id"
             @selection-change="handleSelectionChangeRight"
+            ref="rightTable"
           >
-            <el-table-column
-              type="selection"
-              reserve-selection
-              width="55"
-              align="center"
-            >
-            </el-table-column>
-            <el-table-column
-              type="index"
-              label="序号"
-              width="55"
-              align="center"
-              :index="(index) => (rightCurrent - 1) * rightSize + index + 1"
-            >
-            </el-table-column>
-            <el-table-column
-              show-overflow-tooltip
-              label="部门名称"
-              align="center"
-              prop="deptName"
-            >
-            </el-table-column>
-            <el-table-column
-              prop="matterName"
-              show-overflow-tooltip
-              label="事项名称"
-            >
-            </el-table-column>
-            <el-table-column width="100" align="center" label="事项来源">
-              <template slot-scope="scope">
+            <template slot="source" slot-scope="scope">
               <el-tag size="small" type="success" v-if="scope.row.source == 0"
                 >一体化添加</el-tag
               >
               <el-tag size="small" v-else>自建事项</el-tag>
             </template>
-            </el-table-column>
-            <el-table-column label="操作" align="center" width="160">
-              <template slot-scope="scope">
+            <template slot="action" slot-scope="scope">
               <span class="primary pointer" @click="handleJoin(scope.row.id)"
                 >加入</span
               >
             </template>
-            </el-table-column>
-          </el-table>
+          </y-table>
         </div>
-        <Pagination
-          :current="rightCurrent"
-          :size="rightSize"
-          :total="rightTotal"
-          @currentChange="rightChangePagination"
-          @sizeChange="rightChangeSize"
-        ></Pagination>
+        <y-pagination
+          :page.sync="siteMatterTable.page"
+          :pageSize.sync="siteMatterTable.size"
+          :total="siteMatterTable.total"
+          @change="getMatterSubList"
+        ></y-pagination>
       </div>
+      <!-- 新增事项 -->
+      <AddMatter
+        ref="AddMatter"
+        :addMatterVisible.sync="addMatterVisible"
+        :departmentList="deptList"
+        :title="title"
+        @addMatter="getSampleformMatterList"
+      ></AddMatter>
     </div>
   </div>
 </template>
@@ -274,11 +196,8 @@
 <script>
 import TableHeader from "@/components/TableHeader.vue";
 import AddMatter from "./modal/AddMatter.vue";
-import Pagination from "@/components/Pagination.vue";
-import TabHeader from "@/components/TabHeader.vue";
 import { mapGetters } from "vuex";
 import {
-  // getMatterList,
   createMatter,
   getSampleformMatterList,
   delMatter,
@@ -290,30 +209,145 @@ export default {
   components: {
     TableHeader,
     AddMatter,
-    Pagination,
-    TabHeader,
   },
   data() {
     return {
       siteId: local.getLocal("sampleSiteId")
         ? local.getLocal("sampleSiteId")
         : "",
-      departmentLeft: "",
-      departmentRight: "",
-      loadingLeft: false,
-      leftSearch: "",
-      rightSearch: "",
-      LeftTableData: [],
-      leftSelectedRowKeys: [],
-      leftCurrent: 1,
-      leftSize: 10,
-      leftTotal: 0,
-      loadingRight: false,
-      rightCurrent: 1,
-      rightSize: 10,
-      rightTotal: 0,
-      rightTableData: [],
-      rightSelectedRowKeys: [],
+      // 样表事项表格
+      sampleformMatterTable: {
+        loading: false,
+        page: 1,
+        size: 10,
+        total: 0,
+        data: [],
+        selectionKeys: [],
+        searchForm: {
+          matterFullName: "",
+          deptCode: "",
+        },
+        columns: [
+          {
+            label: "全选",
+            type: "selection",
+            width: "55",
+            align: "center",
+            reserveSelection: true,
+          },
+          {
+            label: "序号",
+            type: "index",
+            width: "55",
+            align: "center",
+            index: (index) => {
+              return (
+                (this.sampleformMatterTable.page - 1) *
+                  this.sampleformMatterTable.size +
+                index +
+                1
+              );
+            },
+          },
+          {
+            label: "部门名称",
+            prop: "deptName",
+            align: "center",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "事项名称",
+            slot: true,
+            prop: "matterName",
+            showOverflowTooltip: true,
+          },
+
+          {
+            label: "事项来源",
+            prop: "source",
+            align: "center",
+            width: "100",
+            formatter: (row) => {
+              return row.source === 0 ? "站点事项" : "手动添加";
+            },
+          },
+          // {
+          //   label: "填单次数",
+          //   prop: "total",
+          //   width: "100",
+          //   align: "center",
+          // },
+
+          {
+            label: "操作",
+            slot: true,
+            prop: "action",
+            align: "center",
+            width: "160",
+          },
+        ],
+      },
+      // 站点事项表格
+      siteMatterTable: {
+        loading: false,
+        page: 1,
+        size: 10,
+        total: 0,
+        data: [],
+        selectionKeys: [],
+        searchForm: {
+          matterName: "",
+          deptCode: "",
+        },
+        columns: [
+          {
+            label: "全选",
+            type: "selection",
+            width: "55",
+            align: "center",
+            reserveSelection: true,
+          },
+          {
+            label: "序号",
+            type: "index",
+            width: "55",
+            align: "center",
+            index: (index) => {
+              return (
+                (this.siteMatterTable.page - 1) * this.siteMatterTable.size +
+                index +
+                1
+              );
+            },
+          },
+          {
+            label: "部门名称",
+            prop: "deptName",
+            align: "center",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "事项名称",
+            prop: "matterName",
+            showOverflowTooltip: true,
+          },
+          {
+            label: "事项来源",
+            slot: true,
+            prop: "source",
+            align: "center",
+          },
+
+          {
+            label: "操作",
+            slot: true,
+            prop: "action",
+            align: "center",
+            width: "160",
+          },
+        ],
+      },
+
       addMatterVisible: false,
       title: "新增事项",
       recommendCount: "", // 推荐事项个数
@@ -329,44 +363,42 @@ export default {
   methods: {
     // 获取一体化事项列表
     async getMatterSubList() {
-      this.loadingRight = true;
+      this.siteMatterTable.loading = true;
       let res = await getMatterSubList({
-        page: this.rightCurrent,
-        size: this.rightSize,
-        matterName: `%${this.rightSearch}%`,
-        deptCode: this.departmentRight,
+        page: this.siteMatterTable.page,
+        size: this.siteMatterTable.size,
+        matterName: `%${this.siteMatterTable.searchForm.matterName}%`,
+        deptCode: this.siteMatterTable.searchForm.deptCode,
         siteId: this.siteId,
       });
-      this.loadingRight = false;
+      this.siteMatterTable.loading = false;
       if (res.data.code === 1) {
         let { total, data } = res.data.data;
-        this.rightTableData = data;
-        this.rightTotal = total;
-        this.$refs.rightTable.bodyWrapper.scrollTop = 0;
+        this.siteMatterTable.data = data;
+        this.siteMatterTable.total = total;
       }
     },
 
     // 获取样表系统事项列表
     async getSampleformMatterList() {
-      this.loadingLeft = true;
+      this.sampleformMatterTable.loading = true;
       let res = await getSampleformMatterList({
-        page: this.leftCurrent,
-        size: this.leftSize,
-        matterFullName: `%${this.leftSearch}%`,
-        deptCode: this.departmentLeft,
+        page: this.sampleformMatterTable.page,
+        size: this.sampleformMatterTable.size,
+        matterFullName: `%${this.sampleformMatterTable.searchForm.matterFullName}%`,
+        deptCode: this.sampleformMatterTable.searchForm.deptCode,
         siteId: this.siteId,
       });
-      this.loadingLeft = false;
+      this.sampleformMatterTable.loading = false;
       if (res.data.code === 1) {
         let { data, total, recommendCount } = res.data.data;
-        if (!data.length && this.leftCurrent > 1) {
-          this.leftCurrent -= 1;
+        if (!data.length && this.sampleformMatterTable.page > 1) {
+          this.sampleformMatterTable.page -= 1;
           this.getSampleformMatterList();
         }
-        this.LeftTableData = data;
-        this.leftTotal = total;
+        this.sampleformMatterTable.data = data;
+        this.sampleformMatterTable.total = total;
         this.recommendCount = recommendCount;
-        this.$refs.leftTable.bodyWrapper.scrollTop = 0;
       }
     },
     // 新增事项
@@ -396,41 +428,34 @@ export default {
     },
     // 批量删除
     handleDelAll() {
-      if (!this.leftSelectedRowKeys.length) {
+      if (!this.sampleformMatterTable.selectionKeys.length) {
         this.$message.warning("请先勾选数据");
         return;
       }
-      let ids = this.leftSelectedRowKeys.map((v) => v.id).join(",");
+      let ids = this.sampleformMatterTable.selectionKeys
+        .map((v) => v.id)
+        .join(",");
       this.handleDel(ids);
     },
     // 左边搜索
     searchLeft() {
-      this.leftCurrent = 1;
+      this.sampleformMatterTable.page = 1;
       this.$refs.leftTable.clearSelection();
       this.getSampleformMatterList();
     },
     // 左边重置
     leftReset() {
-      this.departmentLeft = "";
-      this.leftSearch = "";
-      this.leftCurrent = 1;
+      this.sampleformMatterTable.searchForm.deptCode = "";
+      this.sampleformMatterTable.searchForm.matterFullName = "";
+      this.sampleformMatterTable.page = 1;
       this.$refs.leftTable.clearSelection();
       this.getSampleformMatterList();
     },
     // 左边勾选
     handleSelectionChange(selection) {
-      this.leftSelectedRowKeys = selection;
-    },
-    // 左边翻页
-    leftChangePagination(cur) {
-      this.leftCurrent = cur;
-      this.getSampleformMatterList();
-    },
-    // 左边改变每页显示数量
-    leftChangeSize(size) {
-      this.leftSize = size;
-      this.getSampleformMatterList();
+      this.sampleformMatterTable.selectionKeys = selection;
     },
+
     // 左边删除
     handleDel(id) {
       this.$confirm(
@@ -449,7 +474,6 @@ export default {
           if (code === 1) {
             this.$message.success(msg);
             this.$refs.leftTable.clearSelection();
-            this.leftSelectedRowKeys = [];
             this.getSampleformMatterList();
             this.getMatterSubList();
           }
@@ -460,21 +484,21 @@ export default {
     },
     // 右边搜索
     handleSearchRight() {
-      this.rightCurrent = 1;
+      this.siteMatterTable.page = 1;
       this.$refs.rightTable.clearSelection();
       this.getMatterSubList();
     },
     // 右边重置
     rightReset() {
-      this.rightSearch = "";
-      this.departmentRight = "";
-      this.rightCurrent = 1;
+      this.siteMatterTable.searchForm.matterName = "";
+      this.siteMatterTable.searchForm.deptCode = "";
+      this.siteMatterTable.page = 1;
       this.$refs.rightTable.clearSelection();
       this.getMatterSubList();
     },
     // 右边勾选
     handleSelectionChangeRight(select) {
-      this.rightSelectedRowKeys = select;
+      this.siteMatterTable.selectionKeys = select;
     },
     // 右边加入
     async handleJoin(id) {
@@ -482,29 +506,19 @@ export default {
       let { code, msg } = res.data;
       if (code === 1) {
         this.$message.success(msg);
-        this.rightSelectedRowKeys = [];
         this.$refs.rightTable.clearSelection();
-        this.getMatterSubList();
         this.getSampleformMatterList();
-      }
-    },
-    // 右边翻页
-    rightChangePagination(cur) {
-      this.rightCurrent = cur;
-      this.getMatterSubList();
-    },
-    // 右边改变每页显示数量
-    rightChangeSize(size) {
-      this.rightSize = size;
         this.getMatterSubList();
+      }
     },
+
     // 批量加入
     handleAllJoin() {
-      if (!this.rightSelectedRowKeys.length) {
+      if (!this.siteMatterTable.selectionKeys.length) {
         this.$message.warning("请先勾选数据");
         return;
       }
-      let ids = this.rightSelectedRowKeys.map((v) => v.id).join(",");
+      let ids = this.siteMatterTable.selectionKeys.map((v) => v.id).join(",");
       this.handleJoin(ids);
     },
   },
@@ -527,6 +541,7 @@ export default {
     white-space: nowrap;
   }
 }
+
 // .table-content {
 //   height: 550px;
 // }

sample-form-manager-ui/admin/src/pages/software/matter/modal/AddMatter.vue

@@ -7,31 +7,33 @@
       @close="handleClose"
       :close-on-click-modal="false"
     >
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-form
+        ref="form"
+        size="medium"
+        :model="form"
+        :rules="rules"
+        label-width="80px"
+      >
         <el-form-item label="事项简称" prop="matterName">
           <el-input
-            size="small"
             v-model="form.matterName"
             placeholder="请输入事项简称"
           ></el-input>
         </el-form-item>
         <el-form-item label="事项全称" prop="matterFullName">
           <el-input
-            size="small"
             v-model="form.matterFullName"
             placeholder="请输入事项全称"
           ></el-input>
         </el-form-item>
         <el-form-item label="事项编号" prop="matterNo">
           <el-input
-            size="small"
             v-model="form.matterNo"
             placeholder="请输入事项编号"
           ></el-input>
         </el-form-item>
         <el-form-item label="选择部门" prop="deptCode">
           <el-select
-            size="small"
             ref="myselected"
             v-model="form.deptCode"
             placeholder="请选择部门"
@@ -48,8 +50,8 @@
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleRest">重 置</el-button>
-        <el-button size="small" type="primary" @click="handleOk"
+        <el-button size="medium" @click="handleRest">重 置</el-button>
+        <el-button size="medium" type="primary" @click="handleOk"
           >确 定</el-button
         >
       </span>

sample-form-manager-ui/admin/src/pages/system/parameter/Parameter.vue

@@ -26,56 +26,23 @@
     </TableHeader>
     <!-- 表格 -->
     <div class="table-content">
-      <el-table
-        ref="multipleTable"
-        v-loading="loading"
+      <y-table
+        :max-height="650"
         :data="tableData"
+        :column="columns"
         border
-        tooltip-effect="dark"
-        style="width: 100%"
-        :row-key="(row) => row.id"
+        :loading="loading"
         @selection-change="handleSelectionChange"
+        ref="multipleTable"
       >
-        <el-table-column
-          reserve-selection
-          type="selection"
-          width="55"
-          align="center"
-        >
-        </el-table-column>
-        <el-table-column
-          type="index"
-          label="序号"
-          width="55"
-          align="center"
-          :index="(index) => (current - 1) * size + index + 1"
-        >
-        </el-table-column>
-        <el-table-column label="参数名称" align="center" prop="name">
-        </el-table-column>
-        <el-table-column label="一级组织" align="center" prop="firstOrganize">
-        </el-table-column>
-        <el-table-column label="二级组织" align="center" prop="secondOrganize">
-        </el-table-column>
-        <el-table-column label="参数键" align="center" prop="paramKey">
-        </el-table-column>
-        <el-table-column label="参数值" align="center" prop="paramValue">
-        </el-table-column>
-        <el-table-column label="参数有效状态" align="center" prop="validStatus">
-          <template slot-scope="scope">
-            <el-tag
-              size="small"
-              v-if="scope.row.validStatus == 1"
-              type="success"
+        <template slot="validStatus" slot-scope="scope">
+          <el-tag size="small" v-if="scope.row.validStatus == 1" type="success"
             >有效</el-tag
           >
           <el-tag size="small" v-else type="info">禁用</el-tag>
         </template>
-        </el-table-column>
-        <el-table-column label="备注" align="center" prop="remark">
-        </el-table-column>
-        <el-table-column label="操作" align="center" width="100">
-          <template slot-scope="scope">
+
+        <template slot="action" slot-scope="scope">
           <div class="flex jca">
             <span class="primary pointer" @click="handleEdit(scope.row)"
               >编辑</span
@@ -85,16 +52,14 @@
             >
           </div>
         </template>
-        </el-table-column>
-      </el-table>
+      </y-table>
     </div>
-    <Pagination
+    <y-pagination
       :total="total"
-      :current="current"
-      :size="size"
-      @currentChange="changePagination"
-      @sizeChange="changeSize"
-    ></Pagination>
+      :page.sync="page"
+      :pageSize.sync="size"
+      @change="getParamList"
+    ></y-pagination>
     <!-- 新增参数 -->
     <AddParameter
       ref="AddParameter"
@@ -108,20 +73,18 @@
 
 <script>
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
 import AddParameter from "./modal/AddParameter.vue";
 import { getParamList, delParam } from "@/api/system";
 export default {
   components: {
     TableHeader,
     AddParameter,
-    Pagination,
   },
   data() {
     return {
       searchVal: "",
       tableData: [],
-      current: 1,
+      page: 1,
       size: 10,
       total: 10,
       loading: false,
@@ -129,6 +92,69 @@ export default {
       addVisible: false,
       title: "新增参数",
       dict: {}, // 字典
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "参数名称",
+          prop: "name",
+          align: "center",
+        },
+        {
+          label: "一级组织",
+          prop: "firstOrganize",
+          align: "center",
+        },
+        {
+          label: "二级组织",
+          prop: "secondOrganize",
+          align: "center",
+        },
+        {
+          label: "参数键",
+          prop: "secondOrganize",
+          align: "center",
+        },
+        {
+          label: "参数值",
+          prop: "paramKey",
+          align: "center",
+        },
+        {
+          label: "参数有效状态",
+          slot: true,
+          prop: "validStatus",
+          align: "center",
+        },
+
+        {
+          label: "备注",
+          prop: "remark",
+          align: "center",
+        },
+
+        {
+          label: "操作",
+          slot: true,
+          prop: "action",
+          align: "center",
+          width: "100",
+        },
+      ],
     };
   },
   created() {
@@ -140,20 +166,19 @@ export default {
     async getParamList() {
       this.loading = true;
       let res = await getParamList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         name: `%${this.searchVal}%`,
       });
       if (res.data.code == 1) {
         let { data, total, dict } = res.data.data;
         this.dict = dict;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getParamList();
         }
         this.tableData = data;
         this.total = total;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
       this.loading = false;
     },
@@ -169,14 +194,14 @@ export default {
     },
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getParamList();
     },
     // 重置
     handleReset() {
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getParamList();
     },
@@ -184,16 +209,7 @@ export default {
     handleSelectionChange(select) {
       this.selectKeys = select;
     },
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getParamList();
-    },
-    // 改变没有显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getParamList();
-    },
+
     // 新增
     handleAdd() {
       this.title = "新增参数";
@@ -221,7 +237,6 @@ export default {
             this.$message.success(msg);
             this.getParamList();
             this.$refs.multipleTable.clearSelection();
-            this.selectKeys = [];
           }
         })
         .catch(() => {

sample-form-manager-ui/admin/src/pages/system/parameter/modal/AddParameter.vue

@@ -2,44 +2,43 @@
   <div>
     <el-dialog
       :title="title"
+      :destroy-on-close="true"
       :visible.sync="Visible"
       width="30%"
       @close="handleClose"
       :close-on-click-modal="false"
       top="10vh"
     >
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        size="medium"
+        label-width="100px"
+      >
         <el-form-item label="参数名称" prop="name">
-          <el-input
-            size="small"
-            v-model="form.name"
-            placeholder="请输入参数名称"
-          ></el-input>
+          <el-input v-model="form.name" placeholder="请输入参数名称"></el-input>
         </el-form-item>
         <el-form-item label="一级组织" prop="firstOrganize">
           <el-input
-            size="small"
             v-model="form.firstOrganize"
             placeholder="请输入一级组织"
           ></el-input>
         </el-form-item>
         <el-form-item label="二级组织" prop="secondOrganize">
           <el-input
-            size="small"
             v-model="form.secondOrganize"
             placeholder="请输入二级组织"
           ></el-input>
         </el-form-item>
         <el-form-item label="参数键" prop="paramKey">
           <el-input
-            size="small"
             v-model="form.paramKey"
             placeholder="请输入参数键"
           ></el-input>
         </el-form-item>
         <el-form-item label="参数值" prop="paramValue">
           <el-input
-            size="small"
             v-model="form.paramValue"
             placeholder="请输入参数值"
           ></el-input>
@@ -88,8 +87,8 @@
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleRest">重 置</el-button>
-        <el-button size="small" type="primary" @click="handleOk"
+        <el-button size="medium" @click="handleRest">重 置</el-button>
+        <el-button size="medium" type="primary" @click="handleOk"
           >确 定</el-button
         >
       </span>

sample-form-manager-ui/admin/src/pages/system/systemlogs/SystemLogs.vue

@@ -18,74 +18,103 @@
     </TableHeader>
     <!-- 表格 -->
     <div class="table-content">
-      <el-table
-        ref="multipleTable"
-        size="small"
-        v-loading="loading"
+      <y-table
+        :max-height="650"
         :data="tableData"
+        :column="columns"
         border
-        tooltip-effect="dark"
-        style="width: 100%"
-        :row-key="(row) => row.id"
-      >
-        <el-table-column
-          type="index"
-          label="序号"
-          width="55"
-          align="center"
-          :index="(index) => (current - 1) * size + index + 1"
+        :loading="loading"
+        ref="multipleTable"
       >
-        </el-table-column>
-        <el-table-column label="用户名称" align="center" prop="userName">
-        </el-table-column>
-        <el-table-column label="登录名称" align="center" prop="loginName">
-        </el-table-column>
-        <el-table-column label="请求地址" align="center" prop="requestUrl">
-        </el-table-column>
-        <el-table-column label="操作内容" align="center" prop="content">
-        </el-table-column>
-        <el-table-column label="操作IP地址" align="center" prop="ip">
-        </el-table-column>
-        <el-table-column label="操作类型" align="center" prop="operType">
-          <template slot-scope="scope">
+        <template slot="operType" slot-scope="scope">
           <span v-if="scope.row.operType == 0">新增</span>
           <span v-else-if="scope.row.operType == 1">修改</span>
           <span v-else-if="scope.row.operType == 2">删除</span>
         </template>
-        </el-table-column>
-        <el-table-column label="操作时间" align="center" prop="logDate">
-        </el-table-column>
-      </el-table>
+      </y-table>
     </div>
-    <Pagination
+    <y-pagination
       :total="total"
-      :current="current"
-      :size="size"
-      @currentChange="changePagination"
-      @sizeChange="changeSize"
-    ></Pagination>
+      :page.sync="page"
+      :pageSize.sync="size"
+      @change="getlogsList"
+    ></y-pagination>
   </div>
 </template>
 
 <script>
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
 import { getlogsList } from "@/api/system";
 export default {
   components: {
     TableHeader,
-    Pagination,
   },
   data() {
     return {
       searchVal: "",
       tableData: [],
-      current: 1,
+      page: 1,
       size: 10,
       total: 10,
       loading: false,
       selectKeys: [],
       dict: {}, // 字典
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "用户名称",
+          prop: "userName",
+          align: "center",
+        },
+        {
+          label: "登录名称",
+          prop: "loginName",
+          align: "center",
+        },
+        {
+          label: "请求地址",
+          prop: "requestUrl",
+          align: "center",
+        },
+        {
+          label: "操作内容",
+          slot: true,
+          prop: "content",
+          align: "center",
+        },
+        {
+          label: "操作IP地址",
+          prop: "ip",
+          align: "center",
+        },
+        {
+          label: "操作类型",
+          slot: true,
+          prop: "operType",
+          align: "center",
+        },
+
+        {
+          label: "操作时间",
+          prop: "logDate",
+          align: "center",
+        },
+      ],
     };
   },
   created() {
@@ -97,48 +126,36 @@ export default {
     async getlogsList() {
       this.loading = true;
       let res = await getlogsList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         requestUrl: `%${this.searchVal}%`,
       });
       if (res.data.code == 1) {
         let { data, total, dict } = res.data.data;
         this.dict = dict;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getlogsList();
         }
         this.tableData = data;
         this.total = total;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
       this.loading = false;
     },
 
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getlogsList();
     },
     // 重置
     handleReset() {
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getlogsList();
     },
-
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getlogsList();
-    },
-    // 改变没有显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getlogsList();
-    },
   },
 };
 </script>

sample-form-manager-ui/admin/src/pages/system/task/TaskSet.vue

@@ -26,66 +26,28 @@
     </TableHeader>
     <!-- 表格 -->
     <div class="table-content">
-      <el-table
-        ref="multipleTable"
-        v-loading="loading"
+      <y-table
+        :max-height="650"
         :data="tableData"
+        :column="columns"
         border
-        tooltip-effect="dark"
-        style="width: 100%"
-        :row-key="(row) => row.id"
+        :loading="loading"
         @selection-change="handleSelectionChange"
+        ref="multipleTable"
       >
-        <el-table-column
-          reserve-selection
-          type="selection"
-          width="55"
-          align="center"
-        >
-        </el-table-column>
-        <el-table-column
-          type="index"
-          label="序号"
-          width="55"
-          align="center"
-          :index="(index) => (current - 1) * size + index + 1"
-        >
-        </el-table-column>
-        <el-table-column label="任务名称" align="center" prop="name">
-        </el-table-column>
-        <el-table-column label="执行主机" align="center" prop="excuteHost">
-        </el-table-column>
-        <el-table-column label="执行关键字" align="center" prop="taskKey">
-        </el-table-column>
-        <el-table-column label="执行策略" align="center" prop="excuteStrategy">
-          <template slot-scope="scope">
-            <el-tag type="info">{{
-              filterItems(scope.row.excuteStrategy, dict.excuteStrategy)
+        <template slot="excuteStrategy" slot-scope="scope">
+          <el-tag size="small" type="info">{{
+            dict.excuteStrategy[scope.row.excuteStrategy]
           }}</el-tag>
         </template>
-        </el-table-column>
-        <el-table-column
-          label="最后执行主机"
-          align="center"
-          prop="lastExcuteHost"
-        >
-        </el-table-column>
-        <el-table-column
-          label="最后执行时间"
-          align="center"
-          prop="lastExcuteTime"
-        >
-        </el-table-column>
-        <el-table-column label="任务状态" align="center" prop="status">
-          <template slot-scope="scope">
-            <!-- <el-tag v-if="scope.row.status == 1" type="success">执行中</el-tag> -->
+
+        <template slot="status" slot-scope="scope">
           <el-tag size="small" type="info">{{
-              filterItems(scope.row.status, dict.status)
+            dict.status[scope.row.status]
           }}</el-tag>
         </template>
-        </el-table-column>
-        <el-table-column label="操作" align="center" width="100">
-          <template slot-scope="scope">
+
+        <template slot="action" slot-scope="scope">
           <div class="flex jca">
             <span class="primary pointer" @click="handleEdit(scope.row)"
               >编辑</span
@@ -95,16 +57,14 @@
             >
           </div>
         </template>
-        </el-table-column>
-      </el-table>
+      </y-table>
     </div>
-    <Pagination
+    <y-pagination
       :total="total"
-      :current="current"
-      :size="size"
-      @currentChange="changePagination"
-      @sizeChange="changeSize"
-    ></Pagination>
+      :page="page"
+      :pageSize="size"
+      @change="getTaskList"
+    ></y-pagination>
     <!-- 新增参数 -->
     <AddTask
       ref="AddTask"
@@ -118,20 +78,18 @@
 
 <script>
 import TableHeader from "@/components/TableHeader.vue";
-import Pagination from "@/components/Pagination.vue";
 import AddTask from "./modal/AddTask.vue";
 import { getTaskList, delTask } from "@/api/system";
 export default {
   components: {
     TableHeader,
     AddTask,
-    Pagination,
   },
   data() {
     return {
       searchVal: "",
       tableData: [],
-      current: 1,
+      page: 1,
       size: 10,
       total: 10,
       loading: false,
@@ -139,6 +97,71 @@ export default {
       addVisible: false,
       title: "新增参数",
       dict: {}, // 字典
+      columns: [
+        {
+          label: "全选",
+          type: "selection",
+          width: "55",
+          align: "center",
+          reserveSelection: true,
+        },
+        {
+          label: "序号",
+          type: "index",
+          width: "55",
+          align: "center",
+          index: (index) => {
+            return (this.page - 1) * this.size + index + 1;
+          },
+        },
+        {
+          label: "任务名称",
+          prop: "name",
+          align: "center",
+        },
+        {
+          label: "执行主机",
+          prop: "excuteHost",
+          align: "center",
+        },
+        {
+          label: "执行关键字",
+          prop: "taskKey",
+          align: "center",
+        },
+        {
+          label: "执行策略",
+          slot: true,
+          prop: "excuteStrategy",
+          align: "center",
+        },
+        {
+          label: "最后执行主机",
+          prop: "lastExcuteHost",
+          align: "center",
+        },
+        {
+          label: "最后执行时间",
+
+          prop: "lastExcuteTime",
+          align: "center",
+        },
+
+        {
+          label: "任务状态",
+          slot: true,
+          prop: "status",
+          align: "center",
+        },
+
+        {
+          label: "操作",
+          slot: true,
+          prop: "action",
+          align: "center",
+          width: "100",
+        },
+      ],
     };
   },
   created() {
@@ -150,20 +173,19 @@ export default {
     async getTaskList() {
       this.loading = true;
       let res = await getTaskList({
-        page: this.current,
+        page: this.page,
         size: this.size,
         name: `%${this.searchVal}%`,
       });
       if (res.data.code == 1) {
         let { data, total, dict } = res.data.data;
         this.dict = dict;
-        if (!data.length && this.current > 1) {
-          this.current -= 1;
+        if (!data.length && this.page > 1) {
+          this.page -= 1;
           this.getTaskList();
         }
         this.tableData = data;
         this.total = total;
-        this.$refs.multipleTable.bodyWrapper.scrollTop = 0;
       }
       this.loading = false;
     },
@@ -179,14 +201,14 @@ export default {
     },
     // 搜索
     handleSearch() {
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getTaskList();
     },
     // 重置
     handleReset() {
       this.searchVal = "";
-      this.current = 1;
+      this.page = 1;
       this.$refs.multipleTable.clearSelection();
       this.getTaskList();
     },
@@ -194,16 +216,7 @@ export default {
     handleSelectionChange(select) {
       this.selectKeys = select;
     },
-    // 翻页
-    changePagination(cur) {
-      this.current = cur;
-      this.getTaskList();
-    },
-    // 改变没有显示数量
-    changeSize(size) {
-      this.size = size;
-      this.getTaskList();
-    },
+
     // 新增
     handleAdd() {
       this.title = "新增任务";
@@ -231,23 +244,12 @@ export default {
             this.$message.success(msg);
             this.getTaskList();
             this.$refs.multipleTable.clearSelection();
-            this.selectKeys = [];
           }
         })
         .catch(() => {
           console.log("取消成功！");
         });
     },
-    // 过滤表格数据
-    filterItems(key, dict = {}) {
-      let val = "";
-      Object.keys(dict).forEach((keys) => {
-        if (key == keys) {
-          val = dict[keys];
-        }
-      });
-      return val;
-    },
   },
 };
 </script>

sample-form-manager-ui/admin/src/pages/system/task/modal/AddTask.vue

@@ -2,30 +2,31 @@
   <div>
     <el-dialog
       :title="title"
+      :destroy-on-close="true"
       :visible.sync="Visible"
       width="30%"
       @close="handleClose"
       :close-on-click-modal="false"
       top="10vh"
     >
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form
+        ref="form"
+        :model="form"
+        :rules="rules"
+        size="medium"
+        label-width="100px"
+      >
         <el-form-item label="任务名称" prop="name">
-          <el-input
-            size="small"
-            v-model="form.name"
-            placeholder="请输入任务名称"
-          ></el-input>
+          <el-input v-model="form.name" placeholder="请输入任务名称"></el-input>
         </el-form-item>
         <el-form-item label="关键字" prop="taskKey">
           <el-input
-            size="small"
             v-model="form.taskKey"
             placeholder="请输入关键字"
           ></el-input>
         </el-form-item>
         <el-form-item label="执行服务" prop="excuteService">
           <el-input
-            size="small"
             v-model="form.excuteService"
             placeholder="请输入执行服务"
           ></el-input>
@@ -53,7 +54,6 @@
           <el-input
             disabled
             v-if="form.excuteStrategy == 1"
-            size="small"
             value="每日"
             placeholder="请输入参数值"
           ></el-input>
@@ -100,14 +100,12 @@
         </el-form-item>
         <el-form-item label="执行主机" prop="excuteHost">
           <el-input
-            size="small"
             v-model="form.excuteHost"
             placeholder="请输入执行主机"
           ></el-input>
         </el-form-item>
         <el-form-item label="执行参数" prop="excuteParam">
           <el-input
-            size="small"
             v-model="form.excuteParam"
             placeholder="请输入执行参数"
           ></el-input>
@@ -123,8 +121,8 @@
         </el-form-item>
       </el-form>
       <span slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleRest">重 置</el-button>
-        <el-button size="small" type="primary" @click="handleOk"
+        <el-button size="medium" @click="handleRest">重 置</el-button>
+        <el-button size="medium" type="primary" @click="handleOk"
           >确 定</el-button
         >
       </span>

sample-form-manager-ui/admin/src/utils/request.js

@@ -2,12 +2,13 @@
  *  axios 工具函数层
  */
 import axios from "axios";
-import { Message } from "element-ui";
+import { responseErr, loginErr } from "@/config";
+import { message } from "@/utils/resetMessage";
 // import local from "@/utils/local";
 import store from "@/store";
-// import router from "@/router"
+// import router from "@/router";
 // 请求超时时间
-// axios.defaults.timeout = 10 * 1000;
+axios.defaults.timeout = 60 * 1000;
 
 // 设置统一服务器地址
 axios.defaults.baseURL = process.env.VUE_APP_API_BASE_URL;
@@ -33,14 +34,15 @@ axios.interceptors.response.use(
       // 取出数据
       let { code, msg } = response.data;
       if (code === -1) {
-        Message.error({
+        message.error({
           message: msg,
         });
-      } else if (code === 401) {
-        Message.error({
+      } else if (loginErr.includes(code)) {
+        message.error({
           message: msg,
         });
         setTimeout(() => {
+          // router.push("/login");
           store.commit("SET_token", "");
           location.href = process.env.VUE_APP_API_portal_URL;
         }, 2000);
@@ -48,13 +50,22 @@ axios.interceptors.response.use(
     }
     return response;
   },
-  (err) => {
-    // if (err.message.includes("timeout")) {
-    //   Message.error({
-    //     message: "请求超时，请稍后再试",
-    //   });
-    // }
-    return Promise.reject(err);
+  (error) => {
+    if (error && error.response) {
+      let msg = responseErr[error.response.status];
+      error.message = msg || `连接错误${error.response.status}`;
+    } else {
+      if (JSON.stringify(error).includes("timeout")) {
+        error.message = "服务器响应超时，请刷新当前页";
+      } else {
+        error.message = "连接服务器失败";
+      }
+    }
+    message.error({
+      message: error.message,
+    });
+
+    return Promise.resolve(error.response);
   }
 );
 

sample-form-manager-ui/admin/vue.config.js

@@ -9,4 +9,18 @@ module.exports = defineConfig({
   // 打包输出目录
   outputDir: "dist",
   publicPath: "./",
+  devServer: {
+    proxy: {
+      "/sampleform": {
+        target: process.env.VUE_APP_API_BASE_URL,
+        changeOrigin: true,
+        secure: false,
+        cookieDomainRewrite: "localhost",
+      },
+      "/file": {
+        target: process.env.VUE_APP_API_BASE_URL,
+        changeOrigin: true,
+      },
+    },
+  },
 });