修复工厂模型产线和区域功能问题

src/views/production-master-data/factory-model/production-line/index.vue

@@ -28,6 +28,7 @@
               clearable
               filterable
               style="width:200px"
+              @change="onSearch"
             >
               <el-option
                 v-for="item in areaOptions"
@@ -37,6 +38,18 @@
               />
             </el-select>
           </el-form-item>
+          <el-form-item :label="$t(key('status'))">
+            <el-select
+              v-model="search.status"
+              :placeholder="$t(key('select_status'))"
+              clearable
+              style="width:140px"
+              @change="onSearch"
+            >
+              <el-option value="1" :label="$t(key('enabled'))" />
+              <el-option value="0" :label="$t(key('disabled'))" />
+            </el-select>
+          </el-form-item>
           <el-form-item>
             <el-button type="primary" icon="el-icon-search" @click="onSearch">
               {{ $t(key('search')) }}
@@ -62,7 +75,12 @@
       auto-height
       @page-change="onPageChange"
       @selection-change="onSelect"
-    />
+    >
+      <template #col-status="{ row }">
+        <span v-if="String(row.status) === '1'" class="status-on"><i class="el-icon-circle-check" /> {{ $t(key('enabled')) }}</span>
+        <span v-else class="status-off"><i class="el-icon-circle-close" /> {{ $t(key('disabled')) }}</span>
+      </template>
+    </page-table>
 
     <page-dialog-form
       ref="dialogForm"
@@ -86,12 +104,12 @@
 import { useTableColumns } from '@/composables/useTableColumns'
 import { useTableButtons } from '@/composables/useTableButtons'
 import { i18nMixin } from '@/composables/useI18n'
-import { confirmMixin } from '@/composables/useConfirmHandle'
 import {
   getProductionLineList,
   createProductionLine,
   editProductionLine,
-  deleteProductionLine
+  deleteProductionLine,
+  exportProductionLineTask
 } from '@/api/production-master-data/production-line'
 import { getFactoryAreaALL } from '@/api/production-master-data/factory-area'
 import PageTable from '@/components/page-table'
@@ -100,7 +118,7 @@ import PageDialogForm from '@/components/page-dialog-form'
 export default {
   name: 'production-master-data-production-line',
   components: { PageTable, PageDialogForm },
-  mixins: [i18nMixin('page.production_master_data.factory_model.production_line'), confirmMixin],
+  mixins: [i18nMixin('page.production_master_data.factory_model.production_line')],
   data () {
     return {
       loading: false,
@@ -111,81 +129,50 @@ export default {
       dialogTitle: '',
       editId: '',
       handleType: 'create',
-      search: { code: '', name: '', area_id: '' },
+      search: { code: '', name: '', area_id: '', status: '' },
       pagination: { current: 1, size: 10, total: 0 },
       areaOptions: [],
-      formData: { code: '', name: '', area_id: '', remark: '' },
+      statusOptions: [
+        { value: '1', label: this.$t(this.key('enabled')) },
+        { value: '0', label: this.$t(this.key('disabled')) }
+      ],
+      formData: { code: '', name: '', area_id: '', status: '1', remark: '' },
       rules: {
         code: [
           { required: true, message: this.key('enter_code'), trigger: 'blur' },
-          { min: 1, max: 100, message: this.key('remark_length'), trigger: 'blur' }
+          { min: 1, max: 100, message: this.key('length_1_100'), trigger: 'blur' }
         ],
         name: [
           { required: true, message: this.key('enter_name'), trigger: 'blur' },
-          { min: 1, max: 100, message: this.key('remark_length'), trigger: 'blur' }
+          { min: 1, max: 100, message: this.key('length_1_100'), trigger: 'blur' }
         ],
         area_id: [
           { required: true, message: this.key('select_area'), trigger: 'change' }
+        ],
+        status: [
+          { required: true, message: this.key('select_status'), trigger: 'change' }
+        ],
+        remark: [
+          { max: 500, message: this.key('remark_max_500'), trigger: 'blur' }
         ]
       },
       columns: [],
       toolbarButtons: [],
       rowButtons: [],
       baseFormCols: [
-        [
-          {
-            type: 'input',
-            prop: 'code',
-            label: this.key('code'),
-            placeholder: this.key('enter_code'),
-            clearable: true,
-            style: { width: '90%' }
-          }
-        ],
-        [
-          {
-            type: 'input',
-            prop: 'name',
-            label: this.key('name'),
-            placeholder: this.key('enter_name'),
-            clearable: true,
-            style: { width: '90%' }
-          }
-        ],
-        [
-          {
-            type: 'select',
-            prop: 'area_id',
-            label: this.key('area'),
-            placeholder: this.key('select_area'),
-            clearable: true,
-            filterable: true,
-            style: { width: '90%' },
-            options: []
-          }
-        ],
-        [
-          {
-            type: 'input',
-            prop: 'remark',
-            inputType: 'textarea',
-            autosize: { minRows: 2, maxRows: 6 },
-            label: this.key('remark'),
-            placeholder: this.key('enter_remark'),
-            clearable: true,
-            style: { width: '90%' }
-          }
-        ]
+        [{ type: 'input', prop: 'code', label: this.key('code'), placeholder: this.key('enter_code'), clearable: true, style: { width: '90%' } }],
+        [{ type: 'input', prop: 'name', label: this.key('name'), placeholder: this.key('enter_name'), clearable: true, style: { width: '90%' } }],
+        [{ type: 'select', prop: 'area_id', label: this.key('area'), placeholder: this.key('select_area'), clearable: true, filterable: true, style: { width: '90%' }, options: [] }],
+        [{ type: 'select', prop: 'status', label: this.key('status'), placeholder: this.key('select_status'), clearable: false, style: { width: '90%' }, options: [] }],
+        [{ type: 'input', prop: 'remark', inputType: 'textarea', autosize: { minRows: 2, maxRows: 6 }, label: this.key('remark'), placeholder: this.key('enter_remark'), clearable: true, style: { width: '90%' } }]
       ]
     }
   },
   computed: {
     dialogFormCols () {
-      const idx = 2
       const cols = JSON.parse(JSON.stringify(this.baseFormCols))
-      if (cols[idx] && cols[idx][0]) {
-        cols[idx][0].options = this.areaOptions
-      }
+      cols[2][0].options = this.areaOptions
+      cols[3][0].options = this.statusOptions
       return cols
     }
   },
@@ -196,36 +183,18 @@ export default {
       { prop: 'code', label: this.key('code'), minWidth: 120 },
       { prop: 'name', label: this.key('name'), minWidth: 120 },
       { prop: 'area_name', label: this.key('area_name'), minWidth: 120 },
+      { prop: 'status', label: this.key('status'), slot: 'status', width: 110 },
       { prop: 'remark', label: this.key('remark') },
       { prop: '_actions', label: this.key('operation'), width: 160, fixed: 'right' }
     ])
     const btns = useTableButtons({
       toolbar: [
-        {
-          key: 'add',
-          label: this.key('add'),
-          icon: 'el-icon-plus',
-          type: 'primary',
-          auth: '/production_configuration/factory_model/factory_line/create',
-          onClick: this.openAdd
-        }
+        { key: 'add', label: this.key('add'), icon: 'el-icon-plus', type: 'primary', auth: '/production_configuration/factory_model/factory_line/create', onClick: this.openAdd },
+        { key: 'export', label: this.key('export'), icon: 'el-icon-download', auth: '/production_configuration/factory_model/factory_line/export', onClick: this.handleExport }
       ],
       row: [
-        {
-          key: 'edit',
-          label: this.key('edit'),
-          icon: 'el-icon-edit',
-          auth: '/production_configuration/factory_model/factory_line/edit',
-          onClick: this.openEdit
-        },
-        {
-          key: 'delete',
-          label: this.key('delete'),
-          icon: 'el-icon-delete',
-          color: 'danger',
-          auth: '/production_configuration/factory_model/factory_line/delete',
-          onClick: this.handleDelete
-        }
+        { key: 'edit', label: this.key('edit'), icon: 'el-icon-edit', auth: '/production_configuration/factory_model/factory_line/edit', onClick: this.openEdit },
+        { key: 'delete', label: this.key('delete'), icon: 'el-icon-delete', color: 'danger', auth: '/production_configuration/factory_model/factory_line/delete', onClick: this.handleDelete }
       ]
     }, this.$permission)
     this.toolbarButtons = btns.toolbarButtons
@@ -233,25 +202,28 @@ export default {
     this.fetchData()
   },
   methods: {
+    normalizeResponse (res) {
+      const data = res && res.data !== undefined ? res.data : res
+      if (Array.isArray(data)) return { list: data, total: data.length }
+      if (data && Array.isArray(data.list)) return { list: data.list, total: Number(data.count || data.total || data.list.length) }
+      if (data && Array.isArray(data.data)) return { list: data.data, total: Number(data.count || data.total || data.data.length) }
+      if (data && data.data && Array.isArray(data.data.data)) return { list: data.data.data, total: Number(data.data.count || data.data.total || data.data.data.length) }
+      return { list: [], total: 0 }
+    },
     async initAreaOptions () {
       try {
         const res = await getFactoryAreaALL()
-        const data = Array.isArray(res) ? res : (res.data || [])
+        const data = this.normalizeResponse(res).list
         this.areaOptions = data.map(item => ({ value: item.area_id || item.id, label: item.name }))
       } catch { /* 忽略加载失败 */ }
     },
     async fetchData () {
       this.loading = true
       try {
-        const res = await getProductionLineList({
-          ...this.search,
-          page_no: this.pagination.current,
-          page_size: this.pagination.size
-        })
-        const list = Array.isArray(res) ? res : (res.data || [])
-        const total = Array.isArray(res) ? res.length : (res.count || 0)
-        this.tableData = list
-        this.pagination.total = total
+        const res = await getProductionLineList({ ...this.search, page_no: this.pagination.current, page_size: this.pagination.size })
+        const data = this.normalizeResponse(res)
+        this.tableData = data.list
+        this.pagination.total = data.total
       } finally {
         this.loading = false
       }
@@ -261,7 +233,7 @@ export default {
       this.fetchData()
     },
     onReset () {
-      this.search = { code: '', name: '', area_id: '' }
+      this.search = { code: '', name: '', area_id: '', status: '' }
       this.pagination.current = 1
       this.fetchData()
     },
@@ -274,7 +246,7 @@ export default {
       this.selectedRows = rows
     },
     resetForm () {
-      this.formData = { code: '', name: '', area_id: '', remark: '' }
+      this.formData = { code: '', name: '', area_id: '', status: '1', remark: '' }
       this.editId = ''
     },
     openAdd () {
@@ -290,22 +262,14 @@ export default {
       this.handleType = 'edit'
       this.dialogTitle = this.key('edit_title')
       this.editId = row.id
-      this.formData = {
-        code: row.code,
-        name: row.name,
-        area_id: row.area_id,
-        remark: row.remark || ''
-      }
+      this.formData = { code: row.code, name: row.name, area_id: row.area_id, status: row.status !== undefined ? String(row.status) : '1', remark: row.remark || '' }
       this.dialogVisible = true
     },
     async onDialogSubmit () {
       this.submitting = true
       try {
-        if (this.handleType === 'create') {
-          await createProductionLine(this.formData)
-        } else {
-          await editProductionLine({ ...this.formData, id: this.editId })
-        }
+        if (this.handleType === 'create') await createProductionLine(this.formData)
+        else await editProductionLine({ ...this.formData, id: this.editId })
         this.$message.success(this.$t(this.key('operation_success')))
         this.dialogVisible = false
         this.fetchData()
@@ -316,31 +280,33 @@ export default {
     onDialogClose () {
       this.resetForm()
     },
+    async confirmAction (message, action) {
+      try {
+        await this.$confirm(this.$t(message), this.$t(this.key('tip')), { type: 'warning' })
+      } catch {
+        return false
+      }
+      await action()
+      return true
+    },
     async handleDelete (row) {
-      const cancelled = await this.$confirmAction(
-        {
-          message: this.key('confirm_delete'),
-          title: this.key('tip')
-        },
-        () => deleteProductionLine({ id: [row.id] })
-      )
-      if (cancelled) return
+      const ok = await this.confirmAction(this.key('confirm_delete'), () => deleteProductionLine({ id: [row.id] }))
+      if (!ok) return
       this.$message.success(this.$t(this.key('operation_success')))
-      this.pagination.current = Math.min(
-        this.pagination.current,
-        Math.ceil((this.pagination.total - 1) / this.pagination.size) || 1
-      )
+      this.pagination.current = Math.min(this.pagination.current, Math.ceil((this.pagination.total - 1) / this.pagination.size) || 1)
       this.fetchData()
+    },
+    async handleExport () {
+      const ok = await this.confirmAction(this.key('confirm_export'), () => exportProductionLineTask({ ...this.search }))
+      if (ok) this.$message.success(this.$t(this.key('operation_success')))
     }
   }
 }
 </script>
 
 <style scoped>
-.search-bar {
-  padding: 10px 0;
-}
-/deep/ .el-form-item--mini.el-form-item {
-  margin-bottom: 4px;
-}
+.search-bar { padding: 10px 0; }
+.status-on { color: #67C23A; }
+.status-off { color: #909399; }
+/deep/ .el-form-item--mini.el-form-item { margin-bottom: 4px; }
 </style>