diff --git a/src/api/quality-management/first-article-inspection-configuration.js b/src/api/quality-management/first-article-inspection-configuration.js
index d529aa79..875904f3 100644
--- a/src/api/quality-management/first-article-inspection-configuration.js
+++ b/src/api/quality-management/first-article-inspection-configuration.js
@@ -1,10 +1,12 @@
 import { request } from '@/api/_service'
 
 const BASE = 'quality_control/first_inspection/first_inspection/'
+const PROCESS_STEP_BASE = 'production_configuration/technology_model/technology_flow_workingsubclass/'
 
 function apiParams (data = {}, method = 'get.setting.list', platform = 'api') {
   return { method, platform, ...data }
 }
+
 export function fetchFirstArticleInspectionConfigurationList (data = {}) {
   return request({
     url: BASE + 'list',
@@ -37,3 +39,54 @@ export function deleteFirstArticleInspectionConfiguration (data = {}) {
   })
 }
 
+export function getQualityCategoryAll (data = {}) {
+  return request({
+    url: BASE + 'category/all',
+    method: 'post',
+    data: apiParams(data, 'get.quality.category.all', 'api')
+  })
+}
+
+export function getWorkingsubclassAll (data = {}) {
+  return request({
+    url: PROCESS_STEP_BASE + 'all',
+    method: 'get',
+    params: {
+      method: 'production_configuration_technology_model_technology_flow_workingsubclass_all',
+      platform: 'background',
+      ...data
+    }
+  })
+}
+
+export function fetchSettingItemList (data = {}) {
+  return request({
+    url: BASE + 'item/list',
+    method: 'post',
+    data: apiParams(data, 'get.setting.item.list', 'api')
+  })
+}
+
+export function createSettingItem (data = {}) {
+  return request({
+    url: BASE + 'item/add',
+    method: 'post',
+    data: apiParams(data, 'add.setting.item', 'admin')
+  })
+}
+
+export function editSettingItem (data = {}) {
+  return request({
+    url: BASE + 'item/update',
+    method: 'post',
+    data: apiParams(data, 'set.setting.item', 'admin')
+  })
+}
+
+export function deleteSettingItem (data = {}) {
+  return request({
+    url: BASE + 'item/delete',
+    method: 'post',
+    data: apiParams(data, 'del.setting.item', 'admin')
+  })
+}
diff --git a/src/locales/en.json b/src/locales/en.json
index d83c14fd..a8eb082d 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -3346,10 +3346,12 @@
 				"confirm_delete": "Are you sure to delete?",
 				"required": "Required",
 				"please_enter": "Please enter",
+				"please_select": "Please select",
 				"create_time": "Created At",
 				"created_at": "Created At",
 				"updated_at": "Updated At",
 				"nickname": "Creator",
+				"creator": "Creator",
 				"batch_no": "Batch No.",
 				"product_no": "Product Code",
 				"inspection_item": "Inspection Item",
@@ -3383,10 +3385,57 @@
 				"node_data_name": "Node Data Name",
 				"node_data_code": "Node Data Code",
 				"working_subclass": "Shift",
-				"project_name": "Project Name",
+				"project_name": "Item Name",
 				"subgroup_id": "Subgroup",
 				"sampling_time": "Sampling Time",
-				"sample_value": "Sample Value"
+				"sample_value": "Sample Value",
+				"process_unit": "Process Unit",
+				"time_range": "Time Range",
+				"to": "To",
+				"start_date": "Start Date",
+				"end_date": "End Date",
+				"process_unit_required": "Please select process unit",
+				"inspection_type_required": "Please select inspection type",
+				"is_required": "Required Inspection",
+				"is_required_tooltip": "Controls whether this item must be inspected during first/patrol inspection entry.",
+				"yes": "Yes",
+				"no": "No",
+				"select_operate_data": "Please select data to operate",
+				"configure_item": "Configure Items",
+				"configure_item_title": "First Article Inspection Item Configuration",
+				"add_item": "Add Item",
+				"add_item_title": "Add Inspection Item",
+				"edit_item_title": "Edit Inspection Item",
+				"project_code": "Item Code",
+				"process_requirement": "Process Requirement",
+				"judgment_type": "Judgment Type",
+				"inspection_check_type": "Inspection Judgment Type",
+				"judgment_standard": "Judgment Standard",
+				"unit": "Unit",
+				"inspection_tool": "Inspection Tool",
+				"inspection_quantity": "Inspection Quantity",
+				"enumeration": "Enumeration",
+				"numeric": "Numeric",
+				"limit": "Limit",
+				"unknown": "Unknown",
+				"please_project_code": "Please enter item code",
+				"please_project_name": "Please enter item name",
+				"please_process_requirement": "Please enter process requirement",
+				"please_select_inspection_type": "Please select judgment type",
+				"please_enter_unit": "Please enter unit",
+				"please_enter_inspection_tool": "Please enter inspection tool",
+				"please_enter_inspection_quantity": "Please enter inspection quantity",
+				"upper_limit": "Upper Limit",
+				"lower_limit": "Lower Limit",
+				"upper_limit_label": "Upper Limit",
+				"lower_limit_label": "Lower Limit",
+				"please_enter_upper_limit": "Please enter upper limit",
+				"please_enter_lower_limit": "Please enter lower limit",
+				"please_enter_numeric_value": "Please enter numeric value",
+				"project_code_required": "Please enter item code",
+				"project_name_required": "Please enter item name",
+				"inspection_check_type_required": "Please select judgment type",
+				"delete_confirm": "Are you sure to delete this item?"
 			},
 			"first_article_inspection_records": {
 				"search": "Search",
diff --git a/src/locales/zh-chs.json b/src/locales/zh-chs.json
index bb0491fc..87ecfa8f 100644
--- a/src/locales/zh-chs.json
+++ b/src/locales/zh-chs.json
@@ -3346,10 +3346,12 @@
 				"confirm_delete": "确定要执行该操作吗?",
 				"required": "必填项",
 				"please_enter": "请输入",
+				"please_select": "请选择",
 				"create_time": "创建时间",
 				"created_at": "创建时间",
 				"updated_at": "更新时间",
 				"nickname": "创建人",
+				"creator": "创建人",
 				"batch_no": "批次号",
 				"product_no": "产品编码",
 				"inspection_item": "检验项目",
@@ -3363,7 +3365,7 @@
 				"material_name": "物料名称",
 				"inspection_status": "检验状态",
 				"result": "结果",
-				"inspection_type": "检验类型",
+				"inspection_type": "检验类别",
 				"standard_value": "标准值",
 				"aql_value": "AQL值",
 				"sampling_plan_name": "抽样方案",
@@ -3386,7 +3388,54 @@
 				"project_name": "项目名称",
 				"subgroup_id": "子组",
 				"sampling_time": "采样时间",
-				"sample_value": "样本值"
+				"sample_value": "样本值",
+				"process_unit": "工序单元",
+				"time_range": "时间范围",
+				"to": "至",
+				"start_date": "开始日期",
+				"end_date": "结束日期",
+				"process_unit_required": "请选择工序单元",
+				"inspection_type_required": "请选择检验类别",
+				"is_required": "是否必检",
+				"is_required_tooltip": "配置后在首巡检录入时用于控制该项目是否必须检验",
+				"yes": "是",
+				"no": "否",
+				"select_operate_data": "请选择要操作的数据",
+				"configure_item": "配置项目",
+				"configure_item_title": "首巡检项目配置",
+				"add_item": "新增项目",
+				"add_item_title": "新增检验项目",
+				"edit_item_title": "编辑检验项目",
+				"project_code": "项目编码",
+				"process_requirement": "工艺要求",
+				"judgment_type": "判定类型",
+				"inspection_check_type": "检验判定类型",
+				"judgment_standard": "判定标准",
+				"unit": "单位",
+				"inspection_tool": "检验工具",
+				"inspection_quantity": "检验数量",
+				"enumeration": "枚举",
+				"numeric": "数值",
+				"limit": "极限",
+				"unknown": "未知",
+				"please_project_code": "请输入项目编码",
+				"please_project_name": "请输入项目名称",
+				"please_process_requirement": "请输入工艺要求",
+				"please_select_inspection_type": "请选择检验判定类型",
+				"please_enter_unit": "请输入单位",
+				"please_enter_inspection_tool": "请输入检验工具",
+				"please_enter_inspection_quantity": "请输入检验数量",
+				"upper_limit": "上限",
+				"lower_limit": "下限",
+				"upper_limit_label": "上限",
+				"lower_limit_label": "下限",
+				"please_enter_upper_limit": "请输入上限",
+				"please_enter_lower_limit": "请输入下限",
+				"please_enter_numeric_value": "请输入数值",
+				"project_code_required": "请输入项目编码",
+				"project_name_required": "请输入项目名称",
+				"inspection_check_type_required": "请选择检验判定类型",
+				"delete_confirm": "确定删除该项目吗?"
 			},
 			"first_article_inspection_records": {
 				"search": "查询",
diff --git a/src/views/quality-management/process-control/first-article-inspection-configuration/components/SettingItemsDialog/index.vue b/src/views/quality-management/process-control/first-article-inspection-configuration/components/SettingItemsDialog/index.vue
new file mode 100644
index 00000000..8e769df4
--- /dev/null
+++ b/src/views/quality-management/process-control/first-article-inspection-configuration/components/SettingItemsDialog/index.vue
@@ -0,0 +1,315 @@
+<template>
+  <el-dialog
+    :visible.sync="visibleProxy"
+    :title="dialogTitle"
+    width="1000px"
+    append-to-body
+    :close-on-click-modal="false"
+    @open="onOpen"
+    @close="onClose"
+  >
+    <page-table
+      ref="pageTable"
+      :columns="columns"
+      :data="tableData"
+      :loading="loading"
+      :toolbar-buttons="toolbarButtons"
+      :row-buttons="rowButtons"
+      :pagination="pagination"
+      height="420px"
+      @page-change="onPageChange"
+    >
+      <template #col-itemType="{ row }">
+        <span>{{ typeText(row.type) }}</span>
+      </template>
+    </page-table>
+
+    <page-dialog-form
+      ref="itemForm"
+      :visible.sync="formVisible"
+      :title="formTitle"
+      width="760px"
+      :form-cols="formCols"
+      :form-data="formData"
+      :rules="rules"
+      label-width="120px"
+      :submitting="submitting"
+      :confirm-text="key('confirm')"
+      :cancel-text="key('cancel')"
+      @submit="onSubmit"
+      @close="resetForm"
+    />
+
+    <template #footer>
+      <el-button size="small" @click="visibleProxy = false">{{ $t(key('cancel')) }}</el-button>
+      <el-button type="primary" size="small" @click="visibleProxy = false">{{ $t(key('confirm')) }}</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+import { useTableColumns } from '@/composables/useTableColumns'
+import { useTableButtons } from '@/composables/useTableButtons'
+import { i18nMixin } from '@/composables/useI18n'
+import { confirmMixin } from '@/composables/useConfirmHandle'
+import {
+  fetchSettingItemList,
+  createSettingItem,
+  editSettingItem,
+  deleteSettingItem
+} from '@/api/quality-management/first-article-inspection-configuration'
+import PageTable from '@/components/page-table'
+import PageDialogForm from '@/components/page-dialog-form'
+
+function readList (res) {
+  if (Array.isArray(res)) return { list: res, total: res.length }
+  const data = res && res.data ? res.data : res
+  if (Array.isArray(data)) return { list: data, total: data.length }
+  const list = (data && (data.list || data.rows || data.records || data.data)) || []
+  const total = data && (data.total || data.count || list.length)
+  return { list: Array.isArray(list) ? list : [], total: Number(total) || 0 }
+}
+
+export default {
+  name: 'SettingItemsDialog',
+  components: { PageTable, PageDialogForm },
+  mixins: [i18nMixin('page.quality_management.first_article_inspection_configuration'), confirmMixin],
+  props: {
+    visible: { type: Boolean, default: false },
+    settingRow: { type: Object, default: null }
+  },
+  data () {
+    return {
+      loading: false,
+      submitting: false,
+      tableData: [],
+      pagination: { current: 1, size: 10, total: 0 },
+      formVisible: false,
+      formTitle: '',
+      handleType: 'create',
+      editId: '',
+      formData: this.emptyForm(),
+      columns: [],
+      toolbarButtons: [],
+      rowButtons: [],
+      rules: {
+        code: [{ required: true, message: this.key('project_code_required'), trigger: 'blur' }],
+        name: [{ required: true, message: this.key('project_name_required'), trigger: 'blur' }],
+        type: [{ required: true, message: this.key('inspection_check_type_required'), trigger: 'change' }]
+      }
+    }
+  },
+  computed: {
+    visibleProxy: {
+      get () { return this.visible },
+      set (val) { this.$emit('update:visible', val) }
+    },
+    dialogTitle () {
+      const name = this.settingRow && this.settingRow.workingsubclass_name ? this.settingRow.workingsubclass_name : ''
+      return name ? `${this.$t(this.key('configure_item_title'))}（${name}）` : this.$t(this.key('configure_item_title'))
+    },
+    typeOptions () {
+      return [
+        { label: this.$t(this.key('enumeration')), value: '1' },
+        { label: this.$t(this.key('numeric')), value: '2' },
+        { label: this.$t(this.key('limit')), value: '3' }
+      ]
+    },
+    formCols () {
+      const cols = [
+        [
+          { type: 'input', prop: 'code', label: this.key('project_code'), placeholder: this.key('please_project_code'), clearable: true, style: { width: '90%' } },
+          { type: 'input', prop: 'name', label: this.key('project_name'), placeholder: this.key('please_project_name'), clearable: true, style: { width: '90%' } }
+        ],
+        [
+          { type: 'input', prop: 'method', label: this.key('process_requirement'), placeholder: this.key('please_process_requirement'), clearable: true, style: { width: '90%' } },
+          { type: 'select', prop: 'type', label: this.key('inspection_check_type'), placeholder: this.key('please_select_inspection_type'), options: this.typeOptions, clearable: true, style: { width: '90%' }, onChange: this.onTypeChange }
+        ]
+      ]
+
+      if (String(this.formData.type) === '1') {
+        cols.push([
+          { type: 'input', prop: 'standard', label: this.key('judgment_standard'), placeholder: this.key('please_enter'), disabled: true, style: { width: '90%' } },
+          { type: 'input', prop: 'unit', label: this.key('unit'), placeholder: this.key('please_enter_unit'), clearable: true, style: { width: '90%' } }
+        ])
+      } else if (String(this.formData.type) === '2') {
+        cols.push([
+          { type: 'input', prop: 'lower', label: this.key('lower_limit'), placeholder: this.key('please_enter_lower_limit'), clearable: true, style: { width: '90%' } },
+          { type: 'input', prop: 'ceiling', label: this.key('upper_limit'), placeholder: this.key('please_enter_upper_limit'), clearable: true, style: { width: '90%' } }
+        ])
+        cols.push([
+          { type: 'input', prop: 'unit', label: this.key('unit'), placeholder: this.key('please_enter_unit'), clearable: true, style: { width: '90%' } }
+        ])
+      } else if (String(this.formData.type) === '3') {
+        cols.push([
+          { type: 'select', prop: 'standard', label: this.key('judgment_standard'), placeholder: this.key('please_select'), options: [{ label: this.$t(this.key('upper_limit_label')), value: '上限' }, { label: this.$t(this.key('lower_limit_label')), value: '下限' }], clearable: true, style: { width: '90%' } },
+          { type: 'input', prop: 'numeric', label: this.key('numeric'), placeholder: this.key('please_enter_numeric_value'), clearable: true, style: { width: '90%' } }
+        ])
+        cols.push([
+          { type: 'input', prop: 'unit', label: this.key('unit'), placeholder: this.key('please_enter_unit'), clearable: true, style: { width: '90%' } }
+        ])
+      }
+
+      if (this.formData.type) {
+        cols.push([
+          { type: 'input', prop: 'tools', label: this.key('inspection_tool'), placeholder: this.key('please_enter_inspection_tool'), clearable: true, style: { width: '90%' } },
+          { type: 'input', prop: 'quantity', label: this.key('inspection_quantity'), placeholder: this.key('please_enter_inspection_quantity'), clearable: true, style: { width: '90%' } }
+        ])
+      }
+      return cols
+    }
+  },
+  created () {
+    this.columns = useTableColumns([
+      { prop: 'code', label: this.key('project_code'), minWidth: 120, showOverflowTooltip: true },
+      { prop: 'name', label: this.key('project_name'), minWidth: 120, showOverflowTooltip: true },
+      { prop: 'method', label: this.key('process_requirement'), minWidth: 150, showOverflowTooltip: true },
+      { prop: 'type', label: this.key('judgment_type'), minWidth: 110, slot: 'itemType' },
+      { prop: 'standard', label: this.key('judgment_standard'), minWidth: 140, showOverflowTooltip: true },
+      { prop: 'unit', label: this.key('unit'), minWidth: 90, showOverflowTooltip: true },
+      { prop: 'tools', label: this.key('inspection_tool'), minWidth: 130, showOverflowTooltip: true },
+      { prop: 'quantity', label: this.key('inspection_quantity'), minWidth: 120, showOverflowTooltip: true },
+      { prop: '_actions', label: this.key('operation'), width: 140, fixed: 'right' }
+    ], { selectionWidth: 0 })
+    const btns = useTableButtons({
+      toolbar: [{ key: 'add_item', label: this.key('add_item'), icon: 'el-icon-plus', type: 'primary', auth: '/quality_control/first_inspection/setting/update', onClick: this.openAdd }],
+      row: [
+        { key: 'edit', label: this.key('edit'), icon: 'el-icon-edit', auth: '/quality_control/first_inspection/setting/update', onClick: this.openEdit },
+        { key: 'delete', label: this.key('delete'), icon: 'el-icon-delete', color: 'danger', auth: '/quality_control/first_inspection/setting/delete', onClick: this.handleDelete }
+      ]
+    }, this.$permission)
+    this.toolbarButtons = btns.toolbarButtons
+    this.rowButtons = btns.rowButtons
+  },
+  methods: {
+    emptyForm () {
+      return {
+        quality_process_setting_id: undefined,
+        code: '',
+        name: '',
+        method: '',
+        type: '',
+        standard: '',
+        lower: '',
+        ceiling: '',
+        numeric: '',
+        unit: '',
+        tools: '',
+        quantity: ''
+      }
+    },
+    typeText (type) {
+      const map = { 1: 'enumeration', 2: 'numeric', 3: 'limit' }
+      return this.$t(this.key(map[Number(type)] || 'unknown'))
+    },
+    onOpen () {
+      this.pagination.current = 1
+      this.fetchData()
+    },
+    onClose () {
+      this.tableData = []
+      this.resetForm()
+      this.$emit('saved')
+    },
+    async fetchData () {
+      if (!this.settingRow || !this.settingRow.id) return
+      this.loading = true
+      try {
+        const res = await fetchSettingItemList({
+          page_no: this.pagination.current,
+          page_size: this.pagination.size,
+          quality_process_setting_id: this.settingRow.id
+        })
+        const { list, total } = readList(res)
+        this.tableData = list
+        this.pagination.total = total
+      } finally {
+        this.loading = false
+      }
+    },
+    onPageChange (page) {
+      this.pagination.current = page.current
+      this.pagination.size = page.size
+      this.fetchData()
+    },
+    openAdd () {
+      this.handleType = 'create'
+      this.formTitle = this.key('add_item_title')
+      this.resetForm()
+      this.formData.quality_process_setting_id = this.settingRow && this.settingRow.id
+      this.formVisible = true
+    },
+    openEdit (row) {
+      const range = String(row.type) === '2' && row.standard ? String(row.standard).split('~') : []
+      this.handleType = 'edit'
+      this.editId = row.id
+      this.formTitle = this.key('edit_item_title')
+      this.formData = {
+        ...this.emptyForm(),
+        ...row,
+        quality_process_setting_id: this.settingRow && this.settingRow.id,
+        type: row.type === undefined || row.type === null ? '' : String(row.type),
+        lower: range[0] || '',
+        ceiling: range[1] || '',
+        numeric: row.numeric || ''
+      }
+      this.formVisible = true
+    },
+    resetForm () {
+      this.formData = this.emptyForm()
+      this.editId = ''
+    },
+    onTypeChange (value) {
+      if (String(value) === '1') {
+        this.formData.standard = 'GOOD:NG'
+        this.formData.lower = ''
+        this.formData.ceiling = ''
+        this.formData.numeric = ''
+      } else if (String(value) === '2') {
+        this.formData.standard = ''
+        this.formData.numeric = ''
+      } else if (String(value) === '3') {
+        this.formData.standard = ''
+        this.formData.lower = ''
+        this.formData.ceiling = ''
+      }
+    },
+    buildSubmitData () {
+      const data = { ...this.formData, quality_process_setting_id: this.settingRow && this.settingRow.id }
+      if (String(data.type) === '2') data.standard = `${data.lower || ''}~${data.ceiling || ''}`
+      if (String(data.type) === '1') data.standard = 'GOOD:NG'
+      delete data.lower
+      delete data.ceiling
+      return data
+    },
+    async onSubmit () {
+      this.submitting = true
+      try {
+        const data = this.buildSubmitData()
+        if (this.handleType === 'create') {
+          await createSettingItem(data)
+        } else {
+          await editSettingItem({ ...data, id: this.editId })
+        }
+        this.$message.success(this.$t(this.key('operation_success')))
+        this.formVisible = false
+        this.fetchData()
+      } finally {
+        this.submitting = false
+      }
+    },
+    async handleDelete (row) {
+      const cancelled = await this.$confirmAction({
+        message: this.key('delete_confirm'),
+        title: this.key('tip'),
+        confirmButtonText: this.key('confirm'),
+        cancelButtonText: this.key('cancel'),
+        closeOnClickModal: false
+      }, () => deleteSettingItem({ id: row.id }))
+      if (cancelled) return
+      this.$message.success(this.$t(this.key('operation_success')))
+      this.fetchData()
+    }
+  }
+}
+</script>
diff --git a/src/views/quality-management/process-control/first-article-inspection-configuration/index.vue b/src/views/quality-management/process-control/first-article-inspection-configuration/index.vue
index f456d03c..656514ab 100644
--- a/src/views/quality-management/process-control/first-article-inspection-configuration/index.vue
+++ b/src/views/quality-management/process-control/first-article-inspection-configuration/index.vue
@@ -3,31 +3,32 @@
     <template #header>
       <div class="search-bar">
         <el-form :inline="true" size="mini">
-          <el-form-item :label="$t(key('code'))">
-            <el-input
-              v-model="search.code"
-              :placeholder="$t(key('please_enter'))"
-              clearable
-              style="width:200px"
-              @keyup.enter.native="onSearch"
-            />
+          <el-form-item :label="$t(key('process_unit'))">
+            <el-select v-model="search.workingsubclass_id" :placeholder="$t(key('please_select'))" clearable filterable style="width:180px">
+              <el-option v-for="item in workingsubclassOptions" :key="item.id" :label="item.name" :value="item.id" />
+            </el-select>
           </el-form-item>
-          <el-form-item :label="$t(key('name'))">
-            <el-input
-              v-model="search.name"
-              :placeholder="$t(key('please_enter'))"
-              clearable
-              style="width:200px"
-              @keyup.enter.native="onSearch"
+          <el-form-item :label="$t(key('inspection_type'))">
+            <el-select v-model="search.type" :placeholder="$t(key('please_select'))" clearable filterable style="width:180px">
+              <el-option v-for="item in categoryOptions" :key="item.id" :label="item.name" :value="item.id" />
+            </el-select>
+          </el-form-item>
+          <el-form-item :label="$t(key('time_range'))">
+            <el-date-picker
+              v-model="search.create_time"
+              type="datetimerange"
+              :range-separator="$t(key('to'))"
+              :start-placeholder="$t(key('start_date'))"
+              :end-placeholder="$t(key('end_date'))"
+              format="yyyy-MM-dd HH:mm:ss"
+              value-format="yyyy-MM-dd HH:mm:ss"
+              :default-time="['00:00:00', '23:59:59']"
+              style="width:360px"
             />
           </el-form-item>
           <el-form-item>
-            <el-button type="primary" icon="el-icon-search" @click="onSearch">
-              {{ $t(key('search')) }}
-            </el-button>
-            <el-button icon="el-icon-refresh" @click="onReset">
-              {{ $t(key('reset')) }}
-            </el-button>
+            <el-button type="primary" icon="el-icon-search" @click="onSearch">{{ $t(key('search')) }}</el-button>
+            <el-button icon="el-icon-refresh" @click="onReset">{{ $t(key('reset')) }}</el-button>
           </el-form-item>
         </el-form>
       </div>
@@ -41,6 +42,8 @@
       :toolbar-buttons="toolbarButtons"
       :row-buttons="rowButtons"
       :pagination="pagination"
+      :table-attrs="{ highlightCurrentRow: true }"
+      :table-listeners="{ 'sort-change': handleSort }"
       help-url="/help/quality-management/first-article-inspection-configuration"
       :help-text="$t(ckey('help'))"
       auto-height
@@ -52,7 +55,7 @@
       ref="dialogForm"
       :visible.sync="dialogVisible"
       :title="dialogTitle"
-      width="520px"
+      width="560px"
       :form-cols="formCols"
       :form-data="formData"
       :rules="rules"
@@ -62,7 +65,22 @@
       :cancel-text="key('cancel')"
       @submit="onDialogSubmit"
       @close="onDialogClose"
-    />
+    >
+      <el-form-item prop="is_need">
+        <template #label>
+          <span>{{ $t(key('is_required')) }}</span>
+          <el-tooltip effect="dark" :content="$t(key('is_required_tooltip'))" placement="top-start">
+            <i class="el-icon-question" />
+          </el-tooltip>
+        </template>
+        <el-radio-group v-model="formData.is_need">
+          <el-radio :label="1">{{ $t(key('yes')) }}</el-radio>
+          <el-radio :label="0">{{ $t(key('no')) }}</el-radio>
+        </el-radio-group>
+      </el-form-item>
+    </page-dialog-form>
+
+    <setting-items-dialog :visible.sync="itemsDialogVisible" :setting-row="currentSetting" @saved="fetchData" />
   </d2-container>
 </template>
 
@@ -75,10 +93,13 @@ import {
   fetchFirstArticleInspectionConfigurationList,
   createFirstArticleInspectionConfiguration,
   editFirstArticleInspectionConfiguration,
-  deleteFirstArticleInspectionConfiguration
+  deleteFirstArticleInspectionConfiguration,
+  getQualityCategoryAll,
+  getWorkingsubclassAll
 } from '@/api/quality-management/first-article-inspection-configuration'
 import PageTable from '@/components/page-table'
 import PageDialogForm from '@/components/page-dialog-form'
+import SettingItemsDialog from './components/SettingItemsDialog'
 
 function readList (res) {
   if (Array.isArray(res)) return { list: res, total: res.length }
@@ -91,7 +112,7 @@ function readList (res) {
 
 export default {
   name: 'quality-management-first-article-inspection-configuration',
-  components: { PageTable, PageDialogForm },
+  components: { PageTable, PageDialogForm, SettingItemsDialog },
   mixins: [i18nMixin('page.quality_management.first_article_inspection_configuration'), confirmMixin],
   data () {
     return {
@@ -101,120 +122,87 @@ export default {
       selectedRows: [],
       dialogVisible: false,
       dialogTitle: '',
+      itemsDialogVisible: false,
+      currentSetting: null,
       editId: '',
       handleType: 'create',
-      search: {"code":"","name":""},
+      search: { workingsubclass_id: undefined, type: undefined, create_time: undefined },
+      order: { order_type: undefined, order_field: undefined },
       pagination: { current: 1, size: 10, total: 0 },
-      formData: {"code":"","name":"","category_id":"","note":""},
+      workingsubclassOptions: [],
+      categoryOptions: [],
+      formData: { workingsubclass_id: undefined, quality_category_id: undefined, note: '', is_need: 0 },
       rules: {
-        code: [
-          { required: true, message: this.key('required'), trigger: 'blur' }
-        ],
-        name: [
-          { required: true, message: this.key('required'), trigger: 'blur' }
-        ]
+        workingsubclass_id: [{ required: true, message: this.key('process_unit_required'), trigger: 'change' }],
+        quality_category_id: [{ required: true, message: this.key('inspection_type_required'), trigger: 'change' }]
       },
       columns: [],
       toolbarButtons: [],
-      rowButtons: [],
-      formCols: [
+      rowButtons: []
+    }
+  },
+  computed: {
+    formCols () {
+      return [
         [
-          {
-            type: 'input',
-            prop: 'code',
-            label: this.key('code'),
-            placeholder: this.key('please_enter'),
-            clearable: true,
-            style: { width: '90%' }
-          }
+          { type: 'select', prop: 'workingsubclass_id', label: this.key('process_unit'), placeholder: this.key('please_select'), options: this.workingsubclassOptions.map(item => ({ label: item.name, value: item.id })), clearable: true, style: { width: '90%' } }
         ],
         [
-          {
-            type: 'input',
-            prop: 'name',
-            label: this.key('name'),
-            placeholder: this.key('please_enter'),
-            clearable: true,
-            style: { width: '90%' }
-          }
+          { type: 'select', prop: 'quality_category_id', label: this.key('inspection_type'), placeholder: this.key('please_select'), options: this.categoryOptions.map(item => ({ label: item.name, value: item.id })), clearable: true, style: { width: '90%' } }
         ],
         [
-          {
-            type: 'input',
-            prop: 'category_id',
-            label: this.key('category_id'),
-            placeholder: this.key('please_enter'),
-            clearable: true,
-            style: { width: '90%' }
-          }
-        ],
-        [
-          {
-            type: 'input',
-            prop: 'note',
-            label: this.key('remark'),
-            placeholder: this.key('please_enter'),
-            clearable: true,
-            style: { width: '90%' }
-          }
+          { type: 'input', prop: 'note', label: this.key('remark'), placeholder: this.key('please_enter'), clearable: true, style: { width: '90%' } }
         ]
       ]
     }
   },
   created () {
     this.columns = useTableColumns([
-      { prop: 'code', label: this.key('code'), minWidth: 130 },
-      { prop: 'name', label: this.key('name'), minWidth: 130 },
-      { prop: 'category_name', label: this.key('category_name'), minWidth: 170 },
-      { prop: 'note', label: this.key('remark'), minWidth: 130 },
-      { prop: 'create_date', label: this.key('create_date'), minWidth: 130 },
-      { prop: '_actions', label: this.key('operation'), width: 160, fixed: 'right' }
+      { prop: 'workingsubclass_name', label: this.key('process_unit'), minWidth: 150, sortable: 'custom', showOverflowTooltip: true },
+      { prop: 'quality_category_name', label: this.key('inspection_type'), minWidth: 150, sortable: 'custom', showOverflowTooltip: true },
+      { prop: 'nickname', label: this.key('creator'), minWidth: 130, sortable: 'custom', showOverflowTooltip: true },
+      { prop: 'create_date', label: this.key('create_time'), minWidth: 160, sortable: 'custom', showOverflowTooltip: true },
+      { prop: 'note', label: this.key('remark'), minWidth: 150, sortable: 'custom', showOverflowTooltip: true },
+      { prop: '_actions', label: this.key('operation'), width: 220, fixed: 'right' }
     ])
     const btns = useTableButtons({
       toolbar: [
-        {
-          key: 'add',
-          label: this.key('add'),
-          icon: 'el-icon-plus',
-          type: 'primary',
-          auth: '/quality_control/first_inspection/setting/create',
-          onClick: this.openAdd
-        }
+        { key: 'add', label: this.key('add'), icon: 'el-icon-plus', type: 'primary', auth: '/quality_control/first_inspection/setting/add', onClick: this.openAdd },
+        { key: 'batch_delete', label: this.key('delete'), icon: 'el-icon-delete', type: 'danger', auth: '/quality_control/first_inspection/setting/delete', onClick: this.handleBatchDelete }
       ],
       row: [
-        {
-          key: 'edit',
-          label: this.key('edit'),
-          icon: 'el-icon-edit',
-          auth: '/quality_control/first_inspection/setting/edit',
-          onClick: this.openEdit
-        },
-        {
-          key: 'delete',
-          label: this.key('delete'),
-          icon: 'el-icon-delete',
-          color: 'danger',
-          auth: '/quality_control/first_inspection/setting/delete',
-          onClick: this.handleDelete
-        }
+        { key: 'edit', label: this.key('edit'), icon: 'el-icon-edit', auth: '/quality_control/first_inspection/setting/update', onClick: this.openEdit },
+        { key: 'configure_item', label: this.key('configure_item'), icon: 'el-icon-setting', auth: '/quality_control/first_inspection/setting/update', onClick: this.openItemsDialog },
+        { key: 'delete', label: this.key('delete'), icon: 'el-icon-delete', color: 'danger', auth: '/quality_control/first_inspection/setting/delete', onClick: this.handleDelete }
       ]
     }, this.$permission)
     this.toolbarButtons = btns.toolbarButtons
     this.rowButtons = btns.rowButtons
+    this.fetchOptions()
     this.fetchData()
   },
   methods: {
+    async fetchOptions () {
+      const [workingsubclassRes, categoryRes] = await Promise.all([getWorkingsubclassAll(), getQualityCategoryAll()])
+      this.workingsubclassOptions = this.normalizeList(workingsubclassRes)
+      this.categoryOptions = this.normalizeList(categoryRes)
+    },
+    normalizeList (res) {
+      if (Array.isArray(res)) return res
+      if (res && Array.isArray(res.data)) return res.data
+      if (res && res.data && Array.isArray(res.data.data)) return res.data.data
+      if (res && Array.isArray(res.list)) return res.list
+      return []
+    },
     async fetchData () {
       this.loading = true
       try {
-        const params = {
+        const res = await fetchFirstArticleInspectionConfigurationList({
           ...this.search,
+          ...this.order,
           page_no: this.pagination.current,
-          page_size: this.pagination.size,
-          page: this.pagination.current,
-          size: this.pagination.size
-        }
-        const res = await fetchFirstArticleInspectionConfigurationList(params)
+          page_size: this.pagination.size
+        })
         const { list, total } = readList(res)
         this.tableData = list
         this.pagination.total = total
@@ -227,7 +215,7 @@ export default {
       this.fetchData()
     },
     onReset () {
-      this.search = {"code":"","name":""}
+      this.search = { workingsubclass_id: undefined, type: undefined, create_time: undefined }
       this.pagination.current = 1
       this.fetchData()
     },
@@ -239,21 +227,36 @@ export default {
     onSelect (rows) {
       this.selectedRows = rows
     },
+    handleSort ({ column, prop, order }) {
+      this.order = {
+        order_type: column && order ? (order === 'ascending' ? 'asc' : 'desc') : undefined,
+        order_field: column && order ? prop : undefined
+      }
+      this.fetchData()
+    },
     resetForm () {
-      this.formData = {"code":"","name":"","category_id":"","note":""}
+      this.formData = { workingsubclass_id: undefined, quality_category_id: undefined, note: '', is_need: 0 }
       this.editId = ''
     },
     openAdd () {
       this.handleType = 'create'
       this.dialogTitle = this.key('add_title')
-      this.resetForm()
-      this.dialogVisible = true
+      this.$nextTick(() => {
+        this.$refs.dialogForm && this.$refs.dialogForm.reset()
+        this.resetForm()
+        this.dialogVisible = true
+      })
     },
     openEdit (row) {
       this.handleType = 'edit'
       this.dialogTitle = this.key('edit_title')
       this.editId = row.id
-      this.formData = { ...{"code":"","name":"","category_id":"","note":""}, ...row }
+      this.formData = {
+        workingsubclass_id: row.workingsubclass_id,
+        quality_category_id: row.quality_category_id,
+        note: row.note || '',
+        is_need: Number(row.is_need || 0)
+      }
       this.dialogVisible = true
     },
     async onDialogSubmit () {
@@ -274,11 +277,34 @@ export default {
     onDialogClose () {
       this.resetForm()
     },
+    openItemsDialog (row) {
+      this.currentSetting = row
+      this.itemsDialogVisible = true
+    },
     async handleDelete (row) {
       const cancelled = await this.$confirmAction({
         message: this.key('confirm_delete'),
-        title: this.key('tip')
-      }, () => deleteFirstArticleInspectionConfiguration({ id: [row.id], ids: [row.id], inspection_order_no: row.inspection_order_no }))
+        title: this.key('tip'),
+        confirmButtonText: this.key('confirm'),
+        cancelButtonText: this.key('cancel'),
+        closeOnClickModal: false
+      }, () => deleteFirstArticleInspectionConfiguration({ id: [row.id] }))
+      if (cancelled) return
+      this.$message.success(this.$t(this.key('operation_success')))
+      this.fetchData()
+    },
+    async handleBatchDelete () {
+      if (!this.selectedRows.length) {
+        this.$message.error(this.$t(this.key('select_operate_data')))
+        return
+      }
+      const cancelled = await this.$confirmAction({
+        message: this.key('confirm_delete'),
+        title: this.key('tip'),
+        confirmButtonText: this.key('confirm'),
+        cancelButtonText: this.key('cancel'),
+        closeOnClickModal: false
+      }, () => deleteFirstArticleInspectionConfiguration({ id: this.selectedRows.map(item => item.id) }))
       if (cancelled) return
       this.$message.success(this.$t(this.key('operation_success')))
       this.fetchData()
@@ -291,11 +317,6 @@ export default {
 .search-bar {
   padding: 10px 0;
 }
-.spc-chart-panel {
-  height: 320px;
-  margin-bottom: 12px;
-  border: 1px solid #ebeef5;
-}
 /deep/ .el-form-item--mini.el-form-item {
   margin-bottom: 4px;
 }