(xfeatumu): 优化耳标登记功能

- 修改 etAdd组件，增加耳标录入的增删功能
- 更新 etList
- 重构 AiTable 组件组件，使机构选择框只读，优化表格列的渲染逻辑

project/xumu/AppEarTag/etAdd.vue

@@ -4,14 +4,14 @@ import AiSelect from "dui/packages/basic/AiSelect.vue";
 
 const columns = [
   {label: "序号", type: "index"},
-  {label: "生物芯片耳标号", prop: "biochipEarNumber"},
-  {label: "电子耳标号", prop: "electronicEarNumber"},
-  {label: "原厂耳标号", prop: "originalEarNumber"},
-  {label: "戴耳标照片", prop: "picture", upload: 1},
-  {label: "品种", prop: "variety", select: 1, dict: "variety"},
-  {label: "类别", prop: "category", select: 1, dict: "category"},
-  {label: "日龄/天", prop: "age", edit: 1},
-  {label: "体重/公斤", prop: "weight", edit: 1},
+  {label: "生物芯片耳标号", prop: "biochipEarNumber", edit: 1},
+  {label: "电子耳标号", prop: "electronicEarNumber", edit: 1},
+  {label: "原厂耳标号", prop: "originalEarNumber", edit: 1},
+  {label: "戴耳标照片", prop: "picture", upload: {valueIsUrl: !0}},
+  {label: "品种", prop: "variety", select: {dict: "variety"}},
+  {label: "类别", prop: "category", select: {dict: "category"}},
+  {label: "日龄/天", prop: "age", num: 1},
+  {label: "体重/公斤", prop: "weight", num: 1},
 ]
 export default {
   name: "etAdd",
@@ -23,7 +23,7 @@ export default {
   },
   data() {
     return {
-      detail: {},
+      detail: {detailList: []},
       columns,
     }
   },
@@ -43,24 +43,16 @@ export default {
     },
     getDetail() {
       const {id} = this.$route.query
-      return this.instance.post("/api/breed/earTag/page", {id}).then(res => {
+      return id && this.instance.post("/api/breed/earTag/page", {id}).then(res => {
         if (res?.data?.records) {
           const detail = res.data.records[0] || {}
-          return this.detail = {...detail}
-        }
-      })
-    },
-    getList() {
-      const {penId} = this.detail
-      this.instance.post("/api/breed/earTag/getEarTagByPenId", null, {params: {penId}}).then(res => {
-        if (res?.data) {
-          this.$set(this.detail, 'detailList', res.data)
+          return this.detail = {detailList: [], ...detail}
         }
       })
     },
     handleDelete(index) {
       this.$confirm("确定删除该条数据？").then(() => {
-        this.detail.splice(index, 1)
+        this.detail.detailList.splice(index, 1)
       })
     },
     submit() {
@@ -93,7 +85,7 @@ export default {
               <ai-select v-model="detail.houseId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${detail.farmId||-1}`" :prop="{label:'name'}"/>
             </el-form-item>
             <el-form-item label="养殖栏" prop="penId">
-              <ai-select v-model="detail.penId" @change="getList" :instance="instance" :action="`/api/siteUser/querySiteById?id=${detail.houseId||-1}`" :prop="{label:'name'}"/>
+              <ai-select v-model="detail.penId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${detail.houseId||-1}`" :prop="{label:'name'}"/>
             </el-form-item>
           </template>
           <template v-else>
@@ -110,18 +102,22 @@ export default {
         </div>
       </ai-card>
       <ai-card title="耳标录入">
-        <ai-table v-if="isAdd" :tableData="detail.detailList" :colConfigs="columns" :isShowPagination="!1">
-          <el-table-column slot="options" label="操作" fixed="right" align="center">
-            <template slot-scope="{row,$index}">
-              <div class="table-options">
-                <el-button type="text" class="deleteBtn" @click="handleDelete($index)">删除</el-button>
-              </div>
-            </template>
-          </el-table-column>
-        </ai-table>
+        <template v-if="isAdd">
+          <el-button type="text" slot="right" @click="detail.detailList.push({})">新增</el-button>
+          <ai-table :tableData="detail.detailList" :colConfigs="columns" :isShowPagination="!1">
+            <el-table-column slot="options" label="操作" fixed="right" align="center">
+              <template slot-scope="{row,$index}">
+                <div class="table-options">
+                  <el-button type="text" class="deleteBtn" @click="handleDelete($index)">删除</el-button>
+                </div>
+              </template>
+            </el-table-column>
+          </ai-table>
+        </template>
         <div class="grid" v-else>
           <el-form-item label="生物芯片耳标号">
-            <b v-text="detail.biochipEarNumber"/>
+            <el-input v-if="isEdit" v-model="detail.biochipEarNumber" placeholder="请输入" clearable/>
+            <b v-else v-text="detail.biochipEarNumber"/>
           </el-form-item>
           <el-form-item label="电子耳标号" prop="electronicEarNumber">
             <el-input v-if="isEdit" v-model="detail.electronicEarNumber" placeholder="请输入" clearable/>

project/xumu/AppEarTag/etList.vue

@@ -71,7 +71,7 @@ export default {
   <ai-page class="etList" title="耳标登记">
     <ai-search-bar>
       <template #left>
-        <ai-select placeholder="全部机构" v-model="search.userId" :instance="instance" :action="`/api/breed/earTag/getOrgList`" :prop="{label:'name'}"/>
+        <ai-select placeholder="全部机构" v-model="search.userId" :instance="instance" :action="`/api/breed/earTag/getOrgList`" :prop="{label:'name'}" readonly/>
         <ai-select placeholder="全部养殖场" v-model="search.farmId" :instance="instance" :action="`/api/siteUser/querySiteByUserId?userId=${search.userId||''}`" :prop="{label:'name'}"/>
         <ai-select placeholder="全部养殖舍" v-model="search.houseId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${search.farmId||-1}`" :prop="{label:'name'}"/>
         <ai-select placeholder="全部养殖栏" v-model="search.penId" :instance="instance" :action="`/api/siteUser/querySiteById?id=${search.houseId||-1}`" :prop="{label:'name'}"/>

ui/packages/basic/AiTable.vue

@@ -26,10 +26,10 @@
           <template slot-scope="{row,$index}">
             <span v-if="colConfig.dict" :style="{color:colConfig.color||dict.getColor(colConfig.dict, row[colConfig.prop])}" v-text="dict.getLabel(colConfig.dict, row[colConfig.prop])"/>
             <render-slot v-else-if="colConfig.render" :render="colConfig.render" :row="row" :index="$index" :column="colConfig"/>
-            <el-input v-else-if="colConfig.edit==1" v-model="row[colConfig.prop]" :index="$index"/>
-            <el-input v-else-if="colConfig.num==1" v-model.number="row[colConfig.prop]" :index="$index"/>
-            <ai-select v-else-if="colConfig.select==1" v-model="row[colConfig.prop]" v-bind="colConfig"/>
-            <ai-uploader v-else-if="colConfig.upload==1" v-model="row[colConfig.prop]" v-bind="colConfig"/>
+            <el-input v-else-if="colConfig.edit" v-model="row[colConfig.prop]" size="small" placeholder="请输入" clearable/>
+            <el-input v-else-if="colConfig.num" v-model.number="row[colConfig.prop]" size="small" placeholder="请输入" clearable/>
+            <ai-select v-else-if="colConfig.select" v-model="row[colConfig.prop]" v-bind="colConfig.select"/>
+            <ai-uploader v-else-if="colConfig.upload" v-model="row[colConfig.prop]" :limit="1" v-bind="colConfig.upload"/>
             <ai-open-data v-else-if="colConfig.openType" :type="colConfig.openType" :openid="row[colConfig.prop]"/>
             <span v-else>{{ getValue(colConfig, row) }}</span>
           </template>
@@ -269,6 +269,31 @@ export default {
     tr td:first-child .cell {
       padding-left: 40px !important;
     }
+
+    .uploader {
+      .el-upload-list__item {
+        width: 100px;
+        height: 32px;
+        margin: unset;
+
+        & > img {
+          width: unset;
+          margin-left: 50%;
+          transform: translateX(-50%);
+        }
+      }
+
+      .uploaderBox {
+        width: 100px !important;
+        height: 32px !important;
+        flex-direction: row !important;
+        gap: 4px;
+
+        .iconfont {
+          font-size: 24px !important;
+        }
+      }
+    }
   }
 
   :deep( .el-table__fixed-right ) {