安全责任书

src/views/safetyBook/dialog.edit.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="rule-type">
     <DialogCom
-      :title="id ? '编辑安全责任书' : '新增安全责任书'"
+      :title="id ? '编辑安全责任书存档记录' : '新增安全责任书存档记录'"
       :visible.sync="isShow"
       @close="onHide"
       width="800px"
@@ -16,16 +16,26 @@
           label-width="180px"
           label-prefix=":"
         >
-          <el-form-item prop="orgId" label="签署责任人所在机构:">
+          <el-form-item prop="orgId" label="签署人所在机构:">
             <tree-select
               v-model="formData.orgId"
               :options="deptOptions"
               :show-count="true"
               :normalizer="tenantIdnormalizer"
               :props="{ checkStrictly: true, label: 'name' }"
-              placeholder="请选择签署责任人所在机构"
+              placeholder="请选择签署人所在机构"
             />
           </el-form-item>
+          <el-form-item label="所属年度" prop="year">
+                <el-date-picker
+                  v-model="formData.year"
+                  :clearable="timeClearable"
+                  type="year"
+                  placeholder="请选择责任书所属年度"
+                  value-format="yyyy"
+                >
+                </el-date-picker>
+              </el-form-item>
           <el-form-item prop="type" label="签署责任书类型:">
             <el-select
               v-model="formData.type"
@@ -41,10 +51,10 @@
             </el-select>
           </el-form-item>
         </el-form>
-        <el-button @click="openSelect">新增签署</el-button>
+        <el-button @click="openSelect">上传签署文件</el-button>
 
-        <el-table :data="tableData" style="width: 100%" height="400px">
-          <el-table-column prop="names" label="姓名">
+        <el-table :data="tableData" style="width: 100%;margin-top: 10px;" height="500px">
+          <el-table-column prop="names" label="签署人">
             <template slot-scope="scope">
               <template v-for="item in scope.row.names">
                 {{ item }}
@@ -71,7 +81,7 @@
         </el-table>
       </div>
 
-      <div slot="footer" class="dialog-footer">
+      <div slot="footer" class="dialog-footer" style="margin-top: 10px;">
         <el-button @click="isShow = false">取消</el-button>
         <el-button type="primary" @click="onSubmit">确定</el-button>
       </div>
@@ -103,6 +113,7 @@ export default {
       formDataRules: {
         orgId: [{ required: true, message: "请选择签署责任人所在机构" }],
         type: [{ required: true, message: "请选择签署责任书类型" }],
+        year: [{ required: true, message: "请选择所属年度" }],
       },
     };
   },
@@ -146,6 +157,7 @@ export default {
       return {
         id: null,
         type: null,
+        year:null,
       };
     },
     async refresh(id) {

src/views/safetyBook/index.vue

@@ -1,8 +1,7 @@
 <template>
   <div class="app-container">
-    <el-row :gutter="20">
-      <!--机构数据-->
-      <el-col :span="4" :xs="24">
+    <!--机构数据-->
+    <!-- <el-col :span="4" :xs="24" v-if="false">
         <org-tree
           v-model="queryParams.orgId"
           @defaultKey="getDefaultKey"
@@ -10,141 +9,179 @@
           @click="clickTreeNode"
           wholeTree
         ></org-tree>
-      </el-col>
-      <!--用户数据-->
-      <el-col :span="20" :xs="24">
-        <div class="main-right-box">
-          <!--    搜索条件    -->
-          <div class="main-search-box">
-            <el-form
-              :model="queryParams"
-              ref="queryForm"
-              size="small"
-              :inline="true"
-              v-show="showSearch"
-              label-width="120px"
-            >
-              <el-form-item label="所属年份" prop="year">
+      </el-col> -->
+    <!--用户数据-->
+    <div class="main-right-box">
+      <!--    搜索条件    -->
+      <div class="main-search-box">
+        <el-form
+          :model="queryParams"
+          ref="queryForm"
+          size="small"
+          :inline="true"
+          v-show="showSearch"
+        >
+          <el-row :gutter="50">
+            <el-col :span="6" :xs="14">
+              <el-form-item prop="type" label="签署类型">
+                <el-select
+                  prop="type"
+                  label="签署类型"
+                  v-model="queryParams.type"
+                  placeholder="请选择签署类型"
+                  clearable
+                >
+                  <el-option
+                    v-for="dict in dict.type.safety_book_type"
+                    :key="dict.value"
+                    :label="dict.label"
+                    :value="dict.value"
+                  />
+                </el-select>
+              </el-form-item>
+            </el-col>
+            <el-col :span="6" :xs="24">
+              <el-form-item label="所属年度" prop="year">
                 <el-date-picker
                   v-model="queryParams.year"
                   :clearable="timeClearable"
                   type="year"
                   placeholder="选择时间"
                   value-format="yyyy"
-                  @change="handleQuery"
                 >
                 </el-date-picker>
               </el-form-item>
-            </el-form>
+            </el-col>
+            <el-col :span="6" :xs="24">
+              <el-form-item label="签署机构" prop="orgId" class="formTreeItem">
+                <tree-select
+                  v-model="queryParams.orgId"
+                  :options="deptOptions"
+                  :show-count="true"
+                  :normalizer="tenantIdnormalizer"
+                  :props="{ checkStrictly: true, label: 'name' }"
+                  placeholder="请选择签署机构"
+                  clearValueText="清除"
+                  :noChildrenText="''"
+                  noOptionsText="没有数据"
+                  noResultsText="没有搜索结果"
+                />
+              </el-form-item>
+            </el-col>
+          </el-row>
+        </el-form>
 
-            <el-row :gutter="10" class="mb8">
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+                <el-button
+                  type="primary"
+                  icon="el-icon-search"
+                  size="mini"
+                  @click="getList"
+                  >搜索</el-button
+                >
+              </el-col>
               <el-col :span="1.5">
                 <el-button
                   type="primary"
-                  icon="el-icon-plus"
+                  icon="el-icon-refresh"
                   size="mini"
-                  @click="handleAdd(null)"
-                  v-hasPermi="['core:book:add']"
-                  >新增
-                </el-button>
+                  @click="resetQuery"
+                  >重置</el-button
+                >
               </el-col>
+          <el-col :span="1.5">
+            <el-button
+              type="primary"
+              icon="el-icon-plus"
+              size="mini"
+              @click="handleAdd(null)"
+              v-hasPermi="['core:book:add']"
+              >新增
+            </el-button>
+          </el-col>
 
-              <right-toolbar
-                :showSearch.sync="showSearch"
-                @queryTable="getList"
-              ></right-toolbar>
-            </el-row>
-          </div>
-        <!-- 表格数据 -->
-        <el-table
-          border
-          height="700"
-          size="small"
-          v-loading="loading"
-          :data="dataList"
-        >
-          <el-table-column
-            label="序号"
-            type="index"
-            align="center"
-            width="60"
-          />
-          <el-table-column
-            label="签署机构"
-            align="left"
-            width="200"
-            prop="orgName"
-          />
-          <el-table-column
-            label="签署类型"
-            align="left"
-            width="160"
-            prop="type"
-          >
-
+          <right-toolbar
+            :showSearch.sync="showSearch"
+            @queryTable="getList"
+          ></right-toolbar>
+        </el-row>
+      </div>
+      <!-- 表格数据 -->
+      <el-table
+        border
+        height="700"
+        size="small"
+        v-loading="loading"
+        :data="dataList"
+      >
+        <el-table-column label="序号" type="index" align="center" width="60" />
+        <el-table-column
+          label="签署机构"
+          align="left"
+          width="400"
+          prop="orgName"
+        />
+        <el-table-column label="签署类型" align="left" width="300" prop="type">
           <template slot-scope="r"
-              >{{
-                getLabel(dict.type.safety_book_type, `${r.row.type}`)
-              }}
-            </template>
+            >{{ getLabel(dict.type.safety_book_type, `${r.row.type}`) }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="所属年度"
+          align="center"
+          width="200"
+          prop="year"
+        />
+        <el-table-column v-if="false" label="签署人" align="center" prop="userName">
         </el-table-column>
-          <el-table-column
-            label="责任书所属年份"
-            align="center"
-            width="140"
-            prop="year"
-          />
-          <el-table-column label="签署人" align="center" prop="userName">
-          </el-table-column>
-          <el-table-column label="签署时间" align="center" prop="createTime" />
+        <el-table-column label="签署时间" align="center" prop="createTime" />
 
-          <el-table-column
-            label="操作"
-            width="180"
-            fixed="right"
-            align="center"
-            class-name="small-padding fixed-width"
-          >
-            <template slot-scope="scope">
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-edit-outline"
-                @click="handleAdd(scope.row.id)"
-                v-hasPermi="['core:book:add']"
-                >编辑
-              </el-button>
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-info"
-                @click="handleInfo(scope.row)"
-                v-hasPermi="['core:book:query']"
-                v-if="false"
-                >详情
-              </el-button>
-              <el-button
-                size="mini"
-                type="text"
-                icon="el-icon-delete"
-                @click="handleDelete(scope.row)"
-                v-hasPermi="['core:book:remove']"
-                >删除
-              </el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+        <el-table-column
+          label="操作"
+          width="250"
+          fixed="right"
+          align="center"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="scope">
+             <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-info"
+              @click="handleInfo(scope.row)"
+              v-hasPermi="['core:book:query']"
+              >详情
+            </el-button>
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-edit-outline"
+              @click="handleAdd(scope.row.id)"
+              v-hasPermi="['core:book:add']"
+              >编辑
+            </el-button>
+           
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-delete"
+              @click="handleDelete(scope.row)"
+              v-hasPermi="['core:book:remove']"
+              >删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
 
-        <pagination
-          v-show="total > 0"
-          :total="total"
-          :page.sync="queryParams.pageNum"
-          :limit.sync="queryParams.pageSize"
-          @pagination="getList"
-        />
-        </div>
-      </el-col>
-    </el-row>
+      <pagination
+        v-show="total > 0"
+        :total="total"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+    </div>
     <dialog-edit ref="editDialog" @success="getList()"></dialog-edit>
   </div>
 </template>
@@ -156,7 +193,7 @@ import {
   editOrAdd,
   delSafetyBook,
 } from "@/api/safetyBook/index";
-import {  getLabel } from "@/views/commonOption";
+import { getLabel } from "@/views/commonOption";
 import DialogEdit from "./dialog.edit";
 import { deptTreeSelect } from "@/api/system/public";
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
@@ -164,13 +201,11 @@ import OrgTree from "@/components/orgTree/index.vue";
 import kOrgTree from "@/components/k-orgTree/index.vue";
 import KFileUpload from "@/components/K-FileUpload/index.vue";
 import tableList from "@/mixins/tableList";
-
+import orgTree from "@/components/orgTree";
 export default {
-  dicts: [
-    "safety_book_type"
-  ],
+  dicts: ["safety_book_type"],
   name: "safetyBook",
-  components: { OrgTree, kOrgTree, KFileUpload, DialogEdit },
+  components: { OrgTree, kOrgTree, KFileUpload, DialogEdit, orgTree },
   mixins: [tableList],
   data() {
     return {
@@ -193,7 +228,7 @@ export default {
       // 是否显示弹出层
       open: false,
       // 机构树选项
-      deptOptions: undefined,
+      deptOptions: [],
       // 机构名称
       deptName: undefined,
       //是否关联下级
@@ -212,6 +247,7 @@ export default {
         orgId: null,
         year: null,
         searchOrgId: null,
+        type:null,
       },
       // 表单参数
       form: {},
@@ -317,13 +353,29 @@ export default {
         this.title = "安全责任书详情";
       });
     },
+    /** treeSelect组件自定义数据*/
+    tenantIdnormalizer(node, instanceId) {
+      if (node.children && !node.children.length) {
+        delete node.children;
+      }
+      return {
+        id: node.id,
+        label: node.shortName,
+        children: node.children,
+      };
+    },
   },
 };
 </script>
-<style>
+<style lang="scss" scoped>
 .ellipsis {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
+::v-deep.formTreeItem {
+    .el-form-item__content {
+      width: 264px;
+    }
+  }
 </style>