1.报故接口2.全局字典。3.用户列表。

src/api/auth/index.ts

@@ -50,3 +50,23 @@ export function getOrgListApi(): AxiosPromise<any[]> {
     method: "get",
   });
 }
+
+/**
+ * 登录成功后获取用户字典
+ */
+export function getUserDicts(data: string[]): AxiosPromise {
+  return request({
+    url: "/api/v1/sys/dictData/queryByTypes",
+    method: "post",
+    data: data,
+  });
+}
+
+// 用户信息列表查询
+export function getUserList(): AxiosPromise {
+  return request({
+    url: "/api/v1/sys/user/list",
+    method: "post",
+    data: {},
+  });
+}

src/api/process/reportBreak.ts

@@ -0,0 +1,27 @@
+import request from "@/utils/request";
+
+// 通过生产过程id物料生产信息 :包含上方基本信息和报故数量需要选择的序列号
+export function breakReportInfoById(processId: string) {
+  return request({
+    url: `/api/v1/process/escalationFault/getWorkDetail/${processId}`,
+    method: "get",
+  });
+}
+
+// 不合格品分布情况及工序(通过序列号获取关联工序)
+export function operationListByIds(ids: string[]) {
+  return request({
+    url: `/api/v1/process/escalationFault/operation/list`,
+    method: "post",
+    data: { seqNoList: ids },
+  });
+}
+
+// 新增一体机报故
+export function addBreakReport(data: object) {
+  return request({
+    url: `/api/v1/process/escalationFault/add`,
+    method: "post",
+    data: data,
+  });
+}

src/plugins/permission.ts

@@ -1,5 +1,6 @@
 import router from "@/router";
 import NProgress from "@/utils/nprogress";
+import { useDictionaryStore } from "@/store/modules/dictionary";
 
 export function setupPermission() {
   // 白名单路由
@@ -14,6 +15,8 @@ export function setupPermission() {
         next({ path: "/" });
         NProgress.done();
       } else {
+        const dictStore = useDictionaryStore();
+        dictStore.checkDicts();
         next();
         NProgress.done();
       }

src/store/index.ts

@@ -1,9 +1,11 @@
 import type { App } from "vue";
 import { createPinia } from "pinia";
 import piniaPluginPersistedstate from "pinia-plugin-persistedstate";
+
 const store = createPinia();
 //状态机持久化
 store.use(piniaPluginPersistedstate);
+
 // 全局注册 store
 export function setupStore(app: App<Element>) {
   app.use(store);
@@ -16,4 +18,5 @@ export * from "./modules/tagsView";
 export * from "./modules/user";
 export * from "./modules/common";
 export * from "./modules/processView";
+export * from "./modules/dictionary";
 export { store };

src/store/modules/dictionary.ts

@@ -0,0 +1,39 @@
+import { store } from "@/store";
+import { defineStore } from "pinia";
+import { getUserDicts } from "@/api/auth";
+
+export const useDictionaryStore = defineStore("dictionaryStore", () => {
+  const types = ["unqualified_type", "stage"];
+  const dicts = ref<{ string?: any[] }>({});
+
+  function checkDicts() {
+    if (JSON.stringify(dicts.value) === "{}") {
+      getUserDicts(types).then((res) => {
+        if (res.data) {
+          dicts.value = res?.data ?? [];
+        }
+      });
+    }
+  }
+
+  function getLableByValue(type: string, value: string) {
+    const dict = dicts.value[type];
+    if (dict) {
+      const lable = dict.find((item: string) => item.dictValue === value);
+      return lable?.dictLabel;
+    }
+    return "";
+  }
+
+  return {
+    types,
+    dicts,
+    checkDicts,
+    getLableByValue,
+  };
+});
+
+export function useDictionaryStoreHook() {
+  // console.log('dicts:',useDictionaryStore(store))
+  return useDictionaryStore(store);
+}

src/views/pro-operation/report-break/index.vue

@@ -12,24 +12,144 @@
       <el-scrollbar>
         <div id="drawContent">
           <el-form
+            ref="formRef"
             :model="formLabelAlign"
+            :rules="rules"
             label-position="top"
             label-width="auto"
             size="large"
           >
-            <el-form-item label="Name">
+            <el-form-item label="基本信息">
               <div class="base-info">
                 <div class="info-item">
                   <div class="item-label">产品名称</div>
-                  <div class="item-value">DASDF-ASFASF-AS天线</div>
+                  <div class="item-value">{{ infoData?.materialName }}</div>
+                </div>
+                <div class="info-item">
+                  <div class="item-label">阶段</div>
+                  <div class="item-value">
+                    {{
+                      dictStroe.getLableByValue(
+                        "stage",
+                        infoData?.stageDictValue
+                      )
+                    }}
+                  </div>
+                </div>
+                <div class="info-item">
+                  <div class="item-label">生产数量</div>
+                  <div class="item-value">{{ infoData?.planNum }}</div>
                 </div>
               </div>
             </el-form-item>
-            <el-form-item label="Activity zone">
-              <el-input v-model="formLabelAlign.region" />
+            <el-form-item
+              :label="`报故数量[${formLabelAlign.seqNo.length}]`"
+              prop="escalationItemList"
+            >
+              <el-select
+                v-model="formLabelAlign.seqNo"
+                multiple
+                placeholder="请选择"
+                value-key="seqNo"
+                @change="selectProcessWorkSeqChange"
+              >
+                <el-option
+                  v-for="item in infoData?.processWorkSeq"
+                  :key="item.seqNo"
+                  :label="item.seqNo"
+                  :value="item.seqNo"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="不合格原因分类" prop="reason">
+              <el-select
+                v-model="formLabelAlign.reason"
+                multiple
+                placeholder="请选择"
+                value-key="dictValue"
+              >
+                <el-option
+                  v-for="item in dictStroe.dicts.unqualified_type"
+                  :key="item.dictValue"
+                  :label="item.dictLabel"
+                  :value="item.dictValue"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="是否首检" prop="firstInspection">
+              <el-radio-group v-model="formLabelAlign.firstInspection">
+                <el-radio :value="0" border size="large">否</el-radio>
+                <el-radio :value="1" border size="large">是</el-radio>
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item label="不合格品分布情况及工序" prop="processes">
+              <el-select
+                v-model="formLabelAlign.processes"
+                multiple
+                placeholder="请选择"
+                value-key="operationId"
+              >
+                <el-option
+                  v-for="item in operationList"
+                  :key="item.operationId"
+                  :label="item.operationName"
+                  :value="item.operationId"
+                />
+              </el-select>
+            </el-form-item>
+
+            <el-row :gutter="20" style="width: 100%">
+              <el-col :span="12">
+                <el-form-item label="责任/经办者" prop="personResponsible">
+                  <el-select
+                    v-model="formLabelAlign.personResponsible"
+                    filterable
+                    placeholder="请选择"
+                    value-key="id"
+                  >
+                    <el-option
+                      v-for="item in allUsers"
+                      :key="item.id"
+                      :label="item.userName"
+                      :value="item.userName"
+                    />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="检验员" prop="userName">
+                  <el-select
+                    v-model="formLabelAlign.userName"
+                    filterable
+                    placeholder="请选择"
+                    value-key="id"
+                  >
+                    <el-option
+                      v-for="item in allUsers"
+                      :key="item.id"
+                      :label="item.userName"
+                      :value="item.userName"
+                    />
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+
+            <el-form-item label="归档编号" prop="archiveNumber">
+              <el-input v-model="formLabelAlign.archiveNumber" />
+            </el-form-item>
+            <el-form-item label="工作令号" prop="workOrderNumber">
+              <el-input v-model="formLabelAlign.workOrderNumber" />
             </el-form-item>
-            <el-form-item label="Activity form">
-              <el-input v-model="formLabelAlign.type" />
+            <el-form-item label="追踪卡号" prop="trackingNumber">
+              <el-input v-model="formLabelAlign.trackingNumber" />
+            </el-form-item>
+            <el-form-item label="特征和程度" prop="remark">
+              <el-input
+                v-model="formLabelAlign.remark"
+                :rows="3"
+                type="textarea"
+              />
             </el-form-item>
           </el-form>
         </div>
@@ -47,24 +167,90 @@
 </template>
 
 <script lang="ts" setup>
+import {
+  addBreakReport,
+  breakReportInfoById,
+  operationListByIds,
+} from "@/api/process/reportBreak";
+import { useProcessStore } from "@/store/modules/processView";
+import { useDictionaryStore } from "@/store/modules/dictionary";
+import { getUserList } from "@/api/auth";
+
+const processStore = useProcessStore();
+const dictStroe = useDictionaryStore();
+
 const drawerVisible = ref(false);
 
+const infoData = ref<any>({});
+
+const formRef = ref<InstanceType<typeof ElForm>>();
 const formLabelAlign = reactive({
-  name: "",
-  region: "",
-  type: "",
+  seqNo: [],
+  reason: [],
+  processes: [],
+  firstInspection: 0,
+  personResponsible: "",
+  userName: "",
+  archiveNumber: "",
+  workOrderNumber: "",
+  trackingNumber: "",
+  remark: "",
+});
+const rules = reactive({
+  trackingNumber: [
+    { required: true, message: "请输入 追踪卡号", trigger: "blur" },
+  ],
+  workOrderNumber: [
+    { required: true, message: "请输入 工作令号", trigger: "blur" },
+  ],
+  archiveNumber: [
+    { required: true, message: "请输入 归档编号", trigger: "blur" },
+  ],
+  escalationItemList: [{ required: true, message: "请选择 ", trigger: "blur" }],
 });
 
+// 获取所有用户列表
+const allUsers = ref<any[]>([]);
+
 const openReportBreakDrawer = () => {
   drawerVisible.value = true;
+  breakReportInfoById(processStore.scanInfo.id).then((res) => {
+    infoData.value = res.data;
+  });
+  getUserList().then((res) => {
+    allUsers.value = res.data || [];
+  });
 };
 
+// 报故数量，选择工序号相关. 选择之后获取工序列表
+const operationList = ref<any[]>([]);
+const selectProcessWorkSeqChange = useDebounceFn(() => {
+  operationListByIds(formLabelAlign.escalationItemList).then((res) => {
+    operationList.value = res.data;
+  });
+}, 2000);
+
 const cancelClick = () => {
   drawerVisible.value = false;
 };
 
 const confirmClick = () => {
-  drawerVisible.value = false;
+  // drawerVisible.value = false;
+  formRef.value &&
+    formRef.value.validate((valid: boolean) => {
+      if (valid) {
+        let params = {
+          processId: processStore.scanInfo.id,
+          ...formLabelAlign,
+        };
+        addBreakReport(params).then(() => {
+          ElMessage.success("报故成功");
+          drawerVisible.value = false;
+        });
+      } else {
+        return false;
+      }
+    });
 };
 
 defineExpose({
@@ -73,14 +259,15 @@ defineExpose({
 </script>
 
 <style lang="scss" scoped>
-//#drawContent {
-//  :deep(.el-form--large.el-form--label-top .el-form-item .el-form-item__label) {
-//    font-weight: 500;
-//    font-size: 22px;
-//    color: rgba(0, 0, 0, 0.9);
-//    text-align: left;
-//  }
-//}
+#drawContent {
+  width: 100%;
+  //:deep(.el-form--large.el-form--label-top .el-form-item .el-form-item__label) {
+  //  font-weight: 500;
+  //  font-size: 22px;
+  //  color: rgba(0, 0, 0, 0.9);
+  //  text-align: left;
+  //}
+}
 
 .base-info {
   height: 351px;