fix:产品交接新增查询条件

src/views/quality/handover/index.vue

@@ -1,60 +1,127 @@
 <template>
   <div class="mainContentBox">
     <avue-crud
-        ref="crudRef"
-        v-model:search="search"
-        v-model="form"
-        :data="data"
-        :option="option"
-        v-model:page="page"
-        @row-save="createRowSave"
-        @row-update="updateRow"
-        @row-del="deleteRow"
-        :table-loading="loading"
-        @search-change="searchChange"
-        @search-reset="resetChange"
-        @size-change="dataList"
-        @current-change="dataList"
-        @selection-change="selectionChange"
+      ref="crudRef"
+      v-model:search="search"
+      v-model="form"
+      :data="data"
+      :option="option"
+      v-model:page="page"
+      @row-save="createRowSave"
+      @row-update="updateRow"
+      @row-del="deleteRow"
+      :table-loading="loading"
+      @search-change="searchChange"
+      @search-reset="resetChange"
+      @size-change="dataList"
+      @current-change="dataList"
+      @selection-change="selectionChange"
     >
       <template #menu="{ size, row, index }">
-<!--        <el-button
-            icon="el-icon-edit"
-            text
-            @click="openDialog(1, row.id)"
-            type="primary"
-            :size="size"
-        >编辑</el-button
-        >-->
+        <!--        <el-button
+                    icon="el-icon-edit"
+                    text
+                    @click="openDialog(1, row.id)"
+                    type="primary"
+                    :size="size"
+                >编辑</el-button
+                >-->
 
         <el-button
-            icon="el-icon-view"
-            text
-            @click="openDialog(0, row)"
-            type="primary"
-            :size="size"
-        >详情</el-button
+          icon="el-icon-view"
+          text
+          @click="openDialog(0, row)"
+          type="primary"
+          :size="size"
+        >详情
+        </el-button
         >
       </template>
     </avue-crud>
     <el-dialog
-        v-model="dialog.visible"
-        :title="dialog.title"
-        width="1650px"
-        @close="dialog.visible = false"
+      v-model="dialog.visible"
+      :title="dialog.title"
+      width="90%"
+      @close="dialog.visible = false"
     >
 
-<!--      <el-button
-          class="ml-3"
-          style="margin-bottom: 5px;"
-          @click="handleExport"
+      <!--      <el-button
+                class="ml-3"
+                style="margin-bottom: 5px;"
+                @click="handleExport"
+            >
+              <template #icon> <i-ep-download /> </template>导出
+            </el-button>-->
+      <el-form
+        class="header-box"
+        label-width="80px"
+        size="midium"
+        v-model="searchForm"
+        ref="searchFormRef"
       >
-        <template #icon> <i-ep-download /> </template>导出
-      </el-button>-->
+        <el-form
+          class="header-box"
+          label-width="80px"
+          size="midium"
+          v-model="searchForm"
+          ref="searchFormRef"
+        >
+          <el-row>
+            <el-col :span="5">
+              <el-form-item label="物料型号" prop="materialModel">
+                <el-input
+                  v-model="searchForm.materialModel"
+                  placeholder="请输入物料型号"
+                  clearable
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="5">
+              <el-form-item label="产品批号" prop="workOrderCode">
+                <el-input
+                  v-model="searchForm.workOrderCode"
+                  placeholder="请输入产品批号"
+                  clearable
+                />
+              </el-form-item>
+            </el-col>
+            <el-col :span="5">
+              <el-form-item label="开始日期" prop="startDate">
+                <el-date-picker
+                  v-model="searchForm.startDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="开始日期"
+                  clearable
+                ></el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-col :span="5" style="margin-left: -55px">
+              <el-form-item label="结束日期" prop="endDate">
+                <el-date-picker
+                  v-model="searchForm.endDate"
+                  type="date"
+                  value-format="YYYY-MM-DD"
+                  placeholder="结束日期"
+                  clearable
+                ></el-date-picker>
+              </el-form-item>
+            </el-col>
+            <el-button type="primary" icon="el-icon-search" @click="handleSearch">
+              搜索
+            </el-button>
+            <el-button type="default" icon="el-icon-delete" @click="handleReset">
+              清空
+            </el-button>
+          </el-row>
+        </el-form>
+
+      </el-form>
+
       <el-table :data="itemList" border style="width: 100%" span-method="objectSpanMethod">
-        <el-table-column show-overflow-tooltip  prop="operationName" label="工序" width="100"/>
-        <el-table-column show-overflow-tooltip  prop="materialModel" label="物料型号" width="100"/>
-        <el-table-column show-overflow-tooltip  prop="workOrderCode" label="产品批号" width="120"/>
+        <el-table-column show-overflow-tooltip prop="operationName" label="工序" width="100"/>
+        <el-table-column show-overflow-tooltip prop="materialModel" label="物料型号" width="100"/>
+        <el-table-column show-overflow-tooltip prop="workOrderCode" label="产品批号" width="120"/>
         <el-table-column prop="reNum" label="数量(接收)" width="70">
           <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.reNum"></el-input>
@@ -66,77 +133,77 @@
           </template>
         </el-table-column>
         <el-table-column prop="reReceiveUser" label="接收人(接收)" width="140">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.reReceiveUser"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="reDate" label="时间(接收)" width="120">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-date-picker value-format="YYYY-MM-DD" type="date" v-model="scope.row.reDate"></el-date-picker>
           </template>
         </el-table-column>
         <el-table-column prop="next0Num" label="数量(下传合格)" width="80">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next0Num"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="next0FrontUser" label="下传人(下传合格)" width="140">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next0FrontUser"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="next0ReceiveUser" label="接收人(下传合格)" width="140">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next0ReceiveUser"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="next0Date" label="时间(下传合格)" width="120">
-          <template v-if="dialog.type === 1"  #default="scope">
-            <el-date-picker  value-format="YYYY-MM-DD" type="date" v-model="scope.row.next0Date"/>
+          <template v-if="dialog.type === 1" #default="scope">
+            <el-date-picker value-format="YYYY-MM-DD" type="date" v-model="scope.row.next0Date"/>
           </template>
         </el-table-column>
         <el-table-column prop="next1Num" label="数量(下传不合格)" width="80">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next1Num"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="next1FrontUser" label="下传人(下传不合格)" width="140">
-          <template v-if="dialog.type === 1"  #default="scope">
-            <el-date-picker  value-format="YYYY-MM-DD" type="date" v-model="scope.row.next1FrontUser"/>
+          <template v-if="dialog.type === 1" #default="scope">
+            <el-date-picker value-format="YYYY-MM-DD" type="date" v-model="scope.row.next1FrontUser"/>
           </template>
         </el-table-column>
         <el-table-column prop="next1ReceiveUser" label="接收人(下传不合格)" width="140">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next1ReceiveUser"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="next1Date" label="时间(下传不合格)" width="100">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.next1Date"></el-input>
           </template>
         </el-table-column>
         <el-table-column prop="remark" label="备注" width="100">
-          <template v-if="dialog.type === 1"  #default="scope">
+          <template v-if="dialog.type === 1" #default="scope">
             <el-input v-model="scope.row.remark"></el-input>
           </template>
         </el-table-column>
-<!--        <el-table-column prop="remark" label="关联表单" width="120">
-          <template  #default="scope">
-            <el-button
-                icon="el-icon-setting"
-                text
-                @click="formList(scope.row)"
-                type="primary"
-                size="small"
-            >表单列表</el-button>
-          </template>
-        </el-table-column>-->
+        <!--        <el-table-column prop="remark" label="关联表单" width="120">
+                  <template  #default="scope">
+                    <el-button
+                        icon="el-icon-setting"
+                        text
+                        @click="formList(scope.row)"
+                        type="primary"
+                        size="small"
+                    >表单列表</el-button>
+                  </template>
+                </el-table-column>-->
       </el-table>
 
       <div
-          class="dialog-footer"
-          style="margin-top: 10px;"
-          align="center"
+        class="dialog-footer"
+        style="margin-top: 10px;"
+        align="center"
       >
         <el-button @click="dialog.visible = false">取 消</el-button>
         <el-button type="primary" @click="handleExport" v-if="itemList.value !== 0">导 出</el-button>
@@ -144,53 +211,56 @@
     </el-dialog>
 
     <el-dialog
-        v-model="dialog8.visible"
-        :title="dialog8.title"
-        width="950px"
-        @close="dialog8.visible = false"
+      v-model="dialog8.visible"
+      :title="dialog8.title"
+      width="950px"
+      @close="dialog8.visible = false"
     >
       <el-card
-          style="cursor: pointer; font-size: 20px"
-          shadow="always"
-          :key="index"
-          @click="toShowExcel(item)"
-          v-for="(item, index) in showProList"
-      >{{ item.formName }}-{{item.formCode}}({{item.seqs}})</el-card
+        style="cursor: pointer; font-size: 20px"
+        shadow="always"
+        :key="index"
+        @click="toShowExcel(item)"
+        v-for="(item, index) in showProList"
+      >{{ item.formName }}-{{ item.formCode }}({{ item.seqs }})
+      </el-card
       >
     </el-dialog>
     <el-dialog
-        v-model="excelShow"
-        title="详情"
-        @close="excelShow = false"
-        width="1600"
-        destroy-on-close
+      v-model="excelShow"
+      title="详情"
+      @close="excelShow = false"
+      width="1600"
+      destroy-on-close
     >
-      <ExcelDataBbox :data="ExDataObj" @close="excelShow = false" />
+      <ExcelDataBbox :data="ExDataObj" @close="excelShow = false"/>
     </el-dialog>
   </div>
 </template>
 <script setup>
-import { ref, getCurrentInstance } from "vue";
-import { useCrud } from "@/hooks/userCrud";
-import { exportOperationRecord ,queryFormList,queryProductHandover,updateHandoverList} from "@/api/process";
-import { useCommonStoreHook } from "@/store";
+import {ref, getCurrentInstance} from "vue";
+import {useCrud} from "@/hooks/userCrud";
+import {exportOperationRecord, queryFormList, queryProductHandover, updateHandoverList} from "@/api/process";
+import {useCommonStoreHook} from "@/store";
 import dictDataUtil from "@/common/configs/dictDataUtil";
-const { isShowTable, tableType } = toRefs(useCommonStoreHook());
+
+const {isShowTable, tableType} = toRefs(useCommonStoreHook());
 import ExcelDataBbox from "@/views/base/apply/excelDataBbox.vue";
+
 const test = () => {
   isShowTable.value = true;
   tableType.value = tableType.value == 1 ? 2 : 1;
 };
 const radio = ref(0);
 // 传入一个url，后面不带/
-const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
-    useCrud({
-      dataListUrl: "/api/v1/proRecord/queryCompleteOpList",
-    });
-const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
-    Methords; //增删改查
-const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
-const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
+const {form, data, option, search, page, toDeleteIds, Methords, Utils} =
+  useCrud({
+    dataListUrl: "/api/v1/proRecord/queryCompleteOpList",
+  });
+const {dataList, createRow, updateRow, deleteRow, searchChange, resetChange} =
+  Methords; //增删改查
+const {selectionChange, multipleDelete} = Methords; //选中和批量删除事件
+const {checkBtnPerm, downloadTemplate, exportData} = Utils; //按钮权限等工具
 const loading = ref(false);
 const times = ref(null)
 const crudRef = ref(null); //crudRef.value 获取avue-crud对象
@@ -203,22 +273,16 @@ const dialog0 = reactive({
   title: "完工工序",
   visible: false,
 });
-const createRowSave = (row,done,loading) =>{
-  if(!row.startDate || !row.endDate){
+const createRowSave = (row, done, loading) => {
+  if (!row.startDate || !row.endDate) {
     ElMessage.error("请选择日期");
     loading()
-  }else{
+  } else {
     done();
     times.value = row;
     dialog0.visible = true
   }
 
-
-
-
-
-
-
   /*form.value.type = "0"
   addProRecord(form.value).then((data) =>{
     ElMessage.success(data.msg);
@@ -233,10 +297,30 @@ const createRowSave = (row,done,loading) =>{
     loading()
   });*/
 }
+
+const searchForm = ref();
+
+const handleSearch = () => {
+  queryProductHandover(searchForm.value).then((data) => {
+    itemList.value = data.data;
+  });
+};
+const handleReset = () => {
+  // 重置表单
+  Object.assign(searchForm.value, {
+    materialModel: "",
+    workOrderCode: "",
+    startDate: "",
+    endDate: "",
+  });
+};
 const clickOperationType = ref(null)
 const itemList = ref([])
 const openDialog = (type, row) => {
   clickOperationType.value = row.operationType
+  searchForm.value = {
+    ...row,
+  };
   queryProductHandover(row).then((data) => {
     itemList.value = data.data;
     dialog.visible = true;
@@ -249,11 +333,11 @@ const dialog8 = reactive({
 });
 const showProList = ref([]);
 const formList = (row) => {
-  queryFormList({...search.value,workOrderId: row.workOrderId,operationId: row.operationId}).then((data)=>{
-    if(data.data.length > 0){
+  queryFormList({...search.value, workOrderId: row.workOrderId, operationId: row.operationId}).then((data) => {
+    if (data.data.length > 0) {
       showProList.value = data.data;
       dialog8.visible = true;
-    }else{
+    } else {
       ElMessage.error("未关联到表单");
     }
   })
@@ -327,13 +411,13 @@ const toShowExcel = (item) => {
   excelShow.value = true;
 };
 const handleExport = () => {
-  if(data.value.length !== 0){
-    exportOperationRecord({...search.value,operationType: clickOperationType.value,type: 0}).then((response) => {
+  if (data.value.length !== 0) {
+    exportOperationRecord({...search.value, operationType: clickOperationType.value, type: 0}).then((response) => {
       try {
         const decoder = new TextDecoder("utf-8");
         const jsonString = decoder.decode(response.data);
         const jsonObject = JSON.parse(jsonString);
-        const { code, msg } = jsonObject;
+        const {code, msg} = jsonObject;
         if (code != "200") {
           ElMessage.error(msg);
         }
@@ -341,18 +425,18 @@ const handleExport = () => {
         downFile(response);
       }
     })
-  }else{
+  } else {
     ElMessage.error("请先搜索数据");
   }
 };
 const downFile = (response) => {
   const fileData = response.data;
   const fileName = decodeURI(
-      response.headers["content-disposition"].split(";")[1].split("=")[1]
+    response.headers["content-disposition"].split(";")[1].split("=")[1]
   );
   const fileType =
-      "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8";
-  const blob = new Blob([fileData], { type: fileType });
+    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8";
+  const blob = new Blob([fileData], {type: fileType});
   const downloadUrl = window.URL.createObjectURL(blob);
   const downloadLink = document.createElement("a");
   downloadLink.href = downloadUrl;