点击蒙版关闭预览图片

src/icons/svg/shangchuan.svg

+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M22 12C22 11.4477 21.5523 11 21 11C20.4477 11 20 11.4477 20 12H22ZM12 4C12.5523 4 13 3.55229 13 3C13 2.44771 12.5523 2 12 2V4ZM19.5 20H4.5V22H19.5V20ZM4 19.5V4.5H2V19.5H4ZM20 12V19.5H22V12H20ZM4.5 4H12V2H4.5V4ZM4.5 20C4.22386 20 4 19.7761 4 19.5H2C2 20.8807 3.11928 22 4.5 22V20ZM19.5 22C20.8807 22 22 20.8807 22 19.5H20C20 19.7761 19.7761 20 19.5 20V22ZM4 4.5C4 4.22386 4.22385 4 4.5 4V2C3.11929 2 2 3.11928 2 4.5H4Z" fill="#0057FF"/>
+<path d="M3 17.5L8.34655 12.599C8.71945 12.2572 9.28895 12.2477 9.67305 12.5769L16 18" stroke="#0057FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M14 15.4999L16.3867 13.1132C16.7386 12.7613 17.2957 12.7217 17.6938 13.0203L21 15.4999" stroke="#0057FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18.5 9V3" stroke="#0057FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M16 5.5L18.5 3L21 5.5" stroke="#0057FF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

src/utils/commonField.js

+/** 公共字段*/
+const commonField = {
+  typeParent: 'text',
+  typePrimary: 'primary',
+  typeSuccess: 'success',
+  typeWarning: 'warning',
+  queryClass: 'queryBtn', // 查询按钮class
+  resetClass: 'resetBtn', // 重置按钮class
+  addClass: 'addBtn', // 新增按钮class
+  updateClass: 'updateBtn', // 修改按钮class
+  delClass: 'delBtn', // 删除按钮class
+  importClass: 'importBtn', // 导入按钮class
+  exportClass: 'exportBtn', // 导出按钮class
+  addClassText: 'addBtnText', // 文字类型的新增按钮class
+  resetPasClass: 'resetBtnText', // 文字类型的重置按钮class
+  queryName: '查询',
+  resetName: '重置',
+  addName: '新增',
+  updateName: '修改',
+  deleteName: '删除',
+  dataPower: '数据权限',
+  resetPassword: '重置密码',
+  exportName: '导出',
+  importName: '导入',
+  cleanName: '清空',
+  viewName: '查看',
+  size: 'mini',
+  smallSize: 'small',
+  queryIcon: 'el-icon-search',
+  resetIcon: 'el-icon-refresh',
+  addIcon: 'el-icon-plus',
+  delIcon: 'el-icon-delete',
+  importIcon: 'el-icon-upload',
+  exportIcon: 'el-icon-download',
+  deleteTypePrimary: 'danger',
+  deleteSize: 'small',
+  deleteDisabled: 'ids.length === 0',
+  cleanTypePrimary: 'danger',
+  cleanSize: 'small',
+  miniSize: 'mini',
+  exportTypePrimary: 'success',
+  exportSize: 'small',
+  typeText: 'text'
+}
+
+export default commonField

src/views/check/oneTbale.vue

+<template>
+  <div class="oneCheckTbale">
+    <div class="search" style="border-bottom: 14px solid #f4f4f4">
+      <el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
+        <el-form-item label="厂家" prop="value1">
+          <el-input
+            v-model="queryParams.value1"
+            placeholder="请输入厂家"
+            clearable
+            :maxlength="30"
+            size="small"
+            style="width: 150px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <!--          //查询按钮-->
+          <el-button
+            :class="commonField.queryClass"
+            :type="commonField.typePrimary"
+            :icon="commonField.queryIcon"
+            :size="commonField.smallSize"
+            @click="handleQuery"
+          >{{ commonField.queryName }}</el-button>
+          <!--          //重置按钮-->
+          <el-button
+            :class="commonField.resetClass"
+            :icon="commonField.resetIcon"
+            :size="commonField.smallSize"
+            @click="resetQuery"
+          >{{ commonField.resetName }}</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="table" style="padding:5px 10px">
+      <div class="tableTitle">检查表列表</div>
+      <el-table v-loading="loading" border :data="roleList">
+        <el-table-column type="index" label="序号" width="90" />
+        <el-table-column label="名称" prop="value1" :show-overflow-tooltip="true">
+          <template slot-scope="scope">
+            {{ scope.row.value1 || '-' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="权限字符" prop="value2">
+          <template slot-scope="scope">
+            {{ scope.row.value2 || '-' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="显示顺序" prop="value3">
+          <template slot-scope="scope">
+            {{ scope.row.value3 || '-' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="创建时间" :show-overflow-tooltip="true" align="center" prop="createTime">
+          <template slot-scope="scope">
+            <span>{{ scope.row.createDate | transformDateByFormat('YYYY-MM-DD HH:mm') }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" class-name="small-padding fixed-width" width="200px">
+          <template slot-scope="scope">
+            <!--              审核-->
+            <el-button
+              :class="commonField.updateClass"
+              :type="commonField.typeParent"
+              :size="commonField.size"
+              @click="handleUpdate(scope.row)"
+            >审核</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+import commonField from '@/utils/commonField'
+
+export default {
+  name: 'OneTbale',
+  data() {
+    return {
+      loading: false,
+      roleList: [
+        {
+          value1: '1',
+          value2: '2',
+          value3: '3',
+          createDate: '2023-01-23 09:33'
+        }
+      ],
+      // 查询参数
+      queryParams: {
+        page: 1,
+        rows: 10,
+        value1: '',
+        value2: '',
+        value3: ''
+      }
+    }
+  },
+  computed: {
+    commonField() {
+      return commonField
+    }
+  },
+  methods: {
+    handleUpdate() {
+      this.$router.push({
+        path: '/checkList'
+      })
+    },
+    handleQuery() {
+
+    },
+    resetQuery() {
+
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.oneCheckTbale{
+   .tableTitle{
+     margin: 20px 0;
+     color: #333333;
+     font-size: 14px;
+     font-family: Microsoft YaHei, Microsoft YaHei-700;
+     font-weight: 700;
+     text-align: LEFT;
+   }
+}
+</style>