update: 供应商排行客户排行

2024-03-15 16:18:37 +08:00 · 2024-03-15 16:18:37 +08:00 · 6a26907192
parent 8e3dd63aa2
commit 6a26907192
7 changed files with 263 additions and 95 deletions
--- a/src/PagesStatistics/components/ProductTypeDialog.vue
+++ b/src/PagesStatistics/components/ProductTypeDialog.vue
@ -1,36 +1,85 @@
 <template>
-  <u-popup :show="show" mode="bottom" :round="10" :closeable="true" @close="handleClose" :zIndex="999999999999999999">
+  <u-popup
+    :show="show"
+    mode="bottom"
+    :round="10"
+    :closeable="true"
+    @close="handleClose"
+    :zIndex="999999999999999999"
+  >
    <view class="c-dialog-filter">
-      <view class="title">收货产品</view>
-      <view class="dialog-product-layout">
-        <text v-for="item in 20" :class="{ active: item === 2 }" :key="item"
-          >钢板料{{ item }}</text
+      <view class="title">{{ isShipment ? "出货" : "收货" }}产品</view>
+      <view class="dialog-product-layout" v-if="!isShipment">
+        <text
+          v-for="item in state.list"
+          :class="{ active: state.currentId === item.id }"
+          :key="item.id"
+          @click="handleSelect(item.id)"
+          >{{ item.reProductsName }}</text
        >
      </view>
-      <view class="btn-confirm">
+      <view v-if="isShipment">
+        <block v-for="(item, index) in state.list" :key="index">
+          <view style="font-size: 26rpx">{{ item.shmCategoryName }}</view>
+          <view class="dialog-product-layout">
+            <text
+              v-for="cItem in item.childrenList"
+              :class="{ active: state.currentId === item.id }"
+              :key="cItem.id"
+              @click="handleSelect(cItem.id)"
+              >{{ cItem.shmCategoryName }}</text
+            >
+          </view>
+        </block>
+      </view>
+      <!-- <view class="btn-confirm">
        <view class="btn">
          <u-button type="primary" :text="'确认'"></u-button>
        </view>
-      </view>
+      </view> -->
    </view>
  </u-popup>
 </template>
 <script setup lang="ts">
-import { ReceiveProductApi } from '@/services';
+import { GoodsApi, ReceiveProductApi } from "@/services";

 const props = defineProps<{
-  show: boolean,
-}>()
-const emit = defineEmits(['handleDialog']);
+  show: boolean;
+  isShipment: boolean;
+}>();
+const emit = defineEmits(["handleDialog", "changeProduct"]);
 const handleClose = () => {
-  emit('handleDialog', false)
-}
+  emit("handleDialog", false);
+};

-ReceiveProductApi.getAllReProducts().then(res => {
-  if (res.code === 200) {
-    
+const state = reactive<any>({
+  list: [],
+  currentId: -1
+});
+
+const handleSelect = (id: number) => {
+  state.currentId = id
+  emit("changeProduct", {productId: id})
+  emit("handleDialog", false);
+}
+const getList = () => {
+  if (props.isShipment) {
+    GoodsApi.getShipmentCategory().then((res) => {
+      if (res.code === 200) {
+        state.list = res.data;
+      }
+    });
+  } else {
+    GoodsApi.getReceiveProductList().then((res) => {
+      if (res.code === 200) {
+        state.list = res.data;
+      }
+    });
  }
-})
+};
+onMounted(() => {
+  getList();
+});
 </script>
 <style lang="scss" scoped>
 .c-dialog-filter {
@ -44,53 +93,51 @@ ReceiveProductApi.getAllReProducts().then(res => {
    text-align: center;
  }
 }
- // 产品dialog
-  .dialog-product-layout {
-    box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
-    border-radius: 13rpx;
-    margin: 42rpx 25rpx;
-    padding: 19rpx;
-    display: flex;
-    justify-content: flex-start;
-    align-items: center;
-    flex-flow: row wrap;
-    max-height: 70vh;
-    overflow: auto;
+// 产品dialog
+.dialog-product-layout {
+  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
+  border-radius: 13rpx;
+  margin: 42rpx 25rpx;
+  padding: 19rpx;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  flex-flow: row wrap;
+  max-height: 70vh;
+  overflow: auto;

-    text {
-      font-weight: 400;
-      font-size: 24rpx;
-      color: #999999;
-      background: #ffffff;
-      border-radius: 6rpx;
-      border: 1px solid rgba(153, 153, 153, 0.64);
-      text-align: center;
-      cursor: pointer;
-      padding: 10rpx 20rpx;
-      margin-bottom: 20rpx;
-      margin-left: 10rpx;
-      margin-right: 10rpx;
-    }
-    .active {
-      border-color: $u-primary;
-      color: $u-primary;
+  text {
+    font-weight: 400;
+    font-size: 24rpx;
+    color: #999999;
+    background: #ffffff;
+    border-radius: 6rpx;
+    border: 1px solid rgba(153, 153, 153, 0.64);
+    text-align: center;
+    cursor: pointer;
+    padding: 10rpx 20rpx;
+    margin-bottom: 20rpx;
+    margin-left: 10rpx;
+    margin-right: 10rpx;
+  }
+  .active {
+    border-color: $u-primary;
+    color: $u-primary;
+  }
+}
+
+.btn-confirm {
+  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
+  border-radius: 13rpx 13rpx 0rpx 0rpx;
+  width: 100%;
+  left: 0rpx;
+  padding: 27.56rpx;
+  .btn {
+    text-align: center;
+    ::v-deep button {
+      width: 80%;
+      border-radius: 43rpx;
    }
  }
-
-  .btn-confirm {
-    box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
-    border-radius: 13rpx 13rpx 0rpx 0rpx;
-    position: absolute;
-    bottom: 0rpx;
-    width: 100%;
-    left: 0rpx;
-    padding: 27.56rpx;
-    .btn {
-      text-align: center;
-      ::v-deep button {
-        width: 80%;
-        border-radius: 43rpx;
-      }
-    }
-  }
-</style>
+}
+</style>
--- a/src/PagesStatistics/customerRanking.vue
+++ b/src/PagesStatistics/customerRanking.vue
@ -15,7 +15,7 @@
        placeholder="请选择结束时间"
      ></u-input>
      <u-icon
-        name="arrow-down-fill"
+        name="arrow-down"
        @click="handleDialog('showTime', true)"
      ></u-icon>

@ -25,14 +25,29 @@
    </view>
  </view>

-  <c-echarts :option="option" :height="'90vh'" />
-    <!-- 单据弹框 -->
-    <ProductTypeDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
+  <!-- <c-echarts :option="option" :height="'90vh'" /> -->
+  <!-- 单据弹框 -->
+  <ProductTypeDialog
+    :isShipment="true"
+    :show="showDialog.showFilter"
+    @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"
+    @changeProduct="changeProduct"
+  />
+
+  <!-- 时间弹框 -->
+  <TimeDialog
+    ref="timeDialog"
+    :show="showDialog.showTime"
+    @handleDialog="(v:boolean) => {handleDialog('showTime', v)}"
+    @changeTime="changeTime"
+  />
 </template>
 <script setup lang="ts">
-
+import TimeDialog from "./components/TimeDialog.vue";
 import CEcharts from "@/components/Echarts/echarts.vue";
-import ProductTypeDialog from './components/ProductTypeDialog.vue'
+import ProductTypeDialog from "./components/ProductTypeDialog.vue";
+import { formatDate, getCurrentMonthStartAndEnd } from "@/utils";
+import { ShipmentApi } from "@/services";
 const option = ref({
  tooltip: {
    trigger: "axis",
@ -93,9 +108,54 @@ const showDialog = <
  showTime: false,
  showFilter: false,
 });
+const state = reactive<{
+  startTime: string;
+  endTime: string;
+  scaleStatus: number;
+  userId: number;
+  productId: number;
+}>({
+  startTime: formatDate(getCurrentMonthStartAndEnd().start, "{y}-{m}-{d}"),
+  endTime: formatDate(getCurrentMonthStartAndEnd().end, "{y}-{m}-{d}"),
+  scaleStatus: -1,
+  userId: -1,
+  productId: -1,
+});
+
+const changeTime = (obj: any) => {
+  state.startTime = obj.startTime;
+  state.endTime = obj.endTime;
+  getList();
+};
+const changeProduct = (obj: any) => {
+  state.productId = obj.productId;
+  getList();
+};
 const handleDialog = (key: string, v: boolean) => {
  showDialog[key] = v;
 };
+const getList = () => {
+  let params: any = {
+    startTime: state.startTime + " 00:00:00",
+    endTime: state.endTime + " 23:59:59",
+  };
+  if (state.scaleStatus > -1) {
+    params.scaleStatus = state.scaleStatus;
+  }
+  if (state.userId > -1) {
+    params.userId = state.userId;
+  }
+  if (state.productId > -1) {
+    params.productId = state.productId;
+  }
+  ShipmentApi.getOrderInRanking(params).then((res) => {
+    if (res.code === 200) {
+    }
+  });
+};
+onMounted(() => {
+  getList();
+});
 </script>
 <style lang="scss" scoped>
 .layout-box {
@ -106,14 +166,14 @@ const handleDialog = (key: string, v: boolean) => {
    justify-items: center;
    font-family: Source Han Sans CN;
    font-weight: 500;
-    font-size: 27rpx;
+    font-size: 28rpx;
    color: #000000;
    ::v-deep .u-input {
      padding: 0rpx 16.03rpx !important;
      input {
        font-family: Source Han Sans CN;
        font-weight: 400;
-        font-size: 21rpx !important;
+        font-size: 24rpx !important;
        color: #000000;
      }
    }
--- a/src/PagesStatistics/receivePanel.vue
+++ b/src/PagesStatistics/receivePanel.vue
@ -128,6 +128,7 @@
    :show="showDialog.showFilter"
    @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"
    @changeOther="changeOther"
+    :isShipment="false"
  />
 </template>
 <script setup lang="ts">
--- a/src/PagesStatistics/supplierRanking.vue
+++ b/src/PagesStatistics/supplierRanking.vue
@ -2,20 +2,20 @@
  <view class="layout-box">
    <view class="filter">
      <u-input
-        v-model="params.startTime"
+        v-model="state.startTime"
        disabled
        disabledColor="#ffffff"
        placeholder="请选择开始时间"
      ></u-input>
      <text>-</text>
      <u-input
-        v-model="params.endTime"
+        v-model="state.endTime"
        disabled
        disabledColor="#ffffff"
        placeholder="请选择结束时间"
      ></u-input>
      <u-icon
-        name="arrow-down-fill"
+        name="arrow-down"
        @click="handleDialog('showTime', true)"
      ></u-icon>

@ -25,14 +25,33 @@
    </view>
  </view>

-  <c-echarts :option="option" :height="'90vh'" />
-    <!-- 单据弹框 -->
-    <ProductTypeDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
+  <!-- <view>
+    <c-echarts :option="option" :height="'90vh'" />
+  </view> -->
+
+  <!-- 时间弹框 -->
+  <TimeDialog
+    ref="timeDialog"
+    :show="showDialog.showTime"
+    @handleDialog="(v:boolean) => {handleDialog('showTime', v)}"
+    @changeTime="changeTime"
+  />
+  <!-- 单据弹框 -->
+  <view>
+    <ProductTypeDialog
+      :show="showDialog.showFilter"
+      @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"
+      :isShipment="false"
+      @changeProduct="changeProduct"
+    />
+  </view>
 </template>
 <script setup lang="ts">
-
+import TimeDialog from "./components/TimeDialog.vue";
 import CEcharts from "@/components/Echarts/echarts.vue";
-import ProductTypeDialog from './components/ProductTypeDialog.vue'
+import ProductTypeDialog from "./components/ProductTypeDialog.vue";
+import { ReceiveApi } from "@/services";
+import { formatDate, getCurrentMonthStartAndEnd } from "@/utils";
 const option = ref({
  tooltip: {
    trigger: "axis",
@ -80,11 +99,10 @@ const option = ref({
  ],
  color: ["#00D2E3"],
 });
-
-const params = reactive({
-  startTime: "2024-01-01",
-  endTime: "2024-01-01",
-});
+const changeProduct = (obj: any) => {
+  state.productId = obj.productId;
+  getList();
+};
 const showDialog = <
  {
    [key: string]: boolean;
@ -96,6 +114,48 @@ const showDialog = <
 const handleDialog = (key: string, v: boolean) => {
  showDialog[key] = v;
 };
+const state = reactive<{
+  startTime: string;
+  endTime: string;
+  scaleStatus: number;
+  userId: number;
+  productId: number;
+}>({
+  startTime: formatDate(getCurrentMonthStartAndEnd().start, "{y}-{m}-{d}"),
+  endTime: formatDate(getCurrentMonthStartAndEnd().end, "{y}-{m}-{d}"),
+  scaleStatus: -1,
+  userId: -1,
+  productId: -1,
+});
+
+const changeTime = (obj: any) => {
+  state.startTime = obj.startTime;
+  state.endTime = obj.endTime;
+  getList();
+};
+
+const getList = () => {
+  let params: any = {
+    startTime: state.startTime + " 00:00:00",
+    endTime: state.endTime + " 23:59:59",
+  };
+  if (state.scaleStatus > -1) {
+    params.scaleStatus = state.scaleStatus;
+  }
+  if (state.userId > -1) {
+    params.userId = state.userId;
+  }
+  if (state.productId > -1) {
+    params.productId = state.productId;
+  }
+  ReceiveApi.OrderInRanking(params).then((res) => {
+    if (res.code === 200) {
+    }
+  });
+};
+onMounted(() => {
+  getList();
+});
 </script>
 <style lang="scss" scoped>
 .layout-box {
@ -106,14 +166,14 @@ const handleDialog = (key: string, v: boolean) => {
    justify-items: center;
    font-family: Source Han Sans CN;
    font-weight: 500;
-    font-size: 27rpx;
+    font-size: 28rpx;
    color: #000000;
    ::v-deep .u-input {
      padding: 0rpx 16.03rpx !important;
      input {
        font-family: Source Han Sans CN;
        font-weight: 400;
-        font-size: 21rpx !important;
+        font-size: 24rpx !important;
        color: #000000;
      }
    }
--- a/src/services/goods.ts
+++ b/src/services/goods.ts
@ -91,11 +91,10 @@ export const getReceiveProductListByPage = (data: any) => {
 }

 // 收货产品查询所有
-export const getReceiveProductList = (data: any) => {
+export const getReceiveProductList = () => {
  return http({
    method: 'GET',
    url: '/api/reproducts/allReProducts',
-    data,
  })
 }

@ -109,11 +108,10 @@ export const addShmCategory = (data: any) => {
 }

 // 出货分类树显示
-export const getShipmentCategory = (data: any) => {
+export const getShipmentCategory = () => {
  return http({
    method: 'GET',
    url: '/api/shmcategory/getChinaList',
-    data,
  })
 }

--- a/src/services/receive.ts
+++ b/src/services/receive.ts
@ -91,10 +91,11 @@ export const OrderInReceipt = (data:any) => {
 };

 // 收货单排行榜
-export const OrderInRanking = () => {
+export const OrderInRanking = (data: any) => {
  return http({
    method: "GET",
-    url: "/api/orderIn/OrderInRanking"
+    url: "/api/orderIn/OrderInRanking",
+    data
  });
 };

--- a/src/services/shipment.ts
+++ b/src/services/shipment.ts
@ -63,10 +63,11 @@ export const getOrderInReceipt = (data: any) => {
  });
 };
 // 出货单排行榜
-export const getOrderInRanking = () => {
+export const getOrderInRanking = (data:any) => {
  return http<Shipment>({
    method: "GET",
-    url: "/api/orderOut/OrderInRanking"
+    url: "/api/orderOut/OrderInRanking",
+    data
  });
 };
 // 单个或则批量作废