diff --git a/jero-web/src/common/lang/en-us.js b/jero-web/src/common/lang/en-us.js
index e18287b58..a773e0f2f 100644
--- a/jero-web/src/common/lang/en-us.js
+++ b/jero-web/src/common/lang/en-us.js
@@ -1384,4 +1384,12 @@ module.exports = {
   beforedate:'In... Before  date',
   beforedatein:'In... Before  date (inclusive)',
   inRecentMonthsin6:'Within 6 months (implemented)',
+  certificationList:'Certification List',
+  inspectionItems:'Inspection Items',
+  processReset:'Process Reset',
+  configurationItem:'Configuration Item',
+  DeliverablesResult:'Deliverables Result',
+  reportNo:'Report No',
+  productModel:'Product Model',
+  nameOfManufacturer:'Name Of Manufacturer',
 }
\ No newline at end of file
diff --git a/jero-web/src/common/lang/zh-cn.js b/jero-web/src/common/lang/zh-cn.js
index 9558852a3..5501d53b0 100644
--- a/jero-web/src/common/lang/zh-cn.js
+++ b/jero-web/src/common/lang/zh-cn.js
@@ -1485,4 +1485,12 @@ module.exports = {
   beforedate:'在...日期之前',
   beforedatein:'在...日期之前（包含）',
   inRecentMonthsin6:'近6个月内（已实施）',
+  certificationList:'认证清单',
+  inspectionItems:'检验项目',
+  processReset:'流程重置',
+  configurationItem:'配置项',
+  DeliverablesResult:'交付结果',
+  reportNo:'报告编号',
+  productModel:'产品型号',
+  nameOfManufacturer:'生产企业名称',
 }
\ No newline at end of file
diff --git a/jero-web/src/views/projectManagement/ProjectDetails/index.vue b/jero-web/src/views/projectManagement/ProjectDetails/index.vue
index ed161cf7f..b8a132c9c 100644
--- a/jero-web/src/views/projectManagement/ProjectDetails/index.vue
+++ b/jero-web/src/views/projectManagement/ProjectDetails/index.vue
@@ -40,17 +40,23 @@
             <a-icon type="control"/>
             {{$t('listOfRegulations')}}
           </div>
-          <div class="Virtual-detail-left-text" :title="$t('taskList')"
-               v-has="'projectLawsInventory:taskList'"
-               @click="textClick(2,$t('taskList'))">
+          <div class="Virtual-detail-left-text" :title="$t('certificationList')"
+               v-has="'projectLawsInventory:CertificationList'"
+               @click="textClick(6,$t('certificationList'))">
             <a-icon type="safety"/>
-            {{$t('taskList')}}
-          </div>
-          <div class="Virtual-detail-left-text" v-has="'ncrTrack:queryPageInfo'" :title="$t('nonConformance')"
-               @click="textClick(3,$t('nonConformance'))">
-            <a-icon type="safety-certificate"/>
-            {{$t('nonConformance')}}
+            {{$t('certificationList')}}
           </div>
+<!--          <div class="Virtual-detail-left-text" :title="$t('taskList')"-->
+<!--               v-has="'projectLawsInventory:taskList'"-->
+<!--               @click="textClick(2,$t('taskList'))">-->
+<!--            <a-icon type="safety"/>-->
+<!--            {{$t('taskList')}}-->
+<!--          </div>-->
+<!--          <div class="Virtual-detail-left-text" v-has="'ncrTrack:queryPageInfo'" :title="$t('nonConformance')"-->
+<!--               @click="textClick(3,$t('nonConformance'))">-->
+<!--            <a-icon type="safety-certificate"/>-->
+<!--            {{$t('nonConformance')}}-->
+<!--          </div>-->
           <div class="Virtual-detail-left-text" v-has="'params:manifest:page'"
                :title="$t('TaskParameterCollection')"
                @click="textClick(4,$t('TaskParameterCollection'))">
@@ -77,15 +83,20 @@
                @click="textClick(1,$t('listOfRegulations'))">
             <a-icon type="control"/>
           </div>
-          <div class="Virtual-detail-left-text" :title="$t('taskList')"
-               v-has="'projectLawsInventory:taskList'"
-               @click="textClick(2,$t('taskList'))">
+          <div class="Virtual-detail-left-text" :title="$t('certificationList')"
+               v-has="'projectLawsInventory:CertificationList'"
+               @click="textClick(6,$t('certificationList'))">
             <a-icon type="safety"/>
           </div>
-          <div class="Virtual-detail-left-text" v-has="'ncrTrack:queryPageInfo'" :title="$t('nonConformance')"
-               @click="textClick(3,$t('nonConformance'))">
-            <a-icon type="safety-certificate"/>
-          </div>
+<!--          <div class="Virtual-detail-left-text" :title="$t('taskList')"-->
+<!--               v-has="'projectLawsInventory:taskList'"-->
+<!--               @click="textClick(2,$t('taskList'))">-->
+<!--            <a-icon type="safety"/>-->
+<!--          </div>-->
+<!--          <div class="Virtual-detail-left-text" v-has="'ncrTrack:queryPageInfo'" :title="$t('nonConformance')"-->
+<!--               @click="textClick(3,$t('nonConformance'))">-->
+<!--            <a-icon type="safety-certificate"/>-->
+<!--          </div>-->
           <div class="Virtual-detail-left-text" v-has="'params:manifest:page'"
                :title="$t('TaskParameterCollection')"
                @click="textClick(4,$t('TaskParameterCollection'))">
@@ -109,6 +120,7 @@
           <nonConformance v-else-if="textTitle === $t('nonConformance')"/>
           <projectStatus @TaskListChange="TaskListChange"
                          v-else-if="textTitle === $t('projectStatus')"/>
+          <certificationList v-else-if="textTitle === $t('certificationList')"/>
         </div>
       </div>
     </div>
@@ -130,6 +142,7 @@
   import historicalVersionList from '../components/historicalVersionList'
   import commentList from '../components/commentList'
   import { getAction, postAction, deleteAction, downloadFile } from '@/api/manage'
+  import certificationList from '../components/certificationList/index'
   import { mapGetters } from 'vuex'
 
   export default {
@@ -143,7 +156,8 @@
       updateLog,
       historicalVersionList,
       commentList,
-      projectStatus
+      projectStatus,
+      certificationList
     },
     data() {
       return {
diff --git a/jero-web/src/views/projectManagement/components/certificationList/components/addModel.vue b/jero-web/src/views/projectManagement/components/certificationList/components/addModel.vue
new file mode 100644
index 000000000..879f2e479
--- /dev/null
+++ b/jero-web/src/views/projectManagement/components/certificationList/components/addModel.vue
@@ -0,0 +1,590 @@
+<template>
+  <div>
+    <a-drawer
+      :title="title"
+      :maskClosable="false"
+      :width="1000"
+      placement="right"
+      :closable="true"
+      @close="handleCancel"
+      :visible="visible"
+      style="height: 100%;overflow: auto;padding-bottom: 53px;">
+      <a-spin :spinning="confirmLoading">
+        <a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="$t('modelName')">{{$t('modelName')}}</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="projectNameId">
+                  <a-select :placeholder="$t('PleaseSelect')+$t('modelName')"
+                            @change="projectNameChange"
+                            v-model="formInline.projectNameId">
+                    <a-select-option v-for="(item, key) in projectNameList"
+                                     :key="key"
+                                     :value="item.id">
+                     <span style="display: inline-block;width: 100%" :title=" item.projectName ">
+                           {{ item.projectName}}
+                     </span>
+                    </a-select-option>
+                  </a-select>
+                </a-form-model-item>
+              </div>
+            </a-col>
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="'WVTA ID'">WVTA ID</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="projectVersion">
+                  <a-input class="box-input"
+                           v-model="formInline.projectVersion"
+                           :placeholder="$t('PleaseEnter')+'WVTA ID'"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+          </a-row>
+
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="$t('category')">{{$t('category')}}</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="category">
+                  <a-input class="box-input"
+                           v-model="formInline.category"
+                           :placeholder="$t('PleaseEnter')+$t('category')"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="$t('inspectionItems')">{{$t('inspectionItems')}}</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="inspectionItems">
+                  <a-input class="box-input"
+                           v-model="formInline.inspectionItems"
+                           :placeholder="$t('PleaseEnter')+$t('inspectionItems')"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+          </a-row>
+
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="$t('typeOfDeliverables')">{{$t('typeOfDeliverables')}}</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="designDeliverableType">
+                  <a-tree-select
+                    tree-node-filter-prop="title"
+                    v-model="formInline.designDeliverableType"
+                    :maxTagCount="1"
+                    :getPopupContainer="triggerNode=> triggerNode.parentNode"
+                    class="box-input"
+                    style="width: 100%"
+                    :tree-data="DeliverableTreeList"
+                    tree-checkable
+                    :placeholder="$t('PleaseSelect')+$t('typeOfDeliverables')"
+                  />
+                </a-form-model-item>
+              </div>
+            </a-col>
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="Required">*</span>
+                  <span class="title-text-text" :title="$t('deliverableTemplate')">{{$t('deliverableTemplate')}}</span>
+                </div>
+                <a-form-model-item class="itemModel" prop="designDeliverableTemplate">
+                  <a-button type="primary" class="button-text"
+                            @click="clickButtonToUpload('designDeliverableTemplate')">
+                    {{ (formInline.designDeliverableTemplate === 'null' || formInline.designDeliverableTemplate === ''
+                    ||
+                    formInline.designDeliverableTemplate == null) ? $t('clickUpload') : $t('viewUploadedFiles')
+                    }}
+                  </a-button>
+                </a-form-model-item>
+              </div>
+            </a-col>
+          </a-row>
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="title-text-text"
+                        :title="$t('areaOfResponsibility')">{{$t('areaOfResponsibility')}}</span>
+                </div>
+                <a-form-model-item class="itemModel-multi" prop="dutyTerritory">
+                  <j-multi-select-tag class="box-input" v-model="formInline.dutyTerritory"
+                                      :placeholder="$t('PleaseSelect')+$t('areaOfResponsibility')"
+                                      :type="'select'"
+                                      :triggerChange="false" :dictCode="'duty_territory'"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="title-text-text" :title="$t('engineeringInterfacePerson')">{{$t('engineeringInterfacePerson')}}</span>
+                </div>
+                <a-form-model-item class="itemModel-multi" :prop="'engineeringInterfacePerson'">
+                  <PersonnelSelection
+                    :query="{db_field_name:'engineeringInterfacePerson',db_field_txt:$t('engineeringInterfacePerson')}"
+                    :personneQuery="formInline"
+                    @change="PersonnelSelectionChange"
+                    :disabled="disabled"
+                    v-model="formInline.engineeringInterfacePersonName"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+          </a-row>
+          <a-row :gutter="24">
+            <a-col :span="12">
+              <div class="box-title-text">
+                <div class="title-text">
+                  <span class="title-text-text" :title="$t('personLiable')">{{$t('personLiable')}}</span>
+                </div>
+                <a-form-model-item class="itemModel-multi" :prop="'personLiableName'">
+                  <PersonnelSelection
+                    :query="{db_field_name:'personLiable',db_field_txt:$t('personLiable')}"
+                    :personneQuery="formInline"
+                    @change="PersonnelSelectionChange"
+                    :disabled="disabled"
+                    v-model="formInline.personLiableName"/>
+                </a-form-model-item>
+              </div>
+            </a-col>
+          </a-row>
+          <!--        <a-row :gutter="24">-->
+          <!--          <a-col :span="24">-->
+          <!--            <div class="box-title-text">-->
+          <!--              <div class="title-text">-->
+          <!--                <span class="title-text-text" :title="$t('explain')">{{$t('explain')}}</span>-->
+          <!--              </div>-->
+          <!--              <a-form-model-item class="itemModel" prop="explanation">-->
+          <!--                <a-textarea :placeholder="$t('pleaseEnter')+$t('explain')"-->
+          <!--                            v-model="formInline.explanation"-->
+          <!--                            :rows="4"/>-->
+          <!--              </a-form-model-item>-->
+          <!--            </div>-->
+          <!--          </a-col>-->
+          <!--        </a-row>-->
+        </a-form-model>
+      </a-spin>
+      <div class="drawer-bootom-button">
+        <a-button style="margin-right: .8rem" @click="handleCancel">{{$t('cancel')}}</a-button>
+        <a-button @click="handleSubmit" type="primary" :loading="confirmLoading">{{$t('submit')}}</a-button>
+      </div>
+    </a-drawer>
+    <uploadFile ref="uploadFile" @uploadSuccess="uploadSuccess"/>
+  </div>
+</template>
+
+<script>
+  import PersonnelSelection from '@/components/PersonnelSelection/index'
+  import uploadFile from '@/components/uploadFile/file'
+  import { getAction, postAction, downloadFile, putAction } from '@/api/manage'
+  import { mapGetters } from 'vuex'
+
+  export default {
+    name: 'addModel',
+    components: {
+      PersonnelSelection,
+      uploadFile
+    },
+    props: ['url'],
+    data() {
+      return {
+        formInline: {},
+        confirmLoading: false,
+        visible: false,
+        yearNameDataList: [],
+        rules: {
+          ipdInfo: [
+            {
+              pattern: /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%$#_]*)?/,
+              message: this.$t('pleaseEnterTheCorrectWebAddress')
+            },
+            {
+              max: 300,
+              message: this.$t('IPDInformation') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          vehicleDevelopmentPlan: [
+            {
+              pattern: /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%$#_]*)?/,
+              message: this.$t('pleaseEnterTheCorrectWebAddress')
+            },
+            {
+              max: 300,
+              message: this.$t('dehicleDevelopmentPlan') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          explanation: [
+            {
+              max: 500,
+              message: this.$t('explain') + this.$t('cannotExceed') + 500 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          attestationPlan: [
+            {
+              pattern: /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%$#_]*)?/,
+              message: this.$t('pleaseEnterTheCorrectWebAddress')
+            },
+            {
+              max: 300,
+              message: this.$t('certificationProgram') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          vehiclePlatform: [
+            {
+              max: 100,
+              message: this.$t('ModelPlatform') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          digitalPlatform: [
+            {
+              max: 100,
+              message: this.$t('DigitalPlatform') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          softwareVersion: [
+            {
+              max: 300,
+              message: this.$t('softwareVersion') + this.$t('cannotExceed') + 300 + this.$t('Characters'),
+              trigger: 'blur'
+            }
+          ],
+          projectNameId: [
+            {
+              required: true,
+              message: this.$t('entryName') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            }
+          ],
+          yearNameId: [
+            {
+              required: true,
+              message: this.$t('modelYear') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            }
+          ],
+          targetMarket: [
+            {
+              required: true,
+              message: this.$t('targetMarket') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            }
+          ],
+          projectStatus: [
+            {
+              required: true,
+              message: this.$t('projectStatus') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            }
+          ],
+          studioEngineerName: [
+            {
+              required: true,
+              message: this.$t('StudioEngineer') + this.$t('cannotEmpty'),
+              trigger: 'change'
+            },
+            {
+              max: 100,
+              message: this.$t('StudioEngineer') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'change'
+            }
+          ],
+          certificationEngineerName: [
+            {
+              max: 100,
+              message: this.$t('certifiedEngineer') + this.$t('cannotExceed') + 100 + this.$t('Characters'),
+              trigger: 'change'
+            }
+          ]
+        },
+        disabled: false,
+        projectNameList: [],
+        title: '',
+        DeliverableTreeList: [],
+        uploadName: ''
+      }
+    },
+    mounted() {
+      this.getNameList()
+      this.getDeliverableTree()
+    },
+    methods: {
+      ...mapGetters(['userInfo']),
+      getDeliverableTree() {
+        getAction('/sys/category/getDeliverableTree', {}).then((res) => {
+          if (res.success) {
+            this.DeliverableTreeList = res.result
+          } else {
+            this.DeliverableTreeList = []
+          }
+        })
+      },
+      getNameList(value) {
+        getAction('project/projectNameInfoEO/list', {}).then((res) => {
+          if (res.success) {
+            this.projectNameList = res.result || []
+            if (this.title == this.$t('edit')) {
+              let content = this.projectNameList.filter(res => {
+                return res.id == value.projectNameId
+              })
+              this.yearNameDataList = content[0].yearNameDataList || []
+              this.formInline = value
+              this.formInline = { ...this.formInline }
+            }
+          } else {
+            this.projectNameList = []
+          }
+        })
+      },
+      addModel() {
+        this.visible = true
+        this.title = this.$t('add')
+        this.formInline = {}
+        this.getNameList()
+        this.formInline.studioEngineerName = this.userInfo().username
+        this.formInline.studioEngineer = this.userInfo().id
+        this.formInline.projectVersion = '00'
+        this.formInline = { ...this.formInline }
+        this.$nextTick(() => {
+          this.$refs.ruleForm.clearValidate()
+        })
+      },
+      editModel(value) {
+        this.visible = true
+        this.title = this.$t('edit')
+        this.getNameList(value)
+        this.$nextTick(() => {
+          this.$refs.ruleForm.clearValidate()
+        })
+      },
+      handleCancel() {
+        this.visible = false
+      },
+      handleSubmit() {
+        this.$refs.ruleForm.validate(valid => {
+          if (valid) {
+            let url = ''
+            let Action
+            if (this.formInline.id) {
+              url = this.url.edit
+              Action = putAction
+            } else {
+              url = this.url.add
+              Action = postAction
+            }
+            let query = JSON.parse(JSON.stringify(this.formInline))
+            Object.keys(query).forEach(res => {
+              if (query[res] && query[res] instanceof Array) {
+                query[res] = query[res].join(',')
+              }
+            })
+            this.confirmLoading = true
+            Action(url, query).then((res) => {
+              if (res.success) {
+                this.confirmLoading = false
+                this.$message.success(this.$t('OperationSuccessful'))
+                this.visible = false
+                this.$emit('addModelList')
+              } else {
+                this.$message.warning(res.message)
+                this.confirmLoading = false
+              }
+            })
+          }
+        })
+      },
+      handleInput(value) {
+        this.$nextTick(() => {
+          this.formInline = { ...this.formInline }
+          this.$refs.ruleForm.validateField([value])
+        })
+      },
+      PersonnelSelectionChange(value, id) {
+        this.formInline[value] = id
+        this.formInline = { ...this.formInline }
+      },
+      projectNameChange(value) {
+        this.formInline.yearNameId = undefined
+        let content = this.projectNameList.filter(res => {
+          return res.id == value
+        })
+        this.formInline.vehiclePlatform = content[0].vehiclePlatform || ''
+        this.yearNameDataList = content[0].yearNameDataList || []
+        this.formInline.digitalPlatform = content[0].digitalPlatform || ''
+        this.formInline = { ...this.formInline }
+      },
+      clickButtonToUpload(item) {
+        this.$refs.uploadFile.perentHandleFunc()
+        this.$refs.uploadFile.visible = true
+        this.uploadName = item
+        getAction('sys/common/getFileInfos', { id: this.formInline[item] }).then((res) => {
+          if (res.success) {
+            this.$refs.uploadFile.perentHandleFunc(res.result)
+          } else {
+            this.$refs.uploadFile.perentHandleFunc()
+          }
+        })
+      },
+      /** 上传文件的回调 */
+      uploadSuccess(data) {
+        let attIdList = []
+        if (data && data.length > 0) {
+          data.map(item => {
+            attIdList.push(item.id || data.name)
+          })
+        }
+        /** 赋值给当前对应的表单文件 */
+        this.formInline[this.uploadName] = attIdList.join(',')
+        this.formInline = { ...this.formInline }
+      }
+    }
+  }
+</script>
+<style>
+  .formAdd .ant-form-item-label {
+    width: 130px;
+  }
+
+  .formAdd .ant-form-item-control-wrapper {
+    display: inline-block;
+    width: 100%;
+  }
+
+  /*.formAdd .ant-form-item {*/
+  /*  margin-bottom: 20px;*/
+  /*}*/
+
+  .itemModel .ant-form-item-control-wrapper {
+    width: 100%;
+  }
+
+  .box-input .ant-select-selection--single {
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection--multiple {
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection__rendered {
+    line-height: 38px;
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection--multiple .ant-select-selection__rendered > ul > li {
+    margin-top: 6px;
+  }
+
+  .box-input .ant-calendar-picker {
+    line-height: 38px;
+    height: 38px;
+  }
+
+  .box-input .ant-calendar-picker-input {
+    height: 38px;
+  }
+
+  .box-input .ant-input-number-input-wrap {
+    line-height: 38px;
+    height: 38px;
+  }
+</style>
+<style scoped>
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    /*align-items: center;*/
+  }
+
+  .title-text {
+    width: 114px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 48px;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: calc(100% - 130px);
+    display: inline-block;
+    margin-top: 2px;
+    height: 40px;
+    margin-bottom: 24px;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .title-text-text {
+    margin-top: 9px;
+  }
+
+
+  .formAdd {
+    margin-bottom: 40px;
+  }
+
+
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    z-index: 100;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
+
+  .button-text {
+    height: 38px;
+    width: calc(100% - 100px);
+    line-height: 38px;
+    background: #fff;
+    border: 1px #00B3BE solid;
+    color: #00B3BE;
+  }
+</style>
+<style>
+  .ant-input-disabled {
+    color: rgba(0, 0, 0, 0.65) !important;
+  }
+</style>
\ No newline at end of file
diff --git a/jero-web/src/views/projectManagement/components/certificationList/components/batSetting.vue b/jero-web/src/views/projectManagement/components/certificationList/components/batSetting.vue
new file mode 100644
index 000000000..61d250be0
--- /dev/null
+++ b/jero-web/src/views/projectManagement/components/certificationList/components/batSetting.vue
@@ -0,0 +1,313 @@
+<template>
+  <a-modal
+    :title="$t('batSetting')"
+    :width="1000"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :maskClosable="false"
+    @ok="handleOk"
+    @cancel="handleCancel"
+  >
+    <a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('configurationItem')">{{$t('configurationItem')}}</span>
+            </div>
+            <a-form-model-item class="itemModel">
+              <a-select :placeholder="$t('PleaseSelect')+$t('configurationItem')"
+                        class="box-input"
+                        allowClear
+                        :getPopupContainer="triggerNode=> triggerNode.parentNode"
+                        v-model="formInline.configurationItem">
+                <a-select-option v-for="(item, key) in configurationItemList"
+                                 :key="item.key"
+                                 :value="item.value">
+                     <span style="display: inline-block;width: 100%" :title=" item.label ">
+                           {{ item.label }}
+                     </span>
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </div>
+        </a-col>
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('areaOfResponsibility')">{{$t('areaOfResponsibility')}}</span>
+            </div>
+            <a-form-model-item class="itemModel-multi">
+              <j-multi-select-tag class="box-input" v-model="formInline.dutyTerritory"
+                                  :placeholder="$t('PleaseSelect')+$t('areaOfResponsibility')"
+                                  :type="'select'"
+                                  :triggerChange="false" :dictCode="'duty_territory'"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('engineeringInterfacePerson')">{{$t('engineeringInterfacePerson')}}</span>
+            </div>
+            <a-form-model-item class="itemModel">
+              <a-select :placeholder="$t('PleaseSelect')+$t('engineeringInterfacePerson')"
+                        class="box-input"
+                        allowClear
+                        :getPopupContainer="triggerNode=> triggerNode.parentNode"
+                        v-model="formInline.configurationItem">
+                <a-select-option v-for="(item, key) in engineeringInterfacePersonList"
+                                 :key="item.key"
+                                 :value="item.value">
+                     <span style="display: inline-block;width: 100%" :title=" item.label ">
+                           {{ item.label }}
+                     </span>
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </div>
+        </a-col>
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('personLiable')">{{$t('personLiable')}}</span>
+            </div>
+            <a-form-model-item class="itemModel-multi">
+              <PersonnelSelection :query="{db_field_name:'studioEngineer',db_field_txt:$t('personLiable')}"
+                                  :isSingleChoice="true"
+                                  :personneQuery="formInline"
+                                  v-if="visible"
+                                  @change="PersonnelSelectionChange"
+                                  v-model="formInline.studioEngineerName"/>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <div class="box-title-text">
+            <div class="title-text">
+              <span class="title-text-text" :title="$t('typeOfDeliverables')">{{$t('typeOfDeliverables')}}</span>
+            </div>
+            <a-form-model-item class="itemModel">
+              <a-select :placeholder="$t('PleaseSelect')+$t('typeOfDeliverables')"
+                        class="box-input"
+                        allowClear
+                        :getPopupContainer="triggerNode=> triggerNode.parentNode"
+                        v-model="formInline.configurationItem">
+                <a-select-option v-for="(item, key) in typeOfDeliverablesList"
+                                 :key="item.key"
+                                 :value="item.value">
+                     <span style="display: inline-block;width: 100%" :title=" item.label ">
+                           {{ item.label }}
+                     </span>
+                </a-select-option>
+              </a-select>
+            </a-form-model-item>
+          </div>
+        </a-col>
+      </a-row>
+    </a-form-model>
+  </a-modal>
+</template>
+
+<script>
+  import { getAction, postAction } from '@/api/manage'
+  import PersonnelSelection from '@/components/PersonnelSelection/index'
+  import moment from 'moment'
+
+  export default {
+    name: 'batSetting',
+    props: ['url'],
+    components:{
+      PersonnelSelection
+    },
+    data() {
+      return {
+        visible: false,
+        confirmLoading: false,
+        formInline: {},
+        rules: {},
+        ids: [],
+        configurationItemList:[],
+        engineeringInterfacePersonList:[],
+        typeOfDeliverablesList:[],
+      }
+    },
+    mounted() {
+    },
+    methods: {
+      edit(data) {
+        this.visible = true
+        this.$nextTick(() => {
+          this.ids = data || []
+          this.formInline = {}
+        })
+      },
+      handleOk() {
+        if (this.formInline.dutyTerritory) {
+          this.handleOkTwo()
+        } else {
+          this.handleOkOne()
+        }
+      },
+      PersonnelSelectionChange(value, id) {
+        this.formInline[value] = id
+        this.formInline = { ...this.formInline }
+      },
+      handleOkOne() {
+        let ids = JSON.parse(JSON.stringify(this.ids))
+        let query = {
+          ids: ids.join(','),
+          ...this.formInline
+        }
+        this.confirmLoading = true
+        postAction(this.url.setBatch, query).then((res) => {
+          if (res.success) {
+            this.$message.success(this.$t('OperationSuccessful'))
+            this.visible = false
+            this.confirmLoading = false
+            this.$emit('batSettingForm')
+          } else {
+            this.$message.warning(this.$t('operationFailed'))
+            this.confirmLoading = false
+          }
+        })
+      },
+      handleOkTwo() {
+        let _this = this
+        this.$confirm({
+          content: _this.$t('areResponsibilityAreaInformationBatch'),
+          onOk() {
+            let ids = JSON.parse(JSON.stringify(_this.ids))
+            let query = {
+              ids: ids.join(','),
+              ..._this.formInline
+            }
+            _this.confirmLoading = true
+            postAction(_this.url.setBatch, query).then((res) => {
+              if (res.success) {
+                _this.$message.success(_this.$t('OperationSuccessful'))
+                _this.visible = false
+                _this.confirmLoading = false
+                _this.$emit('batSettingForm')
+              } else {
+                _this.$message.warning(_this.$t('operationFailed'))
+                _this.confirmLoading = false
+              }
+            })
+          }
+        })
+      },
+      handleCancel() {
+        this.formInline = {}
+        this.visible = false
+      },
+      handleInput(value) {
+        this.$nextTick(() => {
+          this.formInline = { ...this.formInline }
+          this.$refs.ruleForm.validateField([value])
+        })
+      },
+      dateChange(item) {
+        this.formInline[item.db_field_name] = this.formInline[item.db_field_name] ? moment(this.formInline[item.db_field_name]).format('YYYY-MM-DD') : ''
+      }
+    }
+  }
+</script>
+
+<style>
+  .formAdd .ant-form-item-label {
+    width: 130px;
+  }
+
+  .formAdd .ant-form-item-control-wrapper {
+    display: inline-block;
+    width: 100%;
+  }
+
+  /*.formAdd .ant-form-item {*/
+  /*  margin-bottom: 20px;*/
+  /*}*/
+
+  .itemModel .ant-form-item-control-wrapper {
+    width: 100%;
+  }
+
+  .box-input .ant-select-selection--single {
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection--multiple {
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection__rendered {
+    line-height: 38px;
+    height: 38px;
+  }
+
+  .box-input .ant-select-selection--multiple .ant-select-selection__rendered > ul > li {
+    margin-top: 6px;
+  }
+
+  .box-input .ant-calendar-picker {
+    line-height: 38px;
+    height: 38px;
+  }
+
+  .box-input .ant-calendar-picker-input {
+    height: 38px;
+  }
+
+  .box-input .ant-input-number-input-wrap {
+    line-height: 38px;
+    height: 38px;
+  }
+
+  .box-input .ant-calendar-picker-input {
+    padding: 4px 30px 4px 11px;
+  }
+</style>
+<style scoped>
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+  }
+
+  .title-text {
+    width: 104px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 42px;
+  }
+
+  .box-input {
+    display: inline-block;
+    height: 38px;
+    width: 100%;
+  }
+
+  .itemModel {
+    width: calc(100% - 130px);
+    display: inline-block;
+    margin-top: 2px;
+  }
+
+  .title-text-text {
+    margin-top: 9px;
+  }
+
+  .formAdd {
+    margin-bottom: 40px;
+  }
+</style>
\ No newline at end of file
diff --git a/jero-web/src/views/projectManagement/components/certificationList/components/transferList.vue b/jero-web/src/views/projectManagement/components/certificationList/components/transferList.vue
new file mode 100644
index 000000000..3198cb9d6
--- /dev/null
+++ b/jero-web/src/views/projectManagement/components/certificationList/components/transferList.vue
@@ -0,0 +1,269 @@
+<template>
+  <a-drawer
+    :title="$t('Transfer')"
+    :maskClosable="false"
+    :width="1000"
+    placement="right"
+    :closable="true"
+    @close="handleCancel"
+    :visible="visible"
+    style="height: 100%;overflow: auto;padding-bottom: 53px;">
+    <div style="margin-bottom: 60px">
+      <div class="table-page-search-wrapper">
+        <a-form layout="inline" @keyup.enter.native="searchQuery">
+          <a-row :gutter="24">
+            <a-col :md="12" :sm="8">
+              <div class="box-title-text">
+                <div class="title-text" :title="$t('VirtualListName')">
+                  <span>{{$t('VirtualListName')}}</span>
+                </div>
+                <j-input class="box-input" :placeholder="$t('PleaseEnter')+$t('VirtualListName')"
+                         v-model="queryParam.name"></j-input>
+              </div>
+            </a-col>
+            <span style="float: right;overflow: hidden;margin-right: 11px" class="table-page-search-submitButtons">
+               <a-col :md="12" :sm="24">
+                  <a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
+                  <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
+               </a-col>
+      </span>
+          </a-row>
+        </a-form>
+      </div>
+      <a-table
+        :components="drag(columns,'columns')"
+        :columns="columns"
+        rowKey="id"
+        :scroll="{x: 800}"
+        :data-source="dataList"
+        :pagination="false"
+        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange,columnTitle:' ' }"
+        :loading="loading">
+
+      </a-table>
+      <div class="page" v-if="dataList.length > 0">
+        <a-pagination
+          :show-total="total => $t('total')+` ${total} `+$t('strip')"
+          show-quick-jumper
+          show-size-changer
+          :page-size.sync="pageSize"
+          :total="total"
+          :current="pageNo"
+          @change="onChange"
+          @showSizeChange="SizeChange"
+        />
+      </div>
+    </div>
+
+    <div class="drawer-bootom-button">
+      <a-button @click="handleCancel" style="margin-right: 16px">{{$t('cancel')}}</a-button>
+      <a-button @click="handleSubmit(undefined)" type="primary" :loading="confirmLoading">{{$t('determine')}}</a-button>
+    </div>
+  </a-drawer>
+</template>
+
+<script>
+  import { getAction, postAction } from '@/api/manage'
+  import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
+
+  export default {
+    name: 'transferList',
+    components: {},
+    props: ['url'],
+    mixins:[ResizeHeader, ResizeColumnProvide],
+    data() {
+      return {
+        visible: false,
+        queryParam: {},
+        confirmLoading: false,
+        selectedRowKeys: [],
+        columns: [
+          {
+            title: this.$t('VirtualListName'),
+            dataIndex: 'name',
+            align: 'left',
+            ellipsis: true,
+            width: 223
+          },
+          {
+            title: this.$t('instructionForUse'),
+            dataIndex: 'useExplain',
+            align: 'left',
+            ellipsis: true,
+            width: 223
+          },
+          {
+            title: this.$t('updateTime'),
+            dataIndex: 'updateTime',
+            align: 'left',
+            ellipsis: true,
+            width: 223
+          },
+          {
+            title: this.$t('creater'),
+            dataIndex: 'createBy',
+            align: 'left',
+            ellipsis: true,
+            width: 223
+          }
+        ],
+        dataList: [],
+        content: [],
+        loading: false,
+        pageNo: 1,
+        pageSize: 10,
+        total: 0
+      }
+    },
+    mounted() {
+
+    },
+    methods: {
+      transferModel() {
+        this.visible = true
+        this.queryParam = {}
+        this.selectedRowKeys = []
+        this.replacePage()
+      },
+      searchQuery() {
+        this.pageNo = 1
+        this.replacePage()
+      },
+      searchReset() {
+        this.pageNo = 1
+        this.queryParam = {}
+        this.replacePage()
+      },
+      onChange(page, pageSize) {
+        this.pageNo = page
+        this.replacePage()
+      },
+      SizeChange(page, pageSize) {
+        this.pageNo = 1
+        this.pageSize = pageSize
+        this.replacePage()
+      },
+      replacePage() {
+        let query = {
+          pageNo: this.pageNo,
+          pageSize: this.pageSize,
+          ...this.queryParam
+        }
+        this.loading = true
+        postAction('/project/projectLawsInventoryEO/getPageInfoDummy', query).then((res) => {
+          if (res.success) {
+            this.dataList = res.result.records || []
+            this.total = res.result.total
+            this.loading = false
+          } else {
+            this.loading = false
+          }
+        })
+      },
+      onSelectChange(value) {
+        this.selectedRowKeys = value
+        if (this.selectedRowKeys.length > 1) {
+          this.selectedRowKeys.shift()
+        }
+      },
+      handleCancel() {
+        this.visible = false
+        this.$emit('visible')
+      },
+      handleSubmit(flag) {
+        if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
+          this.confirmLoading = true
+          let selectedRowKeys = JSON.parse(JSON.stringify(this.selectedRowKeys))
+          this.confirmLoading = false
+          this.$emit('transferListForm',selectedRowKeys.join(','))
+          this.selectedRowKeys = []
+          // postAction('project/projectLawsInventoryEO/add', {
+          //   dummyInventoryBaseId: selectedRowKeys.join(','),
+          //   projectLibraryId: this.$route.query.id,
+          //   flag: flag
+          // }).then((res) => {
+          //   if (res.success) {
+          //     this.confirmLoading = false
+          //     // this.$message.success(this.$t('OperationSuccessful'))
+          //     // this.visible = false
+          //     this.selectedRowKeys = []
+          //     this.$emit('transferListForm',selectedRowKeys.join(','))
+          //   } else {
+          //     // if (res.message == '该虚拟清单的维护清单中没有数据,是否需要添加') {
+          //     //   this.confirmLoading = false
+          //     //   this.getAdd()
+          //     //   return
+          //     // }
+          //     this.$message.warning(this.$t('operationFailed'))
+          //     this.confirmLoading = false
+          //   }
+          // })
+        } else {
+          this.$message.warning(this.$t('selectLeastOne'))
+        }
+      },
+      getAdd() {
+        let _this = this
+        this.$confirm({
+          content: _this.$t('TheDoesNotContainData'),
+          onOk() {
+            _this.handleSubmit('1')
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style scoped>
+  .page {
+    text-align: right;
+    margin-top: 20px;
+  }
+
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    z-index: 100;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+
+  .title-text {
+    width: 20%;
+    min-width: 110px;
+    color: #000F16;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    margin-top: 3px;
+    text-align: right;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .box-input {
+    display: inline-block;
+    width: 70%;
+    height: 38px;
+    margin-top: 2px;
+  }
+
+  .box-button {
+    height: 38px;
+  }
+</style>
\ No newline at end of file
diff --git a/jero-web/src/views/projectManagement/components/certificationList/index.vue b/jero-web/src/views/projectManagement/components/certificationList/index.vue
new file mode 100644
index 000000000..9c2c6f930
--- /dev/null
+++ b/jero-web/src/views/projectManagement/components/certificationList/index.vue
@@ -0,0 +1,837 @@
+<template>
+  <a-card :bordered="false">
+    <div class="table-page-search-wrapper">
+      <a-form layout="inline" @keyup.enter.native="searchQuery">
+        <a-row :gutter="24">
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('inspectionItems')">
+                <span>{{ $t('inspectionItems') }}</span>
+              </div>
+              <j-input class="box-input" :placeholder="$t('PleaseEnter')+$t('inspectionItems')"
+                       v-model="queryParam.inspectionItems"></j-input>
+            </div>
+          </a-col>
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('areaOfResponsibility')">
+                <span>{{ $t('areaOfResponsibility') }}</span>
+              </div>
+              <j-multi-select-tag class="box-input" v-model="queryParam.dutyTerritory"
+                                  :placeholder="$t('PleaseSelect')+$t('areaOfResponsibility')"
+                                  :type="'select'"
+                                  :triggerChange="false" :dictCode="'duty_territory'"/>
+            </div>
+          </a-col>
+          <a-col :md="6" :sm="8">
+            <div class="box-title-text">
+              <div class="title-text" :title="$t('ProcessStatus')">
+                <span>{{ $t('ProcessStatus') }}</span>
+              </div>
+              <a-select :placeholder="$t('PleaseSelect')+$t('ProcessStatus')"
+                        class="box-input"
+                        allowClear
+                        :getPopupContainer="triggerNode=> triggerNode.parentNode"
+                        v-model="queryParam.processStatus">
+                <a-select-option v-for="(item, key) in processStatusList"
+                                 :key="item.key"
+                                 :value="item.value">
+                     <span style="display: inline-block;width: 100%" :title=" item.label ">
+                           {{ item.label }}
+                     </span>
+                </a-select-option>
+              </a-select>
+            </div>
+          </a-col>
+          <template v-if="toggleSearchStatus">
+
+          </template>
+          <span style="float: right;overflow: hidden;margin-right: 11px; " class="table-page-search-submitButtons">
+               <a-col :md="6" :sm="24">
+                   <globalAdvancedQuery ref="globalAdvancedQueryRef"
+                                        @handleSuperQuery="handleSuperQuery"
+                                        :fieldList="fieldList"/>
+                  <a-button class="box-button" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
+                  <a-button class="box-button" style="margin-left: 8px"
+                            @click="searchReset">{{ $t('reset') }}</a-button>
+                 <a @click="handleToggleSearch" style="margin-left: 8px">
+                            {{ !toggleSearchStatus ? $t('open') : $t('away') }}
+                            <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+                 </a>
+               </a-col>
+            </span>
+        </a-row>
+      </a-form>
+    </div>
+
+    <div class="table-operator"
+         style="overflow:hidden;margin-bottom: 20px;text-align: left">
+      <div style="margin-top: 1px;float:left;">
+        <div @click="transferClick" class="operator-text">
+          <a-icon type="profile"/>
+          {{ $t('Transfer') }}
+        </div>
+        <div @click="BatchSettingClick" class="operator-text">
+          <a-icon type="setting"/>
+          {{ $t('BatchSetting') }}
+        </div>
+        <div @click="certificationClick" class="operator-text">
+          <a-icon type="profile"/>
+          {{ $t('CertificationDirectory') }}
+        </div>
+        <a-popconfirm overlayClassName="popconfirm" placement="bottomRight">
+          <template slot="title" id="popconfirm">
+            <div style="height:320px;overflow:scroll;overflow-x: auto;">
+              <!--              <div class="operator-text-title">-->
+              <!--                <ImportFile :url="url" :projectLibraryId=$route.query.id :isTrue="true" :accept="'.zip'"-->
+              <!--                            @getList="getPersonnelList" />-->
+              <!--              </div>-->
+              <div @click="handleAdd" class="operator-text-title">
+                <a-icon type="plus"/>
+                {{ $t('add') }}
+              </div>
+              <div @click="handleModule" class="operator-text-title">
+                <a-icon type="download"/>
+                {{ $t('templateDownload') }}
+              </div>
+              <div @click="handleExport" class="operator-text-title">
+                <a-icon type="export" :rotate="-90"/>
+                {{ $t('export') }}
+              </div>
+              <div @click="handleDel" class="operator-text-title">
+                <a-icon type="delete"/>
+                {{ $t('BatchDelete') }}
+              </div>
+              <div @click="processResetClick" class="operator-text-title">
+                <a-icon type="stop"/>
+                {{ $t('processReset') }}
+              </div>
+            </div>
+          </template>
+          <div class="operator-text" style="position: relative">
+            <span style="position: absolute;left: -13px;top: -4px">...</span>{{ $t('more') }}
+          </div>
+        </a-popconfirm>
+      </div>
+      <div style="margin-top: 1px;float:right;">
+        <div @click="releaseClick" class="operator-text">
+          <a-icon type="check-circle"/>
+          {{ $t('release') }}
+        </div>
+        <div @click="withdrawClick" class="operator-text">
+          <a-icon type="rollback"/>
+          {{ $t('withdraw') }}
+        </div>
+        <div @click="questionClick" class="operator-text">
+          <a-icon type="sound"/>
+          {{ $t('question') }}
+        </div>
+      </div>
+    </div>
+
+    <div style="width: 100%">
+      <a-table
+        ref="table"
+        class="customizetable"
+        :loading="loading"
+        :pagination="false"
+        :scroll="{x: '100%',y:'calc(100vh - 300px)'}"
+        rowKey="id"
+        :data-source="dataSource"
+        :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
+        :columns="columns"
+      >
+        <span slot="operation" slot-scope="text,record">
+              <a class="text-operation"
+                 v-if="(record.inventoryAffirmStatus == 'List to confirm' &&
+                  ((record.roleCode == 1 && !record.regulationOwnerSubmitStatus) ||
+                  (record.roleCode == 2 && !record.homologationEngineerSubmitStatus) ||
+                  (record.roleCode == 4 && !record.regulationOwnerSubmitStatus && !record.homologationEngineerSubmitStatus)))
+                  || (record.roleCode == 0 && record.taskAffirmStatus != 'List to confirm')"
+                 @click="edit(record)">
+                {{ $t('edit') }}
+              </a>
+              <a class="text-operation"
+                 v-else
+                 @click="viewClick(record)">
+                {{ $t('view') }}
+              </a>
+              <a class="text-operation"
+                 v-if="(record.inventoryAffirmStatus == 'Not started' || record.inventoryAffirmStatus == 'Rejected') && record.roleCode == 0"
+                 @click="deleteLib(record)">
+                {{ $t('deleteLib') }}
+              </a>
+              <a class="text-operation"
+                 @click="resultReportedClick(record)">
+                {{ $t('resultReported') }}
+              </a>
+
+        </span>
+        <span slot="operationOne" slot-scope="text,record">
+          <a class="text-operation"
+             @click="viewClick(record)">
+                {{ $t('view') }}
+          </a>
+        </span>
+        <span slot="titleName" slot-scope="text,record" :title="text">
+              <span class="textName">
+                 {{ text }}
+              </span>
+        </span>
+      </a-table>
+    </div>
+    <transferList :url="url" @transferListForm="transferListForm" ref="transferListRef"/>
+    <certificationDirectory :isDisplayNum="isDisplayNum" :url="url" ref="certificationDirectoryRef"/>
+    <batSetting :url="url" ref="batSettingRef" @batSettingForm="batSettingForm"/>
+    <addModel ref="addModelRef" @addModelForm="addModelForm"/>
+  </a-card>
+</template>
+
+<script>
+  import globalAdvancedQuery from '@/components/globalAdvancedQuery/index'
+  import certificationDirectory from '../certificationDirectory'
+  import ImportFile from '@/components/ImportFile/index'
+  import transferList from './components/transferList'
+  import addModel from './components/addModel'
+  import batSetting from './components/batSetting'
+  import { getAction, postAction, downloadFile, deleteAction } from '@/api/manage'
+
+  export default {
+    name: 'index',
+    components: {
+      globalAdvancedQuery,
+      ImportFile,
+      transferList,
+      certificationDirectory,
+      batSetting,
+      addModel
+    },
+    data() {
+      return {
+        queryParam: {},
+        fieldList: [],
+        queryParamQuery: {},
+        toggleSearchStatus: false,
+        url: {
+          list: '',
+          exportTemplate: '',
+          exportData: '',
+          deleteBatch: '',
+          setBatch: ''
+        },
+        processStatusList: [],
+        dataSource: [],
+        loading: false,
+        columns: [
+          {
+            title: this.$t('category'),
+            align: 'left',
+            dataIndex: 'category',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('inspectionItems'),
+            align: 'left',
+            dataIndex: 'inspectionItems',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('configurationItem'),
+            align: 'left',
+            dataIndex: 'configurationItem',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: 'WVTA ID',
+            align: 'left',
+            dataIndex: 'configurationItem',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('standardNo'),
+            align: 'left',
+            dataIndex: 'standardNo',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('areaOfResponsibility'),
+            align: 'left',
+            dataIndex: 'areaOfResponsibility',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('engineeringInterfacePerson'),
+            align: 'left',
+            dataIndex: 'engineeringInterfacePerson',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('personLiable'),
+            align: 'left',
+            dataIndex: 'personLiable',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('typeOfDeliverables'),
+            align: 'left',
+            dataIndex: 'typeOfDeliverables',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('DeliverablesResult'),
+            align: 'left',
+            dataIndex: 'DeliverablesResult',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('closingDate'),
+            align: 'left',
+            dataIndex: 'closingDate',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('ProcessStatus'),
+            align: 'left',
+            dataIndex: 'ProcessStatus',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('reportNo'),
+            align: 'left',
+            dataIndex: 'reportNo',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('productModel'),
+            align: 'left',
+            dataIndex: 'productModel',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('nameOfManufacturer'),
+            align: 'left',
+            dataIndex: 'nameOfManufacturer',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('CertificationProgress'),
+            align: 'left',
+            dataIndex: 'CertificationProgress',
+            width: 180,
+            ellipsis: true
+          },
+          {
+            title: this.$t('operation'),
+            align: 'left',
+            fixed: 'right',
+            width: 200,
+            scopedSlots: { customRender: 'operation' }
+          }
+        ],
+        selectedRowKeys: [],
+        selectedRowKeysList: [],
+        isDisplayNum: 2
+      }
+    },
+    methods: {
+      searchQuery() {
+        this.selectedRowKeys = []
+        this.getList()
+      },
+      searchReset() {
+        this.queryParam = {}
+        this.selectedRowKeys = []
+        this.$refs.globalAdvancedQueryRef.resetLine()
+        this.$refs.globalAdvancedQueryRef.emitCallback()
+      },
+      getPersonnelList() {
+        this.getList()
+      },
+      handleSuperQuery(params, matchType) {
+        let sqp = {}
+        if (!params || (params && params.length == 0)) {
+          sqp['superQueryParams'] = ''
+          this.$refs.globalAdvancedQueryRef.superQueryFlag = false
+        } else {
+          this.$refs.globalAdvancedQueryRef.superQueryFlag = true
+          sqp['superQueryParams'] = encodeURI(JSON.stringify(params))
+          sqp['superQueryMatchType'] = matchType
+        }
+        this.queryParamQuery = sqp
+        this.getList()
+      },
+      handleToggleSearch() {
+        this.toggleSearchStatus = !this.toggleSearchStatus
+      },
+      getList() {
+        let queryParam = JSON.parse(JSON.stringify(this.queryParam))
+        Object.keys(queryParam).forEach(val => {
+          if (queryParam[val] instanceof Array) {
+            queryParam[val] = queryParam[val].join(',')
+          }
+        })
+        let query = {
+          ...this.queryParamQuery,
+          ...queryParam,
+          projectLibraryId: this.$route.query.id
+        }
+        this.loading = true
+        getAction(this.url.list, query).then((res) => {
+          if (res.success) {
+            this.dataSource = res.result || []
+            this.loading = false
+            this.JLoading = false
+          } else {
+            this.JLoading = false
+            this.loading = false
+          }
+        })
+      },
+      transferClick() {
+        this.$refs.transferListRef.transferModel()
+      },
+      BatchSettingClick() {
+        this.$refs.batSettingRef.edit()
+      },
+      certificationClick() {
+        this.$refs.certificationDirectoryRef.addModel()
+      },
+      onSelectChange(value, rows) {
+        this.selectedRowKeys = value
+        this.selectedRowKeysList = rows
+      },
+      handleModule() {
+        downloadFile(this.url.exportTemplate, this.$t('listOfRegulations') + this.$t('importTemplate') + '.xls', {})
+      },
+      handleExport() {
+        let selectedRowKeys = JSON.parse(JSON.stringify(this.selectedRowKeys))
+        let query = {
+          ...this.queryParam,
+          ids: selectedRowKeys.join(','),
+          ...this.queryParamQuery,
+          excelName: this.$route.query.projectName,
+          projectLibraryId: this.$route.query.id
+        }
+        downloadFile(this.url.exportData, this.$route.query.projectName + '.zip', query, this.Deselect)
+      },
+      handleDel() {
+        if (this.selectedRowKeys && this.selectedRowKeys.length > 0) {
+          let _this = this
+          let selectedRowKeys = JSON.parse(JSON.stringify(_this.selectedRowKeys))
+          let isTrue = false
+          for (let i = 0; i < this.dataSource.length; i++) {
+            for (let j = 0; j < selectedRowKeys.length; j++) {
+              if (this.dataSource[i].id == selectedRowKeys[j]) {
+                if (this.dataSource[i].inventoryAffirmStatus == 'Not started' || this.dataSource[i].inventoryAffirmStatus == 'Rejected') {
+                  isTrue = true
+                } else {
+                  isTrue = false
+                  this.$message.warning(this.$t('onlyDeleted'))
+                  return
+                }
+              }
+            }
+          }
+          if (isTrue) {
+            this.$confirm({
+              content: _this.$t('ConfirmBatchDeletion'),
+              onOk() {
+                let idList = JSON.parse(JSON.stringify(_this.selectedRowKeys))
+                postAction(_this.url.deleteBatch, {
+                  ids: idList.join(','),
+                  projectLibraryId: _this.$route.query.id
+                }).then((res) => {
+                  if (res.success) {
+                    _this.$message.success(_this.$t('OperationSuccessful'))
+                    _this.selectedRowKeys = []
+                    _this.getList()
+                  } else {
+                    _this.$message.warning(res.message)
+                  }
+                })
+              }
+            })
+          }
+        } else {
+          this.$message.warning(this.$t('selectLeastOne'))
+        }
+      },
+      processResetClick() {
+
+      },
+      handleAdd() {
+        this.$refs.addModelRef.addModel()
+      },
+      releaseClick() {
+
+      },
+      withdrawClick() {
+
+      },
+      questionClick() {
+
+      },
+      transferListForm() {
+        this.getList()
+      },
+      batSettingForm() {
+
+      },
+      addModelForm() {
+
+      }
+    }
+  }
+</script>
+
+
+<style lang="less" scoped>
+  @import '~@assets/less/common.less';
+
+  .doc-detail {
+    background: #fff;
+    height: 100%;
+
+    .Virtual-detail-header {
+      width: 100%;
+      height: 68px;
+      line-height: 68px;
+      padding: 0 32px 0 32px;
+      box-sizing: border-box;
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 2px #eff1f3 solid;
+      background: #fff;
+
+      .Virtual-detail-title {
+        display: inline-block;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+        font-size: 20px;
+        font-weight: 400;
+        color: #040B29;
+        line-height: 68px;
+      }
+
+      .doc-detail-right {
+        width: 800px;
+        line-height: 68px;
+        display: flex;
+      }
+    }
+
+    .Virtual-detail-content {
+      padding: 0 38px 0 38px;
+      box-sizing: border-box;
+      font-size: 16px;
+
+      .box-title-text-add {
+        line-height: 1.4;
+      }
+
+      .title-text-add {
+        display: inline-block;
+        font-weight: 500;
+        margin-right: 16px;
+        height: 42px;
+        line-height: 42px;
+      }
+    }
+  }
+
+  .header-text {
+    font-size: 16px;
+    font-weight: 400;
+    height: 60px;
+    color: #000F16;
+    line-height: 40px;
+  }
+
+  .box-title-text {
+    line-height: 1.4;
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+
+  .box-title-text-index {
+    line-height: 1.4;
+    display: flex;
+  }
+
+  .title-text {
+    width: 110px;
+    color: #000F16;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    margin-top: 3px;
+    text-align: right;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .title-text-index {
+    width: 110px;
+    color: #000F16;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    margin-top: 3px;
+    text-align: right;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    line-height: 40px;
+  }
+
+  .box-input {
+    display: inline-block;
+    width: calc(100% - 126px);
+    height: 38px;
+    margin-top: 2px;
+  }
+
+  .Required {
+    color: red;
+    margin-right: 4px;
+  }
+
+  .box-button {
+    height: 38px;
+  }
+
+  .text-operation {
+    margin-right: 8px;
+  }
+
+  .page {
+    text-align: right;
+    margin-top: 20px;
+  }
+
+  .operator-text-left {
+    font-size: 14px;
+    margin-right: 20px;
+    background: #eff1f3;
+    padding: 8px 8px;
+    cursor: pointer;
+    border-radius: 4px;
+  }
+
+  /deep/ .ant-popover-buttons {
+    display: none !important;
+  }
+
+  .operator-text-title {
+    cursor: pointer;
+    margin-right: 22px;
+    font-size: 14px;
+    font-weight: 400;
+    color: #040B29;
+    margin-bottom: 22px;
+  }
+
+  .customize-text {
+    height: 1533px;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+  }
+
+  .customize-text-title {
+    margin-left: 0;
+    font-size: 14px;
+    font-weight: 400;
+    color: #040B29;
+    margin-bottom: 22px;
+  }
+
+  .drawer-bootom-button {
+    position: absolute;
+    bottom: 0;
+    z-index: 100;
+    width: 100%;
+    border-top: 1px solid #e8e8e8;
+    padding: 10px 16px;
+    text-align: right;
+    left: 0;
+    background: #fff;
+    border-radius: 0 0 2px 2px;
+  }
+
+  .itemModelComment {
+    width: calc(100% - 64px);
+    display: inline-block;
+    margin-top: 2px;
+  }
+
+  .title-text-Comment {
+    width: 74px;
+    text-align: right;
+    display: inline-block;
+    font-weight: 500;
+    font-size: 14px;
+    margin-right: 16px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    height: 42px;
+    line-height: 48px;
+  }
+
+  .textName {
+    width: 100%;
+    overflow: hidden;
+    display: -webkit-box;
+    text-overflow: ellipsis;
+    /*! autoprefixer: off */
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 1;
+    /*! autoprefixer: on;*/
+    text-justify: inter-ideograph;
+    word-break: break-all
+  }
+
+  .buttom-box {
+    width: 100%;
+    text-align: right;
+    font-size: 16px;
+    font-weight: 500;
+    color: #000F16;
+  }
+
+  ::v-deep .ant-card-body {
+    padding: 24px 24px 0 24px;
+  }
+
+  ::v-deep .ant-table-row:first-child {
+    background: #fff !important;
+    opacity: 0.9;
+  }
+
+  ::v-deep .ant-table-body {
+    background: transparent !important;
+  }
+
+  ::v-deep .ant-table-body::-webkit-scrollbar {
+    z-index: 10000000;
+  }
+
+  /*::v-deep .ant-table .ant-table-fixed-left {*/
+  /*  height: auto !important;*/
+  /*  bottom: 8px !important;*/
+  /*}*/
+
+  /*::v-deep .ant-table .ant-table-fixed-right {*/
+  /*  height: auto !important;*/
+  /*  bottom: 8px !important;*/
+  /*}*/
+
+  ::v-deep .ant-table-fixed-header .ant-table-body-inner {
+    overflow: visible;
+  }
+
+  /*::v-deep .ant-table-fixed-left .ant-table-body-inner {*/
+  /*  overflow-y: scroll;*/
+  /*}*/
+
+  /*::v-deep .ant-table-fixed-right .ant-table-body-inner {*/
+  /*  overflow-y: scroll;*/
+  /*}*/
+  //::v-deep .ant-table-body {
+  //  padding-bottom: 7px;
+  //}
+
+  ::v-deep .ant-table-body-inner {
+    padding-bottom: 10px;
+  }
+
+  ::v-deep .ant-table-scroll .ant-table-header::-webkit-scrollbar {
+    /*height: 0;*/
+    width: 0;
+  }
+
+  ::v-deep .ant-table-body-one {
+    padding-bottom: 0 !important;
+  }
+
+  ::v-deep .antfixedLeft {
+    padding-bottom: 0 !important;
+    overflow: scroll !important;
+  }
+
+  ::v-deep .antfixedRight {
+    padding-bottom: 0 !important;
+    overflow: scroll !important;
+  }
+</style>
+<style lang="less">
+  .box-input .ant-select-selection {
+    height: 38px !important;
+  }
+
+  .box-input .ant-select-selection__rendered {
+    line-height: 38px;
+  }
+
+  .popconfirm {
+    z-index: 999;
+  }
+
+  .popconfirm .ant-popover-buttons {
+    display: none !important;
+  }
+
+  .popconfirm .anticon-exclamation-circle {
+    display: none !important;
+  }
+
+  .popconfirmmize {
+    z-index: 999;
+  }
+
+  .popconfirmmize .ant-popover-buttons {
+    display: none !important;
+  }
+
+  .popconfirmmize .anticon-exclamation-circle {
+    display: none !important;
+  }
+
+  .popconfirmmize .ant-popover-message {
+    padding: 4px 0 36px !important;
+  }
+
+  .ant-table-placeholder {
+    padding: 0;
+    border-top: none;
+  }
+
+  .itemModelComment .ant-form-item-control-wrapper {
+    width: 100% !important;
+  }
+
+  .second {
+    padding: 0 !important;
+  }
+</style>
\ No newline at end of file