搜索

src/views/DeliveryWarehouse/LibraryManagement/compontents/Crkxx.vue

@@ -1,8 +1,10 @@
 <script lang="ts" setup>
 import {LibraryManagementApi} from "@/api/DeliveryWarehouse/LibraryManagement";
 import FileForm from "@/views/DeliveryWarehouse/LibraryManagement/compontents/FileForm.vue"
-import CreatCrkxxForm from "@/views/DeliveryWarehouse/LibraryManagement/compontents/CreatCrkxxForm.vue"
+import CreatCrkxxForm
+  from "@/views/DeliveryWarehouse/LibraryManagement/compontents/CreatCrkxxForm.vue"
 import {DICT_TYPE} from "@/utils/dict";
+
 const queryParams = ref({
   pageNo: 1,
   pageSize: 10,
@@ -17,7 +19,11 @@ const handleQuery = async () => {
   loading.value = true
   await nextTick();
   try {
-    const data = await LibraryManagementApi.getCrkxxPage({id: row.value.id, ...queryParams.value})
+    const data = await LibraryManagementApi.getCrkxxPage({
+      id: row.value.id,
+      cfId: row.value.id,
+      ...queryParams.value
+    })
     list.value = data.list;
     total.value = data.total;
   } catch (err) {
@@ -48,7 +54,7 @@ const updateCrkxx = async (row: any) => {
 const parseStr = (str: any) => {
   return '/'
   if (str.fileIds) {
-    console.log(JSON.parse(JSON.stringify(str.fileIds)).split(',').length , 'length')
+    console.log(JSON.parse(JSON.stringify(str.fileIds)).split(',').length, 'length')
     return JSON.parse(JSON.stringify(str.fileIds)).split(',').length
   } else {
     return ''
@@ -71,7 +77,7 @@ onMounted(async () => {
       <el-row>
         <el-col :span="22">
           <el-form-item label="出入库类型" prop="crklx">
-            <el-select @change="handleQuery" v-model="queryParams.crklx" class="w-200px!">
+            <el-select v-model="queryParams.crklx" class="w-200px!" @change="handleQuery">
               <el-option :value="0" label="出库"/>
               <el-option :value="1" label="入库"/>
             </el-select>
@@ -101,7 +107,7 @@ onMounted(async () => {
       <el-table-column align="center" label="业务时间" min-width="100" prop="rmsj">
         <template #default="scope">
           <div v-if="queryParams.crklx ==0 ">{{ scope.row.cmsj }}</div>
-          <div v-if="queryParams.crklx ==1 ">{{scope.row.rmsj}}</div>
+          <div v-if="queryParams.crklx ==1 ">{{ scope.row.rmsj }}</div>
         </template>
       </el-table-column>
       <el-table-column align="center" label="粮食品种" min-width="100" prop="lspzmc">
@@ -118,9 +124,9 @@ onMounted(async () => {
       <el-table-column align="center" label="净重（公斤）" min-width="180" prop="jz"/>
       <el-table-column align="center" label="车船号" min-width="180" prop="cch"/>
       <el-table-column align="center" label="出入库类型" min-width="120" prop="crklx">
-         <template #default="scope">
+        <template #default="scope">
           <div
-         >{{ scope.row.crklx === 0 ? '出库' : '入库' }}
+          >{{ scope.row.crklx === 0 ? '出库' : '入库' }}
           </div>
         </template>
       </el-table-column>
@@ -150,8 +156,8 @@ onMounted(async () => {
       :total="total"
       @pagination="handleQuery"
     />
-    <CreatCrkxxForm ref="creatCrkxxFormRef" @success="handleQuery" />
-    <FileForm  ref="fileFormRef" @success="handleQuery" />
+    <CreatCrkxxForm ref="creatCrkxxFormRef" @success="handleQuery"/>
+    <FileForm ref="fileFormRef" @success="handleQuery"/>
   </div>
 
 </template>

src/views/DeliveryWarehouse/compontents/Form.vue

@@ -10,6 +10,28 @@
         :row-selection="rowSelection"
         row-key="id"
       >
+        <template #kqmc-filter="{ filterValue, setFilterValue, handleFilterConfirm, handleFilterReset}">
+          <div class="custom-filter">
+            <a-space direction="vertical">
+              <a-input :model-value="filterValue[0]" @input="(value)=>setFilterValue([value])" />
+              <div class="custom-filter-footer">
+                <a-button type="primary"  @click="handleFilterConfirm">搜索</a-button>
+                <a-button @click="handleFilterReset">取消</a-button>
+              </div>
+            </a-space>
+          </div>
+        </template>
+        <template #cfmc-filter="{ filterValue, setFilterValue, handleFilterConfirm, handleFilterReset}">
+          <div class="custom-filter">
+            <a-space direction="vertical">
+              <a-input :model-value="filterValue[0]" @input="(value)=>setFilterValue([value])" />
+              <div class="custom-filter-footer">
+                <a-button type="primary"  @click="handleFilterConfirm">搜索</a-button>
+                <a-button @click="handleFilterReset">取消</a-button>
+              </div>
+            </a-space>
+          </div>
+        </template>
         <template #cflx="{record }">
           <dict-tag :type="DICT_TYPE.SYSTEM_CFLX" :value="record.cflx"/>
         </template>
@@ -39,6 +61,7 @@ import {DeliveryWarehouseSelectApi} from '@/api/DeliveryWarehouse/DeliveryWareho
 import {DICT_TYPE} from '@/utils/dict'
 import {TableColumnData, TableRowSelection} from "@arco-design/web-vue";
 import {YxcfEnum} from "@/enum/yxcfEnum";
+import {IconSearch} from "@arco-design/web-vue/es/icon";
 
 // 接口定义
 interface QueryParams {
@@ -94,12 +117,22 @@ const tableColumns = ref<TableColumnData[]>([
   {
     title: '库区名称',
     dataIndex: 'kqmc',
-    align: 'center'
+    align: 'center',
+    filterable: {
+      filter: (value, record) => record.kqmc.includes(value),
+      slotName: 'kqmc-filter',
+      icon: () => h(IconSearch)
+    }
   },
   {
     title: '仓房名称',
     dataIndex: 'cfmc',
-    align: 'center'
+    align: 'center',
+    filterable: {
+      filter: (value, record) => record.cfmc.includes(value),
+      slotName: 'cfmc-filter',
+      icon: () => h(IconSearch)
+    }
   },
   {
     title: '仓房类型',
@@ -123,12 +156,22 @@ const tableColumnsTemp: TableColumnData[] = [
   {
     title: '库区名称',
     dataIndex: 'kqmc',
-    align: 'center'
+    align: 'center',
+    filterable: {
+      filter: (value, record) => record.kqmc.includes(value),
+      slotName: 'kqmc-filter',
+      icon: () => h(IconSearch)
+    }
   },
   {
     title: '仓房名称',
     dataIndex: 'cfmc',
-    align: 'center'
+    align: 'center',
+    filterable: {
+      filter: (value, record) => record.cfmc.includes(value),
+      slotName: 'cfmc-filter',
+      icon: () => h(IconSearch)
+    }
   },
   {
     title: '仓房类型',
@@ -332,4 +375,16 @@ const emit = defineEmits(['success'])
   border-right: 1px solid var(--color-neutral-3);
   background: var(--color-fill-2);
 }
+.custom-filter {
+  padding: 20px;
+  background: var(--color-bg-5);
+  border: 1px solid var(--color-neutral-3);
+  border-radius: var(--border-radius-medium);
+  box-shadow: 0 2px 5px rgb(0 0 0 / 10%);
+}
+
+.custom-filter-footer {
+  display: flex;
+  justify-content: space-between;
+}
 </style>