refactor(finance): 财务分析_查询表单

src/api/bi/finance.js

@@ -2,14 +2,13 @@ import request from '@/utils/request'
 
 /**
  * 获取财务列表
- * @param {*} params
+ * @param {*} data
  * @returns 
  */
-export const getFinanceListAPI = (params) => {
+export const getFinanceListAPI = (data) => {
   return request({
     url: '/bi/finance/cost/list',
-    params: {
-      type: params.aggregation
-    }
+    method: 'POST',
+    data
   })
 }
\ No newline at end of file

src/views/bi/finance/index.vue

@@ -3,6 +3,8 @@
     <div class="container">
       <!-- 搜索表单 -->
       <el-form :model="queryParams"
+        label-position="right"
+        label-width="68px"
         inline>
         <el-form-item label="直播间">
           <el-select v-model="queryParams.brand"
@@ -56,7 +58,7 @@
             </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="商品名称">
+        <el-form-item label="商品">
           <el-select v-model="queryParams.brand"
             multiple
             clearable
@@ -69,18 +71,16 @@
             </el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="料号">
-          <el-select v-model="queryParams.brand"
-            multiple
-            clearable
-            collapse-tags
-            collapse-tags-tooltip
-            @change="getList">
-            <el-option v-for="str in brandList"
-              :label="str"
-              :value="str">
-            </el-option>
-          </el-select>
+        <el-form-item label="日期选择">
+          <el-date-picker v-model="queryParams.date"
+            type="daterange"
+            :clearable="false"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            :shortcuts="pickerOptions"
+            @change="queryChangeFn('date')">
+          </el-date-picker>
         </el-form-item>
       </el-form>
       <!-- 数据 -->
@@ -124,13 +124,25 @@ const aggregationList = ref(['料号', '规格', '口味', '直播间类型']) /
 const brandList = ref([]) // 直播间列表
 const columns = ref([
   {
-    label: '查询条件',
+    label: '直播间',
+    prop: 'queryType'
+  },
+  {
+    label: '口味',
+    prop: 'queryType'
+  },
+  {
+    label: '规格',
+    prop: 'queryType'
+  },
+  {
+    label: '系列',
+    prop: 'queryType'
+  },
+  {
+    label: '商品',
     prop: 'queryType'
   },
-  // {
-  //   label: '商品名称',
-  //   prop: 'goodsName'
-  // },
   {
     label: '分摊后总价',
     prop: 'shareAmountSum'
@@ -142,14 +154,22 @@ const columns = ref([
   {
     label: '标准成本',
     prop: 'standardCostSum'
+  },
+  {
+    label: '实际成本毛利',
+    prop: 'standardCostSum'
+  },
+  {
+    label: '标准成本毛利',
+    prop: 'standardCostSum'
   }
 ])
 const tableData = ref([
 ])
 const data = reactive({
   queryParams: {
-    aggregation: '料号', // 聚合条件
-    brand: '' // 直播间
+    // aggregation: '料号', // 聚合条件
+    // brand: '' // 直播间
   },
   detailTableData: [],
   detailColumns: [
@@ -249,6 +269,11 @@ getList()
 </script>
 
 <style scoped
-  lang="scsss">
-
+  lang="scss">
+  ::v-deep(.el-form-item) {
+    width: 250px;
+    &:last-of-type{
+      width: 350px;
+    }
+  }
 </style>
\ No newline at end of file