Merge remote-tracking branch 'origin/master'

src/api/dms/shutReason.js

@@ -52,3 +52,21 @@ export function selectDmsBaseShutReasonList(query) {
     params: query
   })
 }
+
+// 查询停机原因树
+export function getShutReasonTree(query) {
+  return request({
+    url: '/dms/shutReason/tree',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询推荐停机原因
+export function getRecommendShutReasonList(query) {
+  return request({
+    url: '/dms/shutReason/recommend',
+    method: 'get',
+    params: query
+  })
+}

src/views/dms/shutDownRecord/index.vue

@@ -1,30 +1,57 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+    <el-form
-<!--      <el-form-item label="设备ID" prop="deviceId">-->
+      ref="queryForm"
-<!--        <el-input-->
+      :model="queryParams"
-<!--          v-model="queryParams.deviceId"-->
+      size="small"
-<!--          placeholder="请输入设备ID"-->
+      :inline="true"
-<!--          clearable-->
+      v-show="showSearch"
-<!--          @keyup.enter.native="handleQuery"-->
+      label-width="68px"
-<!--        />-->
+    >
-<!--      </el-form-item>-->
       <el-form-item label="设备" prop="deviceCode">
-        <el-select v-model="queryParams.deviceCode" placeholder="请选择设备" clearable filterable @change="handleQuery">
+        <el-select
+          v-model="queryParams.deviceCode"
+          placeholder="请选择设备"
+          clearable
+          filterable
+          @change="handleQueryDeviceChange"
+        >
           <el-option
             v-for="item in deviceLedgerList"
             :key="item.deviceCode"
             :label="item.deviceCode + ' - ' + item.deviceName"
-            :value="item.deviceCode" />
+            :value="item.deviceCode"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="停机大类" prop="shutType">
+        <el-select
+          v-model="queryParams.shutType"
+          placeholder="请选择停机大类"
+          clearable
+          @change="handleQueryTypeChange"
+        >
+          <el-option
+            v-for="item in queryShutReasonTree"
+            :key="item.shutTypeId"
+            :label="item.shutTypeName"
+            :value="item.shutTypeId"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="停机原因" prop="shutReasonId">
-        <el-select v-model="queryParams.shutReasonId" placeholder="请选择停机原因" clearable @change="handleQuery">
+        <el-select
+          v-model="queryParams.shutReasonId"
+          placeholder="请选择停机原因"
+          clearable
+          @change="handleQuery"
+        >
           <el-option
-            v-for="item in shutReasonList"
+            v-for="item in queryShutReasonList"
             :key="item.shutReasonId"
             :label="item.shutReason"
-            :value="item.shutReasonId" />
+            :value="item.shutReasonId"
+          />
         </el-select>
       </el-form-item>
       <el-form-item label="停机时间">
@@ -35,42 +62,9 @@
           start-placeholder="开始时间"
           end-placeholder="结束时间"
           value-format="yyyy-MM-dd HH:mm:ss"
-          @change="handleQuery">
+          @change="handleQuery"
-        </el-date-picker>
+        />
       </el-form-item>
-      <!-- <el-form-item label="停机时间" prop="shutBeginTime">
-        <el-date-picker clearable
-                       v-model="queryParams.shutBeginTime"
-                       type="datetime"
-                       value-format="yyyy-MM-dd HH:mm:ss"
-                       placeholder="请选择停机开始时间">
-        </el-date-picker>
-      </el-form-item>
-      <el-form-item><div>-</div></el-form-item>
-      <el-form-item label="" prop="shutEndTime">
-        <el-date-picker clearable
-                       v-model="queryParams.shutEndTime"
-                       type="datetime"
-                       value-format="yyyy-MM-dd HH:mm:ss"
-                       placeholder="请选择停机结束时间">
-        </el-date-picker>
-      </el-form-item> -->
-<!--      <el-form-item label="停机时长" prop="shutTime">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.shutTime"-->
-<!--          placeholder="请输入停机时长"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
-<!--      <el-form-item label="是否标识：1-是；2-否" prop="isFlag">-->
-<!--        <el-input-->
-<!--          v-model="queryParams.isFlag"-->
-<!--          placeholder="请输入是否标识：1-是；2-否"-->
-<!--          clearable-->
-<!--          @keyup.enter.native="handleQuery"-->
-<!--        />-->
-<!--      </el-form-item>-->
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -78,27 +72,6 @@
     </el-form>
 
     <el-row :gutter="10" class="mb8">
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="primary"-->
-<!--          plain-->
-<!--          icon="el-icon-plus"-->
-<!--          size="mini"-->
-<!--          @click="handleAdd"-->
-<!--          v-hasPermi="['dms:shutDown:add']"-->
-<!--        >新增</el-button>-->
-<!--      </el-col>-->
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="success"-->
-<!--          plain-->
-<!--          icon="el-icon-edit"-->
-<!--          size="mini"-->
-<!--          :disabled="single"-->
-<!--          @click="handleUpdate"-->
-<!--          v-hasPermi="['dms:shutDown:edit']"-->
-<!--        >修改</el-button>-->
-<!--      </el-col>-->
       <el-col :span="1.5">
         <el-button
           type="warning"
@@ -121,42 +94,17 @@
           v-hasPermi="['dms:shutDown:remove']"
         >删除</el-button>
       </el-col>
-<!--      <el-col :span="1.5">-->
-<!--        <el-button-->
-<!--          type="warning"-->
-<!--          plain-->
-<!--          icon="el-icon-download"-->
-<!--          size="mini"-->
-<!--          @click="handleExport"-->
-<!--          v-hasPermi="['dms:shutDown:export']"-->
-<!--        >导出</el-button>-->
-<!--      </el-col>-->
     </el-row>
 
     <el-table v-loading="loading" :data="shutDownList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
-<!--      <el-table-column label="主键标识;scada上报的记录" align="center" prop="recordShutDownId" />-->
+      <el-table-column label="设备" align="center" prop="deviceName">
-      <el-table-column label="设备" align="center" prop="deviceName" >
         <template slot-scope="{ row }">
           <span v-if="row.deviceName">{{ row.deviceName }}</span>
           <span v-else-if="ledgerMap[row.deviceId]">{{ ledgerMap[row.deviceId].deviceName || ledgerMap[row.deviceId].deviceCode }}</span>
           <span v-else>{{ row.deviceId }}</span>
         </template>
       </el-table-column>
-<!--      <el-table-column label="设备名称" align="center" prop="deviceId" >-->
-<!--        <template slot-scope="scope">-->
-<!--            <span-->
-<!--              v-for="(item, index) in ledgerList"-->
-<!--              :key="index"-->
-<!--              :value="item.ledgerList"-->
-<!--              v-if="scope.row.deviceId == item.deviceId"-->
-<!--            >-->
-<!--              {{ item.deviceName }}-->
-<!--            </span>-->
-<!--        </template>-->
-<!--      </el-table-column>-->
-<!--      <el-table-column label="停机类型ID，关联dm_base_shut_type的shut_type_id" align="center" prop="shutType" />-->
-      <!-- 停机类型后端自动赋值，前端不展示选择 -->
       <el-table-column label="停机原因" align="center" prop="shutReason" />
       <el-table-column label="停机开始时间" align="center" prop="shutBeginTime" width="200">
         <template slot-scope="scope">
@@ -169,7 +117,6 @@
         </template>
       </el-table-column>
       <el-table-column label="停机时长" align="center" prop="shutTime" />
-<!--      <el-table-column label="是否标识：1-是；2-否" align="center" prop="isFlag" />-->
       <el-table-column label="备注" align="center" prop="remark" />
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
@@ -192,61 +139,83 @@
     </el-table>
 
     <pagination
-      v-show="total>0"
+      v-show="total > 0"
       :total="total"
       :page.sync="queryParams.pageNum"
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
 
-    <!-- 添加或修改停机记录对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="720px" append-to-body>
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="设备名称" prop="deviceId">
-<!--        <el-form-item label="设备ID，关联dms_base_device_ledger的device_id" prop="deviceId">-->
+          <el-select v-model="form.deviceId" placeholder="请选择设备" filterable @change="handleFormDeviceChange">
-<!--          <el-input v-model="form.deviceId" placeholder="请输入设备ID，关联dms_base_device_ledger的device_id" />-->
-<!--        </el-form-item>-->
-        <el-form-item label="设备名称" prop="deviceId" >
-          <el-select v-model="form.deviceId" placeholder="请输入设备类型">
             <el-option
               v-for="item in ledgerList"
               :key="item.deviceId"
               :label="item.deviceName"
-              :value="item.deviceId">
+              :value="item.deviceId"
-            </el-option>
+            />
           </el-select>
         </el-form-item>
-        <el-form-item label="停机原因" prop="shutReasonId">
+
-          <el-select v-model="form.shutReasonId" placeholder="请选择停机原因" @change="onReasonChange">
+        <el-form-item v-if="recommendReasonList.length" label="常用原因">
+          <div class="recommend-wrapper">
+            <el-button
+              v-for="item in recommendReasonList"
+              :key="item.shutReasonId"
+              size="mini"
+              plain
+              @click="pickFormRecommendReason(item)"
+            >
+              {{ item.shutTypeName }} / {{ item.shutReason }}
+            </el-button>
+          </div>
+        </el-form-item>
+
+        <el-form-item label="停机大类" prop="shutType">
+          <el-select v-model="form.shutType" placeholder="请选择停机大类" @change="handleFormTypeChange">
             <el-option
-              v-for="item in shutReasonList"
+              v-for="item in shutReasonTree"
+              :key="item.shutTypeId"
+              :label="item.shutTypeName"
+              :value="item.shutTypeId"
+            />
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="停机原因" prop="shutReasonId">
+          <el-select v-model="form.shutReasonId" placeholder="请选择停机原因" @change="handleFormReasonChange">
+            <el-option
+              v-for="item in formShutReasonList"
               :key="item.shutReasonId"
               :label="item.shutReason"
               :value="item.shutReasonId"
             />
           </el-select>
         </el-form-item>
+
         <el-form-item label="停机开始时间" prop="shutBeginTime">
-          <el-date-picker clearable
+          <el-date-picker
+            clearable
             v-model="form.shutBeginTime"
             type="date"
             value-format="yyyy-MM-dd"
-            placeholder="请选择停机开始时间">
+            placeholder="请选择停机开始时间"
-          </el-date-picker>
+          />
         </el-form-item>
         <el-form-item label="停机结束时间" prop="shutEndTime">
-          <el-date-picker clearable
+          <el-date-picker
+            clearable
             v-model="form.shutEndTime"
             type="date"
             value-format="yyyy-MM-dd"
-            placeholder="请选择停机结束时间">
+            placeholder="请选择停机结束时间"
-          </el-date-picker>
+          />
         </el-form-item>
         <el-form-item label="停机时长" prop="shutTime">
           <el-input v-model="form.shutTime" placeholder="请输入停机时长" />
         </el-form-item>
-<!--        <el-form-item label="是否标识：1-是；2-否" prop="isFlag">-->
-<!--          <el-input v-model="form.isFlag" placeholder="请输入是否标识：1-是；2-否" />-->
-<!--        </el-form-item>-->
         <el-form-item label="备注" prop="remark">
           <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
         </el-form-item>
@@ -257,16 +226,42 @@
       </div>
     </el-dialog>
 
-    <!-- 批量维护对话框 -->
+    <el-dialog title="批量维护停机原因" :visible.sync="batchUpdateOpen" width="680px" append-to-body>
-    <el-dialog title="批量维护停机原因" :visible.sync="batchUpdateOpen" width="400px" append-to-body>
       <el-form ref="batchForm" :model="batchForm" :rules="batchRules" label-width="100px">
-        <el-form-item label="停机原因" prop="shutReasonId">
+        <el-form-item v-if="batchRecommendReasonList.length" label="常用原因">
-          <el-select v-model="batchForm.shutReasonId" placeholder="请选择停机原因" style="width: 100%">
+          <div class="recommend-wrapper">
+            <el-button
+              v-for="item in batchRecommendReasonList"
+              :key="item.shutReasonId"
+              size="mini"
+              plain
+              @click="pickBatchRecommendReason(item)"
+            >
+              {{ item.shutTypeName }} / {{ item.shutReason }}
+            </el-button>
+          </div>
+        </el-form-item>
+        <el-form-item v-else-if="batchRecommendHint" label="提示">
+          <span class="batch-hint">{{ batchRecommendHint }}</span>
+        </el-form-item>
+        <el-form-item label="停机大类" prop="shutType">
+          <el-select v-model="batchForm.shutType" placeholder="请选择停机大类" style="width: 100%" @change="handleBatchTypeChange">
             <el-option
-              v-for="item in shutReasonList"
+              v-for="item in batchShutReasonTree"
+              :key="item.shutTypeId"
+              :label="item.shutTypeName"
+              :value="item.shutTypeId"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="停机原因" prop="shutReasonId">
+          <el-select v-model="batchForm.shutReasonId" placeholder="请选择停机原因" style="width: 100%" @change="handleBatchReasonChange">
+            <el-option
+              v-for="item in batchShutReasonList"
               :key="item.shutReasonId"
               :label="item.shutReason"
-              :value="item.shutReasonId" />
+              :value="item.shutReasonId"
+            />
           </el-select>
         </el-form-item>
         <el-form-item>
@@ -283,63 +278,70 @@
 
 <script>
 import { listShutDown, getShutDown, delShutDown, addShutDown, updateShutDown, batchUpdateShutReason } from "@/api/dms/shutDown";
-import { selectDmsBaseShutReasonList } from '@/api/dms/shutReason'
+import { getShutReasonTree, getRecommendShutReasonList } from "@/api/dms/shutReason";
-import { getDeviceLedgerList } from '@/api/base/deviceLedger'
+import { getDeviceLedgerList } from "@/api/base/deviceLedger";
 
 export default {
   name: "ShutDown",
   data() {
     return {
-      ledgerList:[],
+      ledgerList: [],
-      ledgerMap:{},
+      ledgerMap: {},
       deviceLedgerList: [],
-      shutReasonList:[],
+      queryShutReasonTree: [],
+      queryShutReasonList: [],
+      shutReasonTree: [],
+      formShutReasonList: [],
+      batchShutReasonTree: [],
+      batchShutReasonList: [],
+      recommendReasonList: [],
+      batchRecommendReasonList: [],
+      batchRecommendHint: "",
+      selectedRows: [],
       dateRange: [],
-      // 遮罩层
       loading: true,
-      // 选中数组
       ids: [],
-      // 非单个禁用
       single: true,
-      // 非多个禁用
       multiple: true,
-      // 显示搜索条件
       showSearch: true,
-      // 总条数
       total: 0,
-      // 停机记录表格数据
       shutDownList: [],
-      // 弹出层标题
       title: "",
-      // 是否显示弹出层
       open: false,
-      // 批量维护对话框
       batchUpdateOpen: false,
-      // 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 10,
         deviceId: null,
         deviceCode: null,
+        shutType: null,
         shutReasonId: null,
         shutBeginTime: null,
         shutEndTime: null,
         shutTime: null,
-        isFlag: null,
+        isFlag: null
       },
-      // 表单参数
       form: {},
-      // 批量维护表单
       batchForm: {
-        shutReasonId: null
+        shutType: null,
+        shutReasonId: null,
+        shutReason: null
       },
-      // 表单校验
       rules: {
+        deviceId: [
+          { required: true, message: "请选择设备", trigger: "change" }
+        ],
+        shutType: [
+          { required: true, message: "请选择停机大类", trigger: "change" }
+        ],
         shutReasonId: [
           { required: true, message: "请选择停机原因", trigger: "change" }
         ]
       },
       batchRules: {
+        shutType: [
+          { required: true, message: "请选择停机大类", trigger: "change" }
+        ],
         shutReasonId: [
           { required: true, message: "请选择停机原因", trigger: "change" }
         ]
@@ -349,33 +351,21 @@ export default {
   created() {
     this.getList();
     this.getDevice();
-    this.getShutReason();
+    this.loadQueryReasonTree(null);
   },
   methods: {
-    /** 停机原因列表 */
+    getDevice() {
-    getShutReason() {
-      selectDmsBaseShutReasonList({}).then(res => {
-        this.shutReasonList = res.rows || res.data || [];
-      });
-    },
-    onReasonChange(val) {
-      const found = this.shutReasonList.find(r => r.shutReasonId === val);
-      this.form.shutReason = found ? found.shutReasonName : null;
-    },
-    //查询设备信息
-    getDevice(){
       getDeviceLedgerList({}).then(response => {
-        this.ledgerList = response.data;
+        this.ledgerList = response.data || [];
-        this.deviceLedgerList = response.data;
+        this.deviceLedgerList = response.data || [];
         this.ledgerMap = Array.isArray(response.data)
           ? response.data.reduce((acc, cur) => {
               acc[cur.deviceId] = cur;
               return acc;
             }, {})
           : {};
-      })
+      });
     },
-    /** 查询停机记录列表 */
     getList() {
       this.loading = true;
       this.queryParams.params = {};
@@ -387,18 +377,115 @@ export default {
         this.shutDownList = response.rows;
         this.total = response.total;
         this.loading = false;
+      }).finally(() => {
+        this.loading = false;
       });
     },
-    // 取消按钮
+    getDeviceByCode(deviceCode) {
+      return this.deviceLedgerList.find(item => item.deviceCode === deviceCode);
+    },
+    extractReasonListFromTree(tree, shutTypeId) {
+      if (!shutTypeId) {
+        return [];
+      }
+      const currentType = (tree || []).find(item => item.shutTypeId === shutTypeId);
+      return currentType && currentType.reasonList ? currentType.reasonList : [];
+    },
+    findReasonInTree(shutReasonId, tree) {
+      const typeList = tree || [];
+      for (let i = 0; i < typeList.length; i++) {
+        const reasonList = typeList[i].reasonList || [];
+        const current = reasonList.find(item => item.shutReasonId === shutReasonId);
+        if (current) {
+          return current;
+        }
+      }
+      return null;
+    },
+    ensureReasonVisible(reasonList, reason) {
+      if (!reason || !reason.shutReasonId) {
+        return reasonList;
+      }
+      const exists = reasonList.some(item => item.shutReasonId === reason.shutReasonId);
+      if (exists) {
+        return reasonList;
+      }
+      return reasonList.concat([reason]);
+    },
+    loadQueryReasonTree(deviceId) {
+      const params = deviceId ? { deviceId } : {};
+      return getShutReasonTree(params).then(res => {
+        this.queryShutReasonTree = res.data || [];
+        this.queryShutReasonList = this.extractReasonListFromTree(this.queryShutReasonTree, this.queryParams.shutType);
+        if (this.queryParams.shutReasonId && !this.findReasonInTree(this.queryParams.shutReasonId, this.queryShutReasonTree)) {
+          this.queryParams.shutReasonId = null;
+        }
+      });
+    },
+    loadFormReasonData(deviceId, keepCurrentReason) {
+      const params = deviceId ? { deviceId } : {};
+      const recommendPromise = deviceId ? getRecommendShutReasonList(params) : Promise.resolve({ data: [] });
+      return Promise.all([getShutReasonTree(params), recommendPromise]).then(([treeRes, recommendRes]) => {
+        this.shutReasonTree = treeRes.data || [];
+        this.recommendReasonList = recommendRes.data || [];
+
+        if (keepCurrentReason && this.form.shutReasonId) {
+          const found = this.findReasonInTree(this.form.shutReasonId, this.shutReasonTree);
+          if (found) {
+            this.form.shutType = found.shutTypeId;
+            this.form.shutReason = found.shutReason;
+          }
+        } else {
+          this.form.shutType = null;
+          this.form.shutReasonId = null;
+          this.form.shutReason = null;
+        }
+
+        this.formShutReasonList = this.extractReasonListFromTree(this.shutReasonTree, this.form.shutType);
+        if (keepCurrentReason && this.form.shutReasonId && this.form.shutReason) {
+          this.formShutReasonList = this.ensureReasonVisible(this.formShutReasonList, {
+            shutReasonId: this.form.shutReasonId,
+            shutReason: this.form.shutReason,
+            shutTypeId: this.form.shutType
+          });
+        }
+      });
+    },
+    loadBatchReasonData(deviceId) {
+      const params = deviceId ? { deviceId } : {};
+      const recommendPromise = deviceId ? getRecommendShutReasonList(params) : Promise.resolve({ data: [] });
+      return Promise.all([getShutReasonTree(params), recommendPromise]).then(([treeRes, recommendRes]) => {
+        this.batchShutReasonTree = treeRes.data || [];
+        this.batchRecommendReasonList = recommendRes.data || [];
+        this.batchShutReasonList = this.extractReasonListFromTree(this.batchShutReasonTree, this.batchForm.shutType);
+      });
+    },
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    handleQueryDeviceChange(deviceCode) {
+      const currentDevice = this.getDeviceByCode(deviceCode);
+      this.queryParams.shutType = null;
+      this.queryParams.shutReasonId = null;
+      this.loadQueryReasonTree(currentDevice ? currentDevice.deviceId : null).finally(() => {
+        this.handleQuery();
+      });
+    },
+    handleQueryTypeChange() {
+      this.queryParams.shutReasonId = null;
+      this.queryShutReasonList = this.extractReasonListFromTree(this.queryShutReasonTree, this.queryParams.shutType);
+      this.handleQuery();
+    },
     cancel() {
       this.open = false;
       this.reset();
     },
-    // 表单重置
     reset() {
       this.form = {
         recordShutDownId: null,
         deviceId: null,
+        shutType: null,
         shutReasonId: null,
         shutReason: null,
         shutBeginTime: null,
@@ -411,58 +498,82 @@ export default {
         updateBy: null,
         updateTime: null
       };
+      this.shutReasonTree = [];
+      this.formShutReasonList = [];
+      this.recommendReasonList = [];
       this.resetForm("form");
     },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.queryParams.pageNum = 1;
-      this.getList();
-    },
-    /** 重置按钮操作 */
     resetQuery() {
       this.dateRange = [];
       this.resetForm("queryForm");
+      this.queryShutReasonList = [];
+      this.loadQueryReasonTree(null).finally(() => {
         this.handleQuery();
+      });
     },
-    // 多选框选中数据
     handleSelectionChange(selection) {
-      this.ids = selection.map(item => item.recordShutDownId)
+      this.selectedRows = selection;
-      this.single = selection.length!==1
+      this.ids = selection.map(item => item.recordShutDownId);
-      this.multiple = !selection.length
+      this.single = selection.length !== 1;
+      this.multiple = !selection.length;
     },
-    /** 新增按钮操作 */
     handleAdd() {
       this.reset();
       this.open = true;
       this.title = "添加停机记录";
+      this.loadFormReasonData(null, false);
     },
-    /** 修改按钮操作 */
     handleUpdate(row) {
       this.reset();
-      const recordShutDownId = row.recordShutDownId || this.ids
+      const recordShutDownId = row.recordShutDownId || this.ids;
       getShutDown(recordShutDownId).then(response => {
         this.form = response.data;
-        this.open = true;
         this.title = "修改停机记录";
+        return this.loadFormReasonData(this.form.deviceId, true);
+      }).then(() => {
+        this.open = true;
       });
     },
-    /** 提交按钮 */
+    handleFormDeviceChange(deviceId) {
+      // 为什么这样做：设备切换后，设备专属原因和推荐口径都会变化，必须同步清空旧选择避免误提交。
+      this.loadFormReasonData(deviceId, false);
+    },
+    handleFormTypeChange() {
+      this.form.shutReasonId = null;
+      this.form.shutReason = null;
+      this.formShutReasonList = this.extractReasonListFromTree(this.shutReasonTree, this.form.shutType);
+    },
+    handleFormReasonChange(shutReasonId) {
+      const found = this.findReasonInTree(shutReasonId, this.shutReasonTree);
+      this.form.shutReason = found ? found.shutReason : null;
+      this.form.shutType = found ? found.shutTypeId : this.form.shutType;
+      this.formShutReasonList = this.extractReasonListFromTree(this.shutReasonTree, this.form.shutType);
+    },
+    pickFormRecommendReason(item) {
+      this.form.shutType = item.shutTypeId;
+      this.formShutReasonList = this.extractReasonListFromTree(this.shutReasonTree, item.shutTypeId);
+      this.form.shutReasonId = item.shutReasonId;
+      this.form.shutReason = item.shutReason;
+    },
+    normalizeFormReasonFields() {
+      const found = this.findReasonInTree(this.form.shutReasonId, this.shutReasonTree);
+      if (found) {
+        this.form.shutType = found.shutTypeId;
+        this.form.shutReason = found.shutReason;
+      }
+    },
     submitForm() {
       this.$refs["form"].validate(valid => {
         if (valid) {
-          // 将选择的原因名称写回描述，便于后台使用
+          this.normalizeFormReasonFields();
-          if (this.form.shutReasonId && !this.form.shutReason) {
-            const found = this.shutReasonList.find(r => r.shutReasonId === this.form.shutReasonId);
-            this.form.shutReason = found ? found.shutReasonName : this.form.shutReason;
-          }
           if (this.form.recordShutDownId != null) {
-            updateShutDown(this.form).then(response => {
+            updateShutDown(this.form).then(() => {
               this.$modal.msgSuccess("修改成功");
               this.open = false;
               this.getList();
             });
           } else {
-            addShutDown(this.form).then(response => {
+            addShutDown(this.form).then(() => {
               this.$modal.msgSuccess("新增成功");
               this.open = false;
               this.getList();
@@ -471,10 +582,8 @@ export default {
         }
       });
     },
-    /** 删除按钮操作 */
     handleDelete(row) {
       const recordShutDownIds = row.recordShutDownId || this.ids;
-
       this.$modal.confirm('是否确认删除停机记录编号为"' + recordShutDownIds + '"的数据项？').then(function() {
         return delShutDown(recordShutDownIds);
       }).then(() => {
@@ -482,32 +591,62 @@ export default {
         this.$modal.msgSuccess("删除成功");
       }).catch(() => {});
     },
-    /** 导出按钮操作 */
     handleExport() {
       this.download('dms/shutDown/export', {
         ...this.queryParams
-      }, `shutDown_${new Date().getTime()}.xlsx`)
+      }, `shutDown_${new Date().getTime()}.xlsx`);
     },
-    /** 批量维护按钮操作 */
     handleBatchUpdate() {
       if (this.ids.length === 0) {
         this.$modal.msgWarning("请至少选择一条记录");
         return;
       }
       this.batchForm = {
-        shutReasonId: null
+        shutType: null,
+        shutReasonId: null,
+        shutReason: null
       };
+      this.batchShutReasonList = [];
+      this.batchRecommendReasonList = [];
+      const selectedDeviceIds = [...new Set(this.selectedRows.map(item => item.deviceId).filter(item => item != null))];
+      const deviceId = selectedDeviceIds.length === 1 ? selectedDeviceIds[0] : null;
+      this.batchRecommendHint = selectedDeviceIds.length > 1
+        ? "已选择多台设备，推荐原因仅在单设备场景展示"
+        : "";
+      this.loadBatchReasonData(deviceId).then(() => {
         this.batchUpdateOpen = true;
+      });
+    },
+    handleBatchTypeChange() {
+      this.batchForm.shutReasonId = null;
+      this.batchForm.shutReason = null;
+      this.batchShutReasonList = this.extractReasonListFromTree(this.batchShutReasonTree, this.batchForm.shutType);
+    },
+    handleBatchReasonChange(shutReasonId) {
+      const found = this.findReasonInTree(shutReasonId, this.batchShutReasonTree);
+      this.batchForm.shutReason = found ? found.shutReason : null;
+      this.batchForm.shutType = found ? found.shutTypeId : this.batchForm.shutType;
+      this.batchShutReasonList = this.extractReasonListFromTree(this.batchShutReasonTree, this.batchForm.shutType);
+    },
+    pickBatchRecommendReason(item) {
+      this.batchForm.shutType = item.shutTypeId;
+      this.batchForm.shutReasonId = item.shutReasonId;
+      this.batchForm.shutReason = item.shutReason;
+      this.batchShutReasonList = this.extractReasonListFromTree(this.batchShutReasonTree, item.shutTypeId);
     },
-    /** 批量维护提交 */
     submitBatchUpdate() {
       this.$refs["batchForm"].validate(valid => {
         if (valid) {
+          const found = this.findReasonInTree(this.batchForm.shutReasonId, this.batchShutReasonTree);
+          if (found) {
+            this.batchForm.shutType = found.shutTypeId;
+            this.batchForm.shutReason = found.shutReason;
+          }
           const data = {
             recordShutDownIds: this.ids,
             shutReasonId: this.batchForm.shutReasonId
           };
-          batchUpdateShutReason(data).then(response => {
+          batchUpdateShutReason(data).then(() => {
             this.$modal.msgSuccess("批量维护成功");
             this.batchUpdateOpen = false;
             this.getList();
@@ -518,3 +657,16 @@ export default {
   }
 };
 </script>
+
+<style scoped>
+.recommend-wrapper {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.batch-hint {
+  color: #909399;
+  font-size: 12px;
+}
+</style>