2022-01-12

src/components/HeaderElement.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="headers" :style="{backgroundColor: color}">
+  <div class="headers" :style="{ backgroundColor: color }">
     <el-row :gutter="20" style="height: 100%">
       <el-col :span="1" style="height: 100%">
         <div class="logo"></div>
@@ -12,7 +12,12 @@
           <div class="user" style="width: 180px;">
             <div>
               <el-select @change="onChange" size="mini" v-model="farmId">
-                <el-option v-for="item in getFarmList" :key="item.id" :label="item.farmName" :value="item.id"></el-option>
+                <el-option
+                  v-for="item in getFarmList"
+                  :key="item.id"
+                  :label="item.farmName"
+                  :value="item.id"
+                ></el-option>
               </el-select>
             </div>
           </div>
@@ -20,13 +25,14 @@
           <div class="user" style="width: 250px;">
             <div>
               <el-switch
-                  style="display: block"
-                  v-model="$store.state.mode"
-                  active-color="#13ce66"
-                  inactive-color="#ff4949"
-                  active-text="多级导航"
-                  inactive-text="折叠导航"
-                  @change="changeMode">
+                style="display: block"
+                v-model="$store.state.mode"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="多级导航"
+                inactive-text="折叠导航"
+                @change="changeMode"
+              >
               </el-switch>
             </div>
           </div>
@@ -36,24 +42,21 @@
               <i class="el-icon-user-solid" style="font-size: 28px"></i>
             </div>
             <div>
-              <el-popover
-                  placement="bottom"
-                  width="400"
-                  trigger="hover">
-                  <div style="padding: 10px">
-                    <div style="width: 100%;">
-                      <span style="color: #BBBBBB;">账户信息</span>
-                      <span class="user-right">账户设置</span>
-                    </div>
-                    <el-divider></el-divider>
-<!--                    <ul>-->
-<!--                      <li>职位： <span class="user-color">厂长</span></li>-->
-<!--                      <li>本次登录： <span class="user-color">厂长</span></li>-->
-<!--                      <li>本次登录： <span class="user-color">厂长</span></li>-->
-<!--                      <li>上次登录： <span class="user-color">厂长</span></li>-->
-<!--                    </ul>-->
+              <el-popover placement="bottom" width="400" trigger="hover">
+                <div style="padding: 10px">
+                  <div style="width: 100%;">
+                    <span style="color: #BBBBBB;">账户信息</span>
+                    <span class="user-right">账户设置</span>
                   </div>
-                <span slot="reference">{{userName}}</span>
+                  <el-divider></el-divider>
+                  <!--                    <ul>-->
+                  <!--                      <li>职位： <span class="user-color">厂长</span></li>-->
+                  <!--                      <li>本次登录： <span class="user-color">厂长</span></li>-->
+                  <!--                      <li>本次登录： <span class="user-color">厂长</span></li>-->
+                  <!--                      <li>上次登录： <span class="user-color">厂长</span></li>-->
+                  <!--                    </ul>-->
+                </div>
+                <span slot="reference">{{ userName }}</span>
               </el-popover>
             </div>
           </div>
@@ -68,15 +71,12 @@
           <el-divider direction="vertical"></el-divider>
           <div class="user">
             <div style="width: 100%; text-align: center">
-              <el-popover
-                  placement="bottom"
-                  width="270"
-                  trigger="hover">
+              <el-popover placement="bottom" width="270" trigger="hover">
                 <div class="color_flex">
                   <chrome-picker :value="color" @input="cut"></chrome-picker>
-<!--                  <div v-for="item in colorList" :style="{backgroundColor: item.color}" :key="item.id" class="box" @click="cut(item.color)">-->
-<!--                    <span>点击换肤</span>-->
-<!--                  </div>-->
+                  <!--                  <div v-for="item in colorList" :style="{backgroundColor: item.color}" :key="item.id" class="box" @click="cut(item.color)">-->
+                  <!--                    <span>点击换肤</span>-->
+                  <!--                  </div>-->
                 </div>
                 <i slot="reference" class="colour"></i>
               </el-popover>
@@ -95,100 +95,105 @@
 </template>
 
 <script>
-import { mapState, mapActions } from 'vuex'
-import { findUpdate, getFarmId } from '../utils/api';
-import { Chrome } from 'vue-color';
+import { mapState, mapActions } from "vuex";
+import { findUpdate, getFarmId } from "../utils/api";
+import { Chrome } from "vue-color";
 import { Debounce } from "../utils";
 
 export default {
   name: "HeaderElement",
   computed: {
-    ...mapState(['color', 'farmList', 'farmId', 'userName'])
+    ...mapState(["color", "farmList", "farmId", "userName"]),
   },
   components: {
     // 'slider-picker': Slider,
-    'chrome-picker': Chrome
+    "chrome-picker": Chrome,
   },
   watch: {
     farmList: {
       handler(newVal) {
-        if(newVal.length > 0) {
-          this.getFarmList = []
-          newVal.forEach(item => {
-            if(item.rowStatus) {
-              this.getFarmList.push(item)
-            }
-          })
+        if (newVal.length > 0) {
+          this.getFarmList = [];
+          newVal.forEach((item) => {
+            // if (item.rowStatus) {
+            this.getFarmList.push(item);
+            // }
+          });
         }
       },
-      deep: true
-    }
+      deep: true,
+    },
   },
   data() {
     return {
       getFarmList: [],
-    }
+    };
   },
   methods: {
-    ...mapActions(['setModeAsync', 'setColorAsync', 'GetFarm', 'setFarmIdAsync']),
+    ...mapActions([
+      "setModeAsync",
+      "setColorAsync",
+      "GetFarm",
+      "setFarmIdAsync",
+    ]),
     cut: Debounce(function(data) {
-      this.setColorAsync(data.hex)
+      this.setColorAsync(data.hex);
       let params = {
-        id: localStorage.getItem('UserId'),
-        color: data.hex
-      }
-      findUpdate(params).then(res => {
-        console.log(res)
-      })
+        id: localStorage.getItem("UserId"),
+        color: data.hex,
+      };
+      findUpdate(params).then((res) => {
+        console.log(res);
+      });
     }),
     changeMode(val) {
       let params = {
-        id: localStorage.getItem('UserId'),
-        mode: val
-      }
-      findUpdate(params).then(res => {
-        console.log(res)
-      })
-      this.setModeAsync(val)
+        id: localStorage.getItem("UserId"),
+        mode: val,
+      };
+      findUpdate(params).then((res) => {
+        console.log(res);
+      });
+      this.setModeAsync(val);
     },
     logout() {
-      localStorage.removeItem('UserName');
-      localStorage.removeItem('accessToken');
-      localStorage.removeItem('UserId');
-      localStorage.removeItem('lastFarmId')
-      this.$router.replace('/login');
+      localStorage.removeItem("UserName");
+      localStorage.removeItem("accessToken");
+      localStorage.removeItem("UserId");
+      localStorage.removeItem("lastFarmId");
+      this.$router.replace("/login");
     },
     // 拿到farmid
     init() {
-      getFarmId().then(res => {
-        if(res.code === 10000) {
+      getFarmId().then((res) => {
+        if (res.code === 10000) {
           this.setFarmIdAsync(res.data);
-          localStorage.setItem('lastFarmId', res.data);
+          localStorage.setItem("lastFarmId", res.data);
         }
-      })
+      });
     },
     // 选择牧场
     onChange(val) {
       let params = {
-        id: localStorage.getItem('UserId'),
-        lastFarmId: val
-      }
-      localStorage.setItem('lastFarmId', val)
-      findUpdate(params).then(res => {
-        console.log(res)
-      })
+        id: localStorage.getItem("UserId"),
+        lastFarmId: val,
+      };
+      localStorage.setItem("lastFarmId", val);
+      findUpdate(params).then((res) => {
+        console.log(res);
+      });
       this.setFarmIdAsync(val);
       setTimeout(() => {
         location.reload();
-      }, 100)
+      }, 100);
     },
   },
   mounted() {
     this.init();
-    this.GetFarm()
-    console.log(this.farmId)
-  }
-}
+    this.GetFarm();
+    console.log(this.farmId);
+  },
+};
 </script>
 
 <style scoped>
@@ -241,14 +246,14 @@ p {
   float: right;
   margin-right: 10px;
   cursor: pointer;
-  color: #31C3A6;
+  color: #31c3a6;
 }
 li {
   margin-bottom: 10px;
-  color: #BBBBBB;
+  color: #bbbbbb;
 }
 .user-color {
-  color: #000
+  color: #000;
 }
 .colour {
   display: inline-block;
@@ -269,7 +274,7 @@ li {
   line-height: 80px;
 }
 .box:hover {
-  content: '点击换肤';
+  content: "点击换肤";
 }
 .guanbi {
   display: inline-block;

src/components/modal-cpn/ModalCpn.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-08 16:02:11
- * @LastEditTime: 2022-01-11 09:05:36
+ * @LastEditTime: 2022-01-12 15:51:42
  * @LastEditors: Please set LastEditors
  * @Description: 新增 or 编辑表单
  * @FilePath: \goldenPig\src\components\form-cpn\FormCpn.vue
@@ -15,9 +15,19 @@
       center
       destroy-on-close
     >
-      <el-form :label-width="formStyle.labelWidth" :size="formStyle.size">
+      <el-form
+        :label-width="formStyle.labelWidth"
+        :size="formStyle.size"
+        ref="form"
+        :model="form"
+      >
         <template v-for="item in modalItemProp">
-          <el-form-item :label="item.label" :key="item.label">
+          <el-form-item
+            :label="item.label"
+            :key="item.label"
+            :rules="item.rules"
+            :prop="item.field"
+          >
             <el-input
               v-if="item.type === 'input'"
               v-model="form[item.field]"
@@ -132,38 +142,57 @@ export default {
       this.dialogVisible = true;
       if (row.id) {
         this.dialogVisible = true;
-        this.$nextTick(() => {
-          this.form = { ...row };
-        });
+        // this.$nextTick(() => {
+        for (const key in this.modalForm) {
+          this.form[key] = row[key] ?? this.modalForm[key];
+        }
+        this.form.id = row.id;
+        // });
+      } else {
+        this.form = { ...this.modalForm };
       }
-      this.form = { ...this.modalForm };
     },
     // 点击确定按钮
     handleComfirmClick() {
-      // this.dialogVisible = false;
-      if (this.form.id) {
-        this.requests
-          .edit({ ...this.form, ...this.otherParams })
-          .then((res) => {
-            if (res.code === 10000) {
-              this.$message.success(res.message);
-              EventBus.$emit("refresh");
-              this.dialogVisible = false;
-            } else {
-              this.$message.error(res.message);
-            }
-          });
-      } else {
-        this.requests.add({ ...this.form, ...this.otherParams }).then((res) => {
-          if (res.code === 10000) {
-            this.$message.success(res.message);
-            EventBus.$emit("refresh");
-            this.dialogVisible = false;
-          } else {
-            this.$message.error(res.message);
-          }
-        });
-      }
+      this.$refs["form"].validate((valid) => {
+        if (!valid) {
+          this.$message.error("请填写必填项");
+          return;
+        }
+        if (this.form.id) {
+          this.requests
+            .edit({ ...this.form, ...this.otherParams })
+            .then((res) => {
+              if (res && res.code === 10000) {
+                this.$message.success(res.message);
+                EventBus.$emit("refresh");
+                this.dialogVisible = false;
+              } else {
+                this.$message.error(res.message);
+              }
+            });
+        } else {
+          this.requests
+            .add({ ...this.form, ...this.otherParams })
+            .then((res) => {
+              if (res && res.code === 10000) {
+                this.$message.success(res.message);
+                EventBus.$emit("refresh");
+                this.dialogVisible = false;
+              } else {
+                this.$message.error(res.message);
+              }
+            });
+        }
+      });
+    },
+  },
+  watch: {
+    otherParams: {
+      handler(newVal) {
+        this.form = { ...this.form, ...newVal };
+      },
+      deep: true,
     },
   },
 };

src/components/table-cpn/TableContent.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-08 14:47:24
- * @LastEditTime: 2022-01-11 14:41:21
+ * @LastEditTime: 2022-01-12 14:09:09
  * @LastEditors: Please set LastEditors
  * @Description: 表格
  * @FilePath: \goldenPig\src\components\table-cpn\TableContent.vue
@@ -18,7 +18,14 @@
     </div>
 
     <div class="content">
-      <el-table :data="dataList" :size="tableSize" :height="height" border>
+      <el-table
+        :data="dataList"
+        :size="tableSize"
+        :height="height"
+        row-key="id"
+        default-expand-all
+        border
+      >
         <el-table-column
           v-if="shows.select"
           type="selection"
@@ -35,7 +42,11 @@
         >
         </el-table-column>
         <template v-for="item in propList">
-          <el-table-column :key="item.label" v-bind="item" align="center">
+          <el-table-column
+            :key="item.label"
+            :align="item.align || 'center'"
+            v-bind="item"
+          >
             <template #default="scope">
               <slot :name="item.slotName" :row="scope.row"> </slot>
             </template>
@@ -85,6 +96,10 @@ export default {
       type: String,
       default: "small",
     },
+    treeProps: {
+      type: Object,
+      default: () => ({}),
+    },
     /** 分页 */
     footer: {
       type: Boolean,

src/components/table-cpn/TableCpn.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-06 16:46:18
- * @LastEditTime: 2022-01-11 14:40:36
+ * @LastEditTime: 2022-01-12 15:59:48
  * @LastEditors: Please set LastEditors
  * @Description: 再封一次
  * @FilePath: \goldenPig\src\components\table-cpn\TableCpn.vue
@@ -31,10 +31,10 @@
       </template> -->
 
       <template v-for="item in propListFilter" #[item.slotName]="scope">
-        <div :key="item.label">
-          <slot :name="item.slotName" :row="scope.row">{{
-            scope.row[item.slotName]
-          }}</slot>
+        <div :key="item.label" style="display: inline-block">
+          <slot :name="item.slotName" :row="scope.row">
+            {{ scope.row[item.slotName] }}
+          </slot>
         </div>
       </template>
 
@@ -166,8 +166,8 @@ export default {
       this.$emit("handleAddOrEdit", row);
     },
     // 删除 点击事件
-    handleDelTitle(row) {
-      this.delTitle = `确定删除 ${row.farmName}`;
+    handleDelTitle() {
+      this.delTitle = `确定删除？`;
     },
     handleDel(row) {
       this.requests.del({ ids: row.id }).then((res) => {

src/store/index.js

@@ -1,14 +1,18 @@
 /*
  * @Author: your name
  * @Date: 2022-01-04 15:14:05
- * @LastEditTime: 2022-01-06 14:03:03
+ * @LastEditTime: 2022-01-12 09:34:10
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \goldenPig\src\store\index.js
  */
 import Vue from 'vue'
 import Vuex from 'vuex'
-import { getMyButton, getFarm } from '../utils/api'
+import { 
+  getMyButton, 
+  // getFarm 
+} from '../utils/api'
+import { baseFarmAll } from "@/utils/apis/basic-data/archivesAdmin.js";
 
 Vue.use(Vuex)
 
@@ -75,7 +79,7 @@ export default new Vuex.Store({
     // 获取牧场列表
     GetFarm({ commit }){
       return new Promise((resolve, reject) => {
-        getFarm().then(res => {
+        baseFarmAll().then(res => {
           if (res && res.code === 10000) {
             commit('SET_FARMLIST', res.data);
             resolve(res.data);

src/utils/apis/basic-data/archivesAdmin.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2022-01-11 16:54:24
- * @LastEditTime: 2022-01-11 16:55:25
+ * @LastEditTime: 2022-01-12 09:26:01
  * @LastEditors: Please set LastEditors
  * @Description: 基础资料 - 档案管理
  * @FilePath: \goldenPig\src\utils\apis\basic-data\archivesAdmin.js
@@ -39,3 +39,12 @@ export function baseFarmDel(params) {
     params: params
   })
 }
+
+// 获取所有牧场
+export function baseFarmAll(params) {
+  return axios({
+    url: '/eartag/baseFarmInfo/list',
+    method: 'get',
+    params: params
+  })
+}

src/utils/apis/basic-data/houseAdmin.js

@@ -1,13 +1,14 @@
 /*
  * @Author: your name
  * @Date: 2022-01-11 16:53:18
- * @LastEditTime: 2022-01-11 16:53:51
+ * @LastEditTime: 2022-01-12 09:45:19
  * @LastEditors: Please set LastEditors
  * @Description: 基础资料 - 栋舍管理
  * @FilePath: \goldenPig\src\utils\apis\basic-data\houseAdmin.js
  */
 import axios from "../../http";
 
+
 export function basePigpenList(params) {
   return axios({
     url: '/eartag/basePigpen/page',
@@ -39,3 +40,12 @@ export function basePigpenDel(params) {
     params: params
   })
 }
+
+// 栋舍表二级
+export function basePigpenOptions(params) {
+  return axios({
+    url: '/eartag/basePigpen/list',
+    method: 'get',
+    params: params
+  })
+}

src/views/basic-data/house-admin/HouseAdmin.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2022-01-08 10:36:43
- * @LastEditTime: 2022-01-11 16:57:28
+ * @LastEditTime: 2022-01-12 15:58:00
  * @LastEditors: Please set LastEditors
  * @Description: 基础资料 - 栋舍管理
  * @FilePath: \goldenPig\src\views\basic-data\house-admin\HouseAdmin.vue
@@ -32,12 +32,32 @@
     </table-cpn>
 
     <modal-cpn ref="modal" v-bind="modalConfig" :otherParams="modalForm2">
-      <!-- 位置 -->
+      <!-- 牧场名称 -->
+      <template #farmId="scope">
+        <el-select
+          v-model="modalForm2.farmId"
+          :placeholder="scope.item.placeholder"
+          style="width: 100%"
+          clearable
+        >
+          <el-option
+            v-for="option in farmList"
+            :key="option.label"
+            v-bind="option"
+          >
+          </el-option>
+        </el-select>
+      </template>
+
+      <!-- 上级 -->
       <template #parentId="scope">
         <el-cascader
-          :options="options"
-          :value="location"
-          @change="submitLocation"
+          :options="pigpenList"
+          :props="{ checkStrictly: true }"
+          :value="pigpenSelected"
+          :disabled="optionsDisabled"
+          @focus="handlePigpenFocus"
+          @change="submitParentId"
           :placeholder="scope.item.placeholder"
           style="width: 100%"
         >
@@ -64,8 +84,11 @@ import {
   basePigpenAdd,
   basePigpenEdit,
   basePigpenDel,
+  basePigpenOptions, // 栋舍表二级，用于模态框
 } from "@/utils/apis/basic-data/houseAdmin.js";
 
+import { baseFarmAll } from "@/utils/apis/basic-data/archivesAdmin.js";
+
 export default {
   components: {
     // SearchCpn,
@@ -77,8 +100,12 @@ export default {
       // 搜索
       searchConfig: {},
       searchForm1: {
-        farmName: "",
-        type: "",
+        farmId: "",
+        parentId: "",
+        pigpenName: "",
+        pigpenTemp: "",
+        tempAnomaly: "",
+        stage: "",
       },
       searchForm2: {
         location: [],
@@ -92,14 +119,21 @@ export default {
       // 新增 or 编辑
       modalConfig: {},
       modalForm1: {
-        farmName: "",
-        type: "",
+        pigpenName: "",
+        pigpenTemp: "",
+        tempAnomaly: "",
+        stage: "",
       },
-      options: [],
-      location: [],
+      farmList: [], // 名下所有牧场
+      pigpenAllList: [], // 所有的栋舍(二级)
+      pigpenList: [], // 根据牧场所确定的栋舍(二级)
+      pigpenSelected: [],
       modalForm2: {
+        farmId: "",
         parentId: "",
+        type: "",
       },
+      optionsDisabled: false, // 用于级联选择器的报错，没有实际意义
     };
   },
   created() {
@@ -114,6 +148,7 @@ export default {
       tableStyle: {
         height: 700,
         footer: false,
+        treeProps: { children: "children" },
       },
     };
     this.modalConfig = {
@@ -137,34 +172,96 @@ export default {
     handleClearEvent() {
       this.searchForm2.location = [];
     },
-    // 地点
-    getlocation(val) {
-      console.log(val);
+    // 模态框的 上级
+    submitParentId(val) {
+      this.modalForm2.parentId = val[val.length - 1];
+      this.modalForm2.type = val.length;
+      // this.modalForm2.location = val.join();
     },
-    // 模态框的 位置
-    submitLocation(val) {
-      this.modalForm2.location = val.join();
+    // 选择上级之前，需要先选择牧场名称
+    handlePigpenFocus() {
+      if (!this.modalForm2.farmId) {
+        this.$message.warning("请先选择牧场名称");
+      }
     },
     // 新增 or 编辑事件
-    handleAddOrEditEvent(row) {
+    async handleAddOrEditEvent(row) {
+      this.modalForm2.farmId = "";
+      /* 牧场选择 */
+      const { code, data, message } = await baseFarmAll({});
+      if (code === 10000) {
+        this.farmList = data.map((item) => {
+          return {
+            value: item.id,
+            label: item.farmName,
+          };
+        });
+      } else {
+        this.$message.error(message, "无法选择牧场");
+        return;
+      }
+      /* 栋舍表二级 */
+      const pigpenOptions = await basePigpenOptions({});
+      if (pigpenOptions.code === 10000) {
+        // 递归函数：使返回值符合级联选择器的 label value
+        const recursive = (arr) => {
+          return arr.map((item) => {
+            if (item.children && item.children.length > 0) {
+              item.children = recursive(item.children);
+            }
+            return {
+              label: item.pigpenName,
+              value: item.id,
+              farmId: item.farmId,
+              children: item.children,
+            };
+          });
+        };
+        this.pigpenAllList = recursive(pigpenOptions.data);
+      } else {
+        this.$message.error(message, "无法选择上级");
+        return;
+      }
+
+      // this.modalConfig.modalItemProp[0].options = allFarms.
       this.$refs["modal"].init(row);
       if (row.id) {
-        this.location = row.location.split(",");
-        this.modalForm2.location = row.location;
+        this.modalForm2.farmId = row.farmId;
+        this.modalForm2.parentId = row.parentId;
+        this.modalForm2.type = row.type;
+        if (row.grandId) {
+          this.pigpenSelected = [0, row.grandId, row.parentId];
+        } else if (row.parentId) {
+          this.pigpenSelected = [0, row.parentId];
+        } else {
+          this.pigpenSelected = [0];
+        }
       } else {
-        this.location = [];
-        this.modalForm2.location = "";
+        this.modalForm2.farmId = "";
+        this.pigpenSelected = [];
+        this.modalForm2.type = "";
       }
     },
   },
   watch: {
-    "searchForm2.location": {
+    "modalForm2.farmId": {
       handler(newVal) {
-        if (typeof newVal === "object") {
-          this.searchForm2.location = newVal.join();
+        this.optionsDisabled = false;
+        if (!newVal) {
+          this.optionsDisabled = false;
+          return;
         }
+        let pigpenList = this.pigpenAllList.filter((item) => {
+          return item.farmId === this.modalForm2.farmId;
+        });
+        this.pigpenList = [
+          {
+            label: "顶级",
+            value: 0,
+            children: pigpenList,
+          },
+        ];
       },
-      deep: true,
     },
   },
 };

src/views/basic-data/house-admin/config/modal.config.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2022-01-08 16:08:30
- * @LastEditTime: 2022-01-11 16:51:23
+ * @LastEditTime: 2022-01-12 15:51:16
  * @LastEditors: Please set LastEditors
  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  * @FilePath: \goldenPig\src\views\basic-data\archives-admin\config\modal.config.js
@@ -9,22 +9,27 @@
 export const modalItemProp = [
   {
     label: '牧场名称：',
-    type: 'select',
-    field: 'farmCode',
+    type: 'custom',
+    field: 'farmId',
     placeholder: '请选择牧场名称',
+    options: [],
+    slotName: 'farmId',
+    rules: [{ required: true, message: '牧场不能为空', trigger: 'change' }]
   },
   {
     label: '上级：',
     type: 'custom',
     field: 'parentId',
     slotName: 'parentId',
-    placeholder: '请选择上级'
+    placeholder: '请选择上级',
+    rules: [{ required: true, message: '上级不能为空', trigger: 'change'}]
   },
   {
-    label: '栋舍名称：',
+    label: '栋/楼/单元 名称：',
     type: 'input',
     field: 'pigpenName',
     placeholder: '请输入栋舍名称',
+    rules: [{ required: true, message: '名称不能为空', trigger: 'blur'}]
   },
   {
     label: '猪舍温度(℃)：',
@@ -66,6 +71,7 @@ export const modalItemProp = [
         value: 3,
         label: '分娩'
       }
-    ]
+    ],
+    rules: [{ required: true, message: '阶段不能为空', trigger: 'change'}]
   },
 ]

src/views/basic-data/house-admin/config/table.config.js

@@ -1,21 +1,22 @@
 /*
  * @Author: your name
  * @Date: 2022-01-07 14:43:27
- * @LastEditTime: 2022-01-11 14:23:09
+ * @LastEditTime: 2022-01-12 14:30:07
  * @LastEditors: Please set LastEditors
  * @Description: 养殖企业 - 表格配置
  * @FilePath: \goldenPig\src\views\summary-data\individual-data\config\table.config.js
  */
 export const propList = [
-  {
-    label: '牧场名称',
-    prop: 'farmName',
-    slotName: 'farmName'
-  },
+  // {
+  //   label: '牧场名称',
+  //   prop: 'farmName',
+  //   slotName: 'farmName'
+  // },
   {
     label: '栋舍名称',
     prop: 'pigpenName',
-    slotName: 'pigpenName'
+    slotName: 'pigpenName',
+    align: 'left'
   },
   {
     label: '猪舍温度',
@@ -24,8 +25,8 @@ export const propList = [
   },
   {
     label: '猪舍状态',
-    prop: 'pigpenAnomaly',
-    slotName: 'pigpenAnomaly'
+    prop: 'tempAnomaly',
+    slotName: 'tempAnomaly'
   },
   {
     label: '阶段',
@@ -34,8 +35,8 @@ export const propList = [
   },
   {
     label: '创建时间',
-    prop: 'createTime',
-    slotName: 'createTime'
+    prop: 'creatTime',
+    slotName: 'creatTime'
   },
   {
     label: '操作',