dev

src/components/common/Header.vue

@@ -46,12 +46,6 @@
     width: 140px;
     height: 50px;
     position: relative;
-
-    span {
-      display: inline-block;
-      height: 50px;
-    }
-
     &::before {
       content: '';
       display: inline-block;

src/views/LayoutSetting.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="layout-container">
     <Header class="header"/>
-
     <header>
       <div class="center-wrapper">
         <div class="childMenu">
@@ -11,8 +10,6 @@
         </div>
       </div>
     </header>
-
-
     <div class="space"></div>
     <main class="layout-main">
       <router-view/>

src/views/inventory/inventory.vue

@@ -1,27 +1,100 @@
 <template>
   <div class="container-wrapper">
     <div class="top">
-      <el-dropdown>
+      <div class="search">
-        <el-button type="primary" :icon="Plus" @click="openAdd">新增采购</el-button>
+        <div class="left">
-      </el-dropdown>
+          <el-form :inline="true" :model="searchModel">
+            <el-form-item >
+              <el-date-picker
+                  v-model="searchModel.purchaseDate"
+                  type="date"
+                  placeholder="采购日期"
+                  style="width: 200px;height: 42px"
+              >
+              </el-date-picker>
+            </el-form-item>
+            <el-form-item>
+              <el-input
+                  v-model="searchModel.code"
+                  placeholder="单号"
+                  style="width: 200px;height: 42px"
+                  :prefix-icon="Search"
+              >
+              </el-input>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                  v-model="searchModel.cateId"
+                  placeholder="供应商"
+                  style="width: 200px;height: 42px"
+                  multiple
+                  clearable
+                  collapse-tags
+              >
+                <el-option
+                    v-for="item in 10"
+                    :key="item"
+                    :label="item"
+                    :value="item"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item>
+              <el-select
+                  v-model="searchModel.cateId"
+                  placeholder="采购人"
+                  style="width: 200px;height: 42px"
+                  multiple
+                  clearable
+                  collapse-tags
+              >
+                <el-option
+                    v-for="item in 10"
+                    :key="item"
+                    :label="item"
+                    :value="item"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="right">
+          <div class="btn" @click="resetSearch">
+            <el-icon style="margin-right: 10px">
+              <Refresh/>
+            </el-icon>
+            重置
+          </div>
+          <div class="btn" @click="init">
+            <el-icon style="margin-right: 10px">
+              <Search/>
+            </el-icon>
+            搜索
+          </div>
+        </div>
+      </div>
+      <div class="addBtn">
+        <span @click="openAdd">新增采购</span>
+      </div>
     </div>
     <div class="content_list">
       <el-scrollbar>
-        <el-table :data="tableData" style="width: 100%" @row-click="open_edit">
+        <el-table :data="tableData" style="width: 100%" @row-click="open_edit" :header-cell-style="{ backgroundColor: '#F1F5FB' }">
-          <el-table-column fixed label="进货单号" width="250" show-overflow-tooltip>
+          <el-table-column fixed label="进货单号" show-overflow-tooltip>
             <template #default="scope">
               <div class="link">{{ scope.row.code }}</div>
             </template>
           </el-table-column>
-          <el-table-column label="品种" prop="kindCount" width="100">
+          <el-table-column label="品种" prop="kindCount">
-
           </el-table-column>
-          <el-table-column label="入库金额" width="100">
+          <el-table-column label="入库金额">
             <template #default="scope">
               ￥{{ scope.row.totalPrice.toFixed(2) }}
             </template>
           </el-table-column>
-          <el-table-column label="采购人" prop="managerUserName" width="100"></el-table-column>
+          <el-table-column label="采购人" prop="managerUserName"></el-table-column>
           <el-table-column label="供应商" prop="supplierName"></el-table-column>
           <el-table-column prop="purchaseDate" label="采购时间">
             <template #default="scope">
@@ -60,7 +133,7 @@ import {useRoute} from "vue-router";
 import AddOrder from "@/components/inventory/purchase/AddOrder.vue";
 import Mask from "@/components/common/Mask.vue";
 import EditOrder from "@/components/inventory/purchase/EditOrder.vue";
-import {Plus} from "@element-plus/icons-vue";
+import {Plus, Refresh, Search, SemiSelect} from "@element-plus/icons-vue";
 
 let tableData = ref([])
 let is_edit = ref(false)
@@ -88,7 +161,7 @@ let init = () => {
     page: page.value,
     pageSize: 20,
   }
-  post("inventory/order/list", {query: query}).then((res: any) => {
+  post("inventory/order/list", {query: query,...searchModel.value}).then((res: any) => {
     tableData.value = res.list
     total.value = res.total_count
   })
@@ -115,6 +188,25 @@ const formatDate = (isoStr: any) => {
   const date = new Date(isoStr);
   return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
 }
+const searchModel = ref({
+  purchaseDate:"",
+  code: "",
+  cateId: [],
+  minInterestRate: "",
+  maxInterestRate: "",
+  curProfitCate: []
+})
+const resetSearch = () => {
+  searchModel.value = {
+    purchaseDate:"",
+    code: "",
+    cateId: [],
+    minInterestRate: "",
+    maxInterestRate: "",
+    curProfitCate: []
+  }
+  init()
+}
 </script>
 <style scoped lang="scss">
 @use "@/assets/scss/base.scss";
@@ -202,4 +294,70 @@ const formatDate = (isoStr: any) => {
   }
 
 }
+.top {
+  height: 110px;
+  background: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .search {
+    display: flex;
+    justify-content: space-between;
+    .left {
+      flex: 1;
+      display: flex;
+      justify-content: space-between;
+      margin-right: 24px;
+      .el-form-item {
+        margin-right: 5px;
+      }
+    }
+    .right {
+      display: flex;
+      .btn {
+        width: 120px;
+        height: 42px;
+        background: #FFFFFF;
+        border-radius: 6px;
+        border: 1px solid #979797;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin-left: 24px;
+        cursor: pointer;
+        &:hover {
+          background: #4D6DE4;
+          color: #fff;
+          border: none;
+        }
+      }
+    }
+
+  }
+
+  .addBtn {
+    span {
+      display: inline-block;
+      width: 120px;
+      height: 42px;
+      background: #FFFFFF;
+      border-radius: 6px;
+      border: 1px solid #4D6DE4;
+      margin-right: 24px;
+      font-weight: 500;
+      font-size: 16px;
+      color: #4D6DE4;
+      text-align: center;
+      line-height: 42px;
+      &:hover {
+        background: #4D6DE4;
+        color: #fff;
+        border: none;
+      }
+    }
+  }
+}
+:deep(.el-select__wrapper) {
+  height: 42px;
+}
 </style>