feat(inspplan): 添加质检方案选择组件

mes-ui/mes-ui-admin-vue3/src/views/biz/inspplan/InspPlanSelect.vue

@@ -0,0 +1,94 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" width="800px">
+    <el-form :model="queryParams" inline label-width="80px">
+      <el-form-item label="检索条件">
+        <el-input v-model="queryParams.keyWord" placeholder="请输入方案编号或者方案名称" clearable class="!w-200px" />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="searchInspPlan">搜索</el-button>
+        <el-button @click="resetQuery">重置</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table v-loading="loading" :data="inspPlanList" :show-overflow-tooltip="true" class="mt-15px" @row-click="handleRowClick" @row-dblclick="handleRowDblClick">
+      <el-table-column label="选择" width="60px" align="center">
+        <template #default="scope">
+          <el-radio v-model="selectedId" :label="scope.row.id">&nbsp;</el-radio>
+        </template>
+      </el-table-column>
+      <el-table-column label="序号" width="60px" align="center" type="index" />
+      <el-table-column label="质检编号" align="center" prop="schemeNo" />
+      <el-table-column label="质检名称" align="center" prop="schemeName" />
+      <el-table-column label="描述" align="center" prop="remark" />
+    </el-table>
+    <template #footer>
+      <el-button @click="confirmSelection" type="primary">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import * as InspPlanApi from '@/api/biz/inspplan'
+
+const message = useMessage()
+const dialogVisible = ref(false)
+const dialogTitle = ref('选择质检方案')
+const loading = ref(false)
+const total = ref(0)
+const inspPlanList = ref([])
+const selectedInspPlan = ref(null)
+const selectedId = ref<string | undefined>(undefined)
+
+const queryParams = reactive({
+  keyWord: undefined
+})
+
+const emit = defineEmits(['confirm'])
+
+const open = (defaultId?: number) => {
+  dialogVisible.value = true
+  selectedInspPlan.value = null
+  // 转换为字符串类型，与接口返回的 id 类型一致
+  selectedId.value = defaultId ? String(defaultId) : undefined
+  searchInspPlan()
+}
+
+const searchInspPlan = async () => {
+  loading.value = true
+  try {
+    const data = await InspPlanApi.getInspPlanDropdown(queryParams)
+    inspPlanList.value = data
+    total.value = data.length
+  } finally {
+    loading.value = false
+  }
+}
+
+const resetQuery = () => {
+  queryParams.keyWord = undefined
+  searchInspPlan()
+}
+
+const handleRowClick = (row: any) => {
+  selectedInspPlan.value = row
+  selectedId.value = row.id
+}
+
+const handleRowDblClick = (row: any) => {
+  selectedInspPlan.value = row
+  selectedId.value = row.id
+  emit('confirm', row)
+  dialogVisible.value = false
+}
+
+const confirmSelection = () => {
+  if (!selectedInspPlan.value) {
+    message.warning('请选择质检方案')
+    return
+  }
+  emit('confirm', selectedInspPlan.value)
+  dialogVisible.value = false
+}
+
+defineExpose({ open })
+</script>