feat：[模板管理][色谱生物样品分析溶液配制表]

src/App.vue

@@ -205,6 +205,9 @@ export default {
       width: 65%;
     }
 
+     .content {
+      width: 100%;
+    }
     .content-title {
       width: 100%;
       background: #f9f9ff;

src/lang/en/system/template.js

@@ -5,5 +5,7 @@ export default {
   status: 'Status',
   statusEnable: 'Enabled',
   statusDisable: 'Disabled',
-  detail: 'Enter'
+  detail: 'Enter',
+  bj: 'Edit',
+  bdpz: 'Template Config',
 }

src/lang/zh/system/template.js

@@ -5,5 +5,7 @@ export default {
   status: '状态',
   statusEnable: '启用',
   statusDisable: '禁用',
+  bj: '编辑',
+  bdpz: '表单配置',
   detail: '详情'
 }

src/views/business/comps/template/TemplateTable.vue

@@ -0,0 +1,42 @@
+<template>
+  <div class="template-table">
+    <SP001 v-if="sn == 'SP001'" />
+  </div>
+</template>
+
+<script>
+//色谱
+import SP001 from './comps/sp/SP001';
+export default {
+  name: "TemplateTable",
+  components: { SP001 },
+  props: {
+    sn: {
+      type: String,
+      default: '',
+    }
+  },
+  watch: {
+    sn: {
+      immediate: true,
+      handler(v) {
+      }
+    }
+  },
+  data() {
+    return {
+      info: {},
+    };
+  },
+  mounted() {
+  },
+  methods: {
+  }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss">
+.template-table {
+  background: #fff;
+  padding: 10px 10px;
+}
+</style>

src/views/business/comps/template/comps/sp/SP001.vue

@@ -0,0 +1,70 @@
+<template>
+  <div class="sp001">
+    <div class="detail-container">
+      <div class="detail-title"><img src="@/assets/images/detail-title.png">生物样品分析溶液配制表<img
+          src="@/assets/images/detail-title.png" /></div>
+      <div class="detail-content">
+        <div class="content">
+          <div class="content-title">
+            <div class="line"></div>
+            <div class="subtitle"> 试验基本信息</div>
+          </div>
+          <div class="pal">
+            <div class="left">
+              <div class="left-title">试验名称</div>
+              <el-input type="text" :value="form.mc" maxlength="50" disabled />
+            </div>
+            <div class="right">
+              <div class="right-title">试验编号</div>
+              <el-input type="text" :value="form.bh" maxlength="50" disabled />
+            </div>
+          </div>
+          <div class="pal">
+            <div class="left">
+              <div class="left-title">方法编号</div>
+              <el-input type="text" :value="form.nd" maxlength="50" disabled />
+            </div>
+            <div class="right">
+              <div class="right-title">版本号</div>
+              <el-input type="text" :value="form.kc" maxlength="50" disabled />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "SP001",
+  components: {},
+  props: {
+    value: {
+      type: {},
+      default: () => { },
+    }
+  },
+  watch: {
+    value: {
+      immediate: true,
+      handler(v) {
+
+      }
+    }
+  },
+  data() {
+    return {
+      form: {}
+    };
+  },
+  mounted() {
+  },
+  methods: {
+
+  }
+};
+</script>
+<style rel="stylesheet/scss" lang="scss">
+.sp001 {}
+</style>

src/views/business/template/list.vue

@@ -1,24 +1,21 @@
 <template>
   <div class="app-container template-page">
     <el-form :model="searchForm" ref="searchForm" :inline="true">
-      <el-form-item :label="$t('page.system.template.sn')+'：'" prop="sn">
-        <el-input v-model="searchForm.sn" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px" @keyup.enter.native="search" />
+      <el-form-item :label="$t('page.system.template.sn') + '：'" prop="sn">
+        <el-input v-model="searchForm.sn" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px"
+          @keyup.enter.native="search" />
       </el-form-item>
-      <el-form-item :label="$t('page.system.template.name')+'：'" prop="name">
-        <el-input v-model="searchForm.name" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px" @keyup.enter.native="search" />
+      <el-form-item :label="$t('page.system.template.name') + '：'" prop="name">
+        <el-input v-model="searchForm.name" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px"
+          @keyup.enter.native="search" />
       </el-form-item>
 
-      <el-form-item :label="$t('page.system.template.department')+'：'" prop="deptId">
+      <el-form-item :label="$t('page.system.template.department') + '：'" prop="deptId">
         <select-dept style="width:200px" v-model="searchForm.deptId" @change="search" />
       </el-form-item>
-      <el-form-item :label="$t('page.system.template.status')+'：'" prop="status">
-        <el-select
-          v-model="searchForm.status"
-          :placeholder="$t('form.placeholderSelect')"
-          clearable
-          style="width: 100px"
-          @change="search"
-        >
+      <el-form-item :label="$t('page.system.template.status') + '：'" prop="status">
+        <el-select v-model="searchForm.status" :placeholder="$t('form.placeholderSelect')" clearable
+          style="width: 100px" @change="search">
           <el-option key="0" :label="$t('page.system.template.statusEnable')" :value="10" />
           <el-option key="1" :label="$t('page.system.template.statusDisable')" :value="1" />
         </el-select>
@@ -27,7 +24,8 @@
         <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('form.search') }}</el-button>
         <el-button icon="el-icon-refresh" @click="reset">{{ $t('form.reset') }}</el-button>
 
-        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)" v-hasPermi="['system:user:add']">新增-后期不需要</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)"
+          v-hasPermi="['system:user:add']">新增-后期不需要</el-button>
       </el-form-item>
     </el-form>
 
@@ -37,27 +35,24 @@
       <el-table-column :label="$t('page.system.template.department')" align="center" prop="deptName" />
       <el-table-column :label="$t('page.system.template.status')" prop="status" width="150">
         <template slot-scope="scope">
-          <span v-if="scope.row.status===10">{{$t('page.system.template.statusEnable')}}</span>
-          <span v-if="scope.row.status===1">{{$t('page.system.template.statusDisable')}}</span>
+          <span v-if="scope.row.status === 10">{{ $t('page.system.template.statusEnable') }}</span>
+          <span v-if="scope.row.status === 1">{{ $t('page.system.template.statusDisable') }}</span>
         </template>
       </el-table-column>
-      <el-table-column :label="$t('form.operate')" fixed="right" align="center" width="100">
+      <el-table-column :label="$t('form.operate')" fixed="right" align="center" width="150">
         <template slot-scope="scope">
-          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
-          <el-button type="text" @click="edit(scope.row)">{{$t('page.system.template.detail')}}</el-button>
+          <el-button type="text" @click="edit(scope.row)">{{ $t('page.system.template.detail') }}</el-button>
+          <el-button type="text" @click="edit(scope.row)">{{ $t('page.system.template.bj') }}</el-button>
+          <el-button type="text" @click="bdpz(scope.row)">{{ $t('page.system.template.bdpz') }}</el-button>
         </template>
       </el-table-column>
     </el-table>
 
-    <pagination
-      v-show="total>0"
-      :total="total"
-      :page.sync="searchForm.pageNum"
-      :limit.sync="searchForm.pageSize"
-      @pagination="getList"
-    />
+    <pagination v-show="total > 0" :total="total" :page.sync="searchForm.pageNum" :limit.sync="searchForm.pageSize"
+      @pagination="getList" />
 
-    <el-dialog :close-on-click-modal="false" :title="infoDialog.title" :visible.sync="infoDialog.visible" width="600px" append-to-body>
+    <el-dialog :close-on-click-modal="false" :title="infoDialog.title" :visible.sync="infoDialog.visible" width="600px"
+      append-to-body>
       <el-form ref="infoDialogForm" :model="infoDialog.formData" :rules="infoDialog.rules" label-width="100px">
         <el-row>
           <el-col :span="24">
@@ -82,49 +77,59 @@
         <el-button @click="infoDialog.visible = false">取 消</el-button>
       </div>
     </el-dialog>
-    
+    <el-dialog :close-on-click-modal="false" :title="$t('page.system.template.bdpz')" :visible.sync="tableDialog.visible"
+      width="90%" append-to-body>
+      <TemplateTable  :sn="tableDialog.sn" />
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { template_list,template_info,template_save,template_delete} from "@/api/business/template/template";
+import { template_list, template_info, template_save, template_delete } from "@/api/business/template/template";
 import SelectDept from '../comps/select/SelectDept.vue';
+import TemplateTable from '@/views/business/comps/template/TemplateTable';
 const EmptyDialogData = {
-  id:'',
-  name:'',
-  sn:'',
-  deptId:''
+  id: '',
+  name: '',
+  sn: '',
+  deptId: ''
 }
 export default {
   name: "Template",
-  props:{
+  props: {
   },
-  components:{
-    SelectDept
+  components: {
+    SelectDept,
+    TemplateTable
   },
   computed: {
   },
-  filters:{
+  filters: {
   },
   data() {
     return {
       searchForm: {
         pageNum: 1,
         pageSize: 10,
-        sn:'',
-        name:'',
-        deptId:null,
-        status:'',
+        sn: '',
+        name: '',
+        deptId: null,
+        status: '',
       },
 
       loading: true,
       total: 0,
       list: [],
 
-      infoDialog:{
-        title:'',
-        visible:false,
-        formData:{},
+      infoDialog: {
+        title: '',
+        visible: false,
+        formData: {},
+      },
+      tableDialog: {
+        title: '',
+        visible: false,
+        sn: ''
       },
     };
   },
@@ -132,6 +137,11 @@ export default {
     this.getList();
   },
   methods: {
+    bdpz(row) {
+      this.tableDialog.title = '表单配置'
+      this.tableDialog.sn=row.sn
+      this.tableDialog.visible=true
+    },
     getList() {
       this.loading = true;
       template_list(this.searchForm).then(response => {
@@ -144,14 +154,14 @@ export default {
       this.searchForm.pageNum = 1;
       this.getList();
     },
-    reset(){
+    reset() {
       this.searchForm = {
         pageNum: 1,
         pageSize: 10,
-        sn:'',
-        name:'',
-        deptId:null,
-        status:'',
+        sn: '',
+        name: '',
+        deptId: null,
+        status: '',
       }
       this.search()
     },
@@ -159,10 +169,10 @@ export default {
       this.$refs['infoDialogForm'] && this.$refs['infoDialogForm'].resetFields()
       this.infoDialog.title = '新增'
       this.infoDialog.formData = _.merge({}, EmptyDialogData)
-      if(row && row.id){
+      if (row && row.id) {
         this.infoDialog.title = '编辑'
         this.$modal.loading()
-        template_info({id:row.id}).then(({data}) => {
+        template_info({ id: row.id }).then(({ data }) => {
           this.infoDialog.formData = data
         }).finally(() => {
           this.$modal.closeLoading()
@@ -197,19 +207,18 @@ export default {
         cancelButtonText: '取消',
         type: 'warning'
       })
-      .then(() => {
-        this.$modal.loading()
-        template_delete({ id: row.id}).then(() => {
-          this.getList()
-        })
-        .finally(() => {
-          this.$modal.closeLoading()
+        .then(() => {
+          this.$modal.loading()
+          template_delete({ id: row.id }).then(() => {
+            this.getList()
+          })
+            .finally(() => {
+              this.$modal.closeLoading()
+            })
         })
-      })
-      .catch(() => {})
+        .catch(() => { })
     },
   }
 };
 </script>
-<style lang="scss">
-</style>
+<style lang="scss"></style>