update: 统计中 收货 出货相关接口对接
This commit is contained in:
parent
1dc643ca8a
commit
5add2a7e6b
|
@ -4,7 +4,7 @@
|
|||
<view class="title">筛选</view>
|
||||
<u-list height="200">
|
||||
<u-list-item>
|
||||
<u-cell :title="`${isShipment ? '客户' : '供应商'}`" @click="handleDialog('showSupplier', true)">
|
||||
<u-cell :title="`${isShipment ? '客户' : '供应商'}`" @click="handleDialog('showSupplier', true)" :value="state.user.name">
|
||||
<template #right-icon> </template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
|
@ -12,20 +12,27 @@
|
|||
<u-cell
|
||||
:title="`${isShipment ? '出货产品' : '收货产品'}`"
|
||||
@click="handleDialog('showProduct', true)"
|
||||
:value="state.project.name"
|
||||
>
|
||||
<template #right-icon> </template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
<view class="btn-layout">
|
||||
<view class="btn">
|
||||
<up-button type="primary" text="确定" @click="handleOk()"></up-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn-layout">
|
||||
<view class="btn">
|
||||
<u-button>重置</u-button>
|
||||
</view>
|
||||
|
||||
<view class="btn-box1">
|
||||
<u-button
|
||||
text="重置"
|
||||
color="#E8E8E8"
|
||||
:customStyle="{ color: '#999' }"
|
||||
shape="circle"
|
||||
@click="resetState"
|
||||
></u-button>
|
||||
<u-button
|
||||
type="primary"
|
||||
text="确定"
|
||||
shape="circle"
|
||||
@click="handleOk()"
|
||||
></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
@ -35,6 +42,7 @@
|
|||
:show="showDialog.showSupplier"
|
||||
@handleDialog="(v:boolean) => {handleDialog('showSupplier', v)}"
|
||||
@changeUser="changeUser"
|
||||
:isShipment="isShipment"
|
||||
></SupplierDialog>
|
||||
<!-- 收货产品弹框 -->
|
||||
<ProductDialog
|
||||
|
@ -72,10 +80,11 @@ const state = <
|
|||
>reactive({
|
||||
project: {
|
||||
id: -1,
|
||||
reProductsName: ''
|
||||
name: ''
|
||||
},
|
||||
user: {
|
||||
id: -1
|
||||
id: -1,
|
||||
name: ''
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -86,9 +95,18 @@ const changeUser = (obj:any) => {
|
|||
state.user = obj
|
||||
}
|
||||
const changeProduct = (obj:any) => {
|
||||
state.project = obj
|
||||
state.project = {...obj, name: obj.reProductsName}
|
||||
}
|
||||
const resetState = () => {
|
||||
state.project = {
|
||||
id: -1,
|
||||
name: ''
|
||||
}
|
||||
state.user = {
|
||||
id: -1,
|
||||
name: ''
|
||||
}
|
||||
}
|
||||
|
||||
const handleOk = () => {
|
||||
emit("changeOther",{userId: state.user.id, productId: state.project.id})
|
||||
emit("handleDialog", false);
|
||||
|
@ -112,17 +130,13 @@ const handleOk = () => {
|
|||
font-size: 27rpx !important;
|
||||
}
|
||||
}
|
||||
.btn-layout {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.btn-box1 {
|
||||
flex-direction: row;
|
||||
display: flex;
|
||||
margin-top: 35rpx;
|
||||
.btn {
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
align-items: center;
|
||||
margin-top: 30rpx;
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -49,6 +49,7 @@ const props = defineProps<{
|
|||
}>();
|
||||
const emit = defineEmits(["handleDialog", "changeProduct"]);
|
||||
const handleClose = () => {
|
||||
debugger
|
||||
emit("handleDialog", false);
|
||||
};
|
||||
|
||||
|
@ -84,8 +85,7 @@ onMounted(() => {
|
|||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
width: 95vw;
|
||||
padding: 25rpx;
|
||||
z-index: 9999999999;
|
||||
margin: 25rpx;
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
|
|
|
@ -1,9 +1,13 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="left" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog-filter">
|
||||
<view class="title">供应商筛选</view>
|
||||
<view class="title">{{isShipment? '客户' : '供应商'}}筛选</view>
|
||||
<view class="search">
|
||||
<u-search placeholder=" 请输入供应商名称 / 卡号搜索" v-model="keyword"></u-search>
|
||||
<u-search
|
||||
:placeholder="`请输入${isShipment? '客户' : '供应商'}名称 / 卡号搜索`"
|
||||
v-model="keyword"
|
||||
@search="handleSearch()"
|
||||
></u-search>
|
||||
</view>
|
||||
<view class="dialog-product-layout">
|
||||
<!-- 自定义索引列表 -->
|
||||
|
@ -19,12 +23,12 @@
|
|||
class="address-book"
|
||||
v-for="(item, index) in addressBook"
|
||||
:key="index"
|
||||
:id="item.id"
|
||||
:id="item.name"
|
||||
>
|
||||
<view class="address-book-index">{{ item.id }}</view>
|
||||
<view class="address-book-index">{{ item.name }}</view>
|
||||
<view
|
||||
class="contact-container"
|
||||
v-for="(cItem, index) in item.data"
|
||||
v-for="(cItem, index) in item.list"
|
||||
:key="index"
|
||||
>
|
||||
<!-- <img
|
||||
|
@ -32,9 +36,12 @@
|
|||
src="http://www.lixia.gov.cn/picture/0/s_97b76c734a6f40f8abba95615cbff1e1.jpg"
|
||||
alt=""
|
||||
/> -->
|
||||
<view class="contact-detail-container">
|
||||
<view class="contact-name">{{ cItem.zh_title }}</view>
|
||||
<view class="contact-address">{{ cItem.address }}</view>
|
||||
<view
|
||||
class="contact-detail-container"
|
||||
@click="handleClick(cItem)"
|
||||
>
|
||||
<view class="contact-name">{{ cItem.name }}</view>
|
||||
<view class="contact-address">{{ cItem.cardCode }}</view>
|
||||
<!-- <view class="contact-phone">{{ item.phone }}</view> -->
|
||||
</view>
|
||||
</view>
|
||||
|
@ -58,15 +65,18 @@
|
|||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { CustomerApi, SupplierApi } from "@/services";
|
||||
|
||||
const props = defineProps<{
|
||||
show: boolean;
|
||||
isShipment: boolean;
|
||||
}>();
|
||||
const emit = defineEmits(["handleDialog"]);
|
||||
const emit = defineEmits(["handleDialog", "changeUser"]);
|
||||
const handleClose = () => {
|
||||
emit("handleDialog", false);
|
||||
};
|
||||
|
||||
const keyword = ref()
|
||||
const keyword = ref("");
|
||||
|
||||
const indexList = [
|
||||
"A",
|
||||
|
@ -95,113 +105,75 @@ const indexList = [
|
|||
"X",
|
||||
"Y",
|
||||
"Z",
|
||||
"#",
|
||||
];
|
||||
const toView = ref("");
|
||||
const addressBook = [
|
||||
{
|
||||
id: "A",
|
||||
data: [
|
||||
{
|
||||
zh_title: "阿联酋迪拉姆",
|
||||
en_title: "aa",
|
||||
address: "910289591",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "阿尔巴尼亚列克",
|
||||
en_title: "aaaaa",
|
||||
address: "ALL",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "B",
|
||||
data: [
|
||||
{
|
||||
zh_title: "孟加拉国塔卡",
|
||||
en_title: "bbb",
|
||||
address: "BDT",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "保加利亚列瓦",
|
||||
en_title: "bbb",
|
||||
address: "BGN",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "C",
|
||||
data: [
|
||||
{
|
||||
zh_title: "加拿大元",
|
||||
en_title: "ccc",
|
||||
address: "CAD",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "瑞士法郎",
|
||||
en_title: "ccc",
|
||||
address: "CHF",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "D",
|
||||
data: [
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "Z",
|
||||
data: [
|
||||
{ zh_title: "z", en_title: "zz", address: "zzz", phone: "111111" },
|
||||
{ zh_title: "zzz", en_title: "ddd", address: "ddd", phone: "222222" },
|
||||
],
|
||||
},
|
||||
];
|
||||
const addressBook = ref();
|
||||
// [
|
||||
// {
|
||||
// id: "A",
|
||||
// data: [
|
||||
// {
|
||||
// zh_title: "阿联酋迪拉姆",
|
||||
// en_title: "aa",
|
||||
// address: "910289591",
|
||||
// phone: "111111",
|
||||
// },
|
||||
// {
|
||||
// zh_title: "阿尔巴尼亚列克",
|
||||
// en_title: "aaaaa",
|
||||
// address: "ALL",
|
||||
// phone: "222222",
|
||||
// },
|
||||
// ],
|
||||
// }
|
||||
// ];
|
||||
|
||||
const toSelectIndex = (item: any) => {
|
||||
toView.value = item;
|
||||
};
|
||||
|
||||
const handleClick = (item: any) => {
|
||||
emit("changeUser", item);
|
||||
emit("handleDialog", false);
|
||||
};
|
||||
|
||||
const handleSearch = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
const getList = () => {
|
||||
if (props.isShipment) {
|
||||
CustomerApi.getCustomUserListLettera({ name: keyword.value }).then(
|
||||
(res: any) => {
|
||||
if (res.code === 200) {
|
||||
addressBook.value = res.data.reduce((pre: any, curr: any) => {
|
||||
if (curr.list.length > 0) {
|
||||
pre.push(curr);
|
||||
}
|
||||
return pre;
|
||||
}, []);
|
||||
}
|
||||
}
|
||||
);
|
||||
} else {
|
||||
SupplierApi.getSupplierUserListLettera({ name: keyword.value }).then(
|
||||
(res: any) => {
|
||||
if (res.code === 200) {
|
||||
addressBook.value = res.data.reduce((pre: any, curr: any) => {
|
||||
if (curr.list.length > 0) {
|
||||
pre.push(curr);
|
||||
}
|
||||
return pre;
|
||||
}, []);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
};
|
||||
onMounted(() => {
|
||||
getList();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
|
|
|
@ -2,14 +2,14 @@
|
|||
<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="请选择结束时间"
|
||||
|
@ -25,7 +25,17 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <c-echarts :option="option" :height="'90vh'" /> -->
|
||||
<c-echarts
|
||||
v-if="state.x.length > 0"
|
||||
:option="getOptions(state.x, state.y)"
|
||||
:height="'90vh'"
|
||||
/>
|
||||
<u-empty
|
||||
v-else
|
||||
mode="data"
|
||||
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
||||
>
|
||||
</u-empty>
|
||||
<!-- 单据弹框 -->
|
||||
<ProductTypeDialog
|
||||
:isShipment="true"
|
||||
|
@ -48,7 +58,9 @@ import CEcharts from "@/components/Echarts/echarts.vue";
|
|||
import ProductTypeDialog from "./components/ProductTypeDialog.vue";
|
||||
import { formatDate, getCurrentMonthStartAndEnd } from "@/utils";
|
||||
import { ShipmentApi } from "@/services";
|
||||
const option = ref({
|
||||
import _ from "underscore";
|
||||
const getOptions = (x: Array<any>, y: Array<any>) => {
|
||||
return {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
|
@ -68,7 +80,7 @@ const option = ref({
|
|||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
data: [1, 2, 3, 4, 5],
|
||||
data: y,
|
||||
axisLabel: {
|
||||
// inside: true,
|
||||
// color: '#fff'
|
||||
|
@ -85,7 +97,7 @@ const option = ref({
|
|||
},
|
||||
series: [
|
||||
{
|
||||
data: [100, 110, 113, 126, 143, 158, 165, 167, 152, 102, ,],
|
||||
data: x,
|
||||
type: "bar",
|
||||
areaStyle: {
|
||||
show: true,
|
||||
|
@ -94,12 +106,8 @@ const option = ref({
|
|||
},
|
||||
],
|
||||
color: ["#00D2E3"],
|
||||
});
|
||||
|
||||
const params = reactive({
|
||||
startTime: "2024-01-01",
|
||||
endTime: "2024-01-01",
|
||||
});
|
||||
};
|
||||
};
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean;
|
||||
|
@ -114,12 +122,16 @@ const state = reactive<{
|
|||
scaleStatus: number;
|
||||
userId: number;
|
||||
productId: number;
|
||||
x: Array<any>;
|
||||
y: Array<any>;
|
||||
}>({
|
||||
startTime: formatDate(getCurrentMonthStartAndEnd().start, "{y}-{m}-{d}"),
|
||||
endTime: formatDate(getCurrentMonthStartAndEnd().end, "{y}-{m}-{d}"),
|
||||
scaleStatus: -1,
|
||||
userId: -1,
|
||||
productId: -1,
|
||||
x: [],
|
||||
y: [],
|
||||
});
|
||||
|
||||
const changeTime = (obj: any) => {
|
||||
|
@ -150,6 +162,8 @@ const getList = () => {
|
|||
}
|
||||
ShipmentApi.getOrderInRanking(params).then((res) => {
|
||||
if (res.code === 200) {
|
||||
state.y = _.pluck(res.data, "userName");
|
||||
state.x = _.pluck(res.data, "totalAmount");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
|
|
@ -267,7 +267,7 @@ onMounted(() => {
|
|||
}
|
||||
}
|
||||
.box {
|
||||
padding: 19.23rpx;
|
||||
padding: 28rpx 20rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
align-items: center;
|
||||
|
@ -290,7 +290,7 @@ onMounted(() => {
|
|||
border-left: 1px solid #e9e9e9;
|
||||
.num {
|
||||
font-weight: bold;
|
||||
font-size: 27rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
::v-deep .uni-table {
|
||||
|
|
|
@ -268,7 +268,7 @@ onMounted(() => {
|
|||
}
|
||||
}
|
||||
.box {
|
||||
padding: 19.23rpx;
|
||||
padding: 28rpx 20rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
align-items: center;
|
||||
|
|
|
@ -25,9 +25,11 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view>
|
||||
<c-echarts :option="option" :height="'90vh'" />
|
||||
</view> -->
|
||||
<view v-if="state.x.length > 0">
|
||||
<c-echarts :option="getOptions(state.x, state.y)" :height="'90vh'" />
|
||||
</view>
|
||||
<u-empty v-else mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png">
|
||||
</u-empty>
|
||||
|
||||
<!-- 时间弹框 -->
|
||||
<TimeDialog
|
||||
|
@ -48,11 +50,13 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import TimeDialog from "./components/TimeDialog.vue";
|
||||
import CEcharts from "@/components/Echarts/echarts.vue";
|
||||
import CEcharts from "../components/Echarts/echarts.vue";
|
||||
import ProductTypeDialog from "./components/ProductTypeDialog.vue";
|
||||
import { ReceiveApi } from "@/services";
|
||||
import { formatDate, getCurrentMonthStartAndEnd } from "@/utils";
|
||||
const option = ref({
|
||||
import _ from "underscore";
|
||||
const getOptions = (x: Array<any>, y: Array<any>) => {
|
||||
return {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
|
@ -72,7 +76,7 @@ const option = ref({
|
|||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
data: [1, 2, 3, 4, 5],
|
||||
data: y,
|
||||
axisLabel: {
|
||||
// inside: true,
|
||||
// color: '#fff'
|
||||
|
@ -89,7 +93,7 @@ const option = ref({
|
|||
},
|
||||
series: [
|
||||
{
|
||||
data: [100, 110, 113, 126, 143, 158, 165, 167, 152, 102, ,],
|
||||
data: x,
|
||||
type: "bar",
|
||||
areaStyle: {
|
||||
show: true,
|
||||
|
@ -98,7 +102,8 @@ const option = ref({
|
|||
},
|
||||
],
|
||||
color: ["#00D2E3"],
|
||||
});
|
||||
};
|
||||
};
|
||||
const changeProduct = (obj: any) => {
|
||||
state.productId = obj.productId;
|
||||
getList();
|
||||
|
@ -120,12 +125,16 @@ const state = reactive<{
|
|||
scaleStatus: number;
|
||||
userId: number;
|
||||
productId: number;
|
||||
x: Array<any>;
|
||||
y: Array<any>;
|
||||
}>({
|
||||
startTime: formatDate(getCurrentMonthStartAndEnd().start, "{y}-{m}-{d}"),
|
||||
endTime: formatDate(getCurrentMonthStartAndEnd().end, "{y}-{m}-{d}"),
|
||||
scaleStatus: -1,
|
||||
userId: -1,
|
||||
productId: -1,
|
||||
x: [],
|
||||
y: [],
|
||||
});
|
||||
|
||||
const changeTime = (obj: any) => {
|
||||
|
@ -148,8 +157,10 @@ const getList = () => {
|
|||
if (state.productId > -1) {
|
||||
params.productId = state.productId;
|
||||
}
|
||||
ReceiveApi.OrderInRanking(params).then((res) => {
|
||||
ReceiveApi.OrderInRanking(params).then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
state.y = _.pluck(res.data, "userName");
|
||||
state.x = _.pluck(res.data, "totalAmount");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
|
|
@ -1,5 +1,10 @@
|
|||
<template>
|
||||
<LEchart class="echart" ref="chart" @finished="init" :customStyle="{height: height, 'z-index': 1}"></LEchart>
|
||||
<LEchart
|
||||
class="echart"
|
||||
ref="chart"
|
||||
@finished="init"
|
||||
:customStyle="{ height: height, 'z-index': 1 }"
|
||||
></LEchart>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import LEchart from "../../uni_modules/lime-echart/components/l-echart/l-echart.vue";
|
||||
|
@ -15,19 +20,28 @@ const echarts = require("../../uni_modules/lime-echart/static/echarts.min");
|
|||
import * as echarts from "echarts";
|
||||
// #endif
|
||||
// #endif
|
||||
let chart = ref(); // 获取dom
|
||||
let chart = ref<any>(); // 获取dom
|
||||
|
||||
const props = defineProps<{
|
||||
option: object,
|
||||
height: string
|
||||
}>()
|
||||
option: object;
|
||||
height: string;
|
||||
}>();
|
||||
|
||||
watchEffect(() => {
|
||||
if (chart.value) {
|
||||
chart.value.init(echarts, (chart: any) => {
|
||||
chart.setOption(props.option);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.option,
|
||||
(newValue, oldValue) => {
|
||||
chart.value.setOption(props.option);
|
||||
}
|
||||
);
|
||||
|
||||
// 渲染完成
|
||||
const init = () => {
|
||||
console.log("渲染完成");
|
||||
|
|
|
@ -35,4 +35,15 @@ export const getCustomUserList = (data: any) => {
|
|||
})
|
||||
}
|
||||
|
||||
// 客户字母分组
|
||||
export const getCustomUserListLettera = (data: any) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/api/custom/user/getCustomUserListLettera',
|
||||
data,
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -70,3 +70,11 @@ export const getSupplierUserList = (data: any) => {
|
|||
})
|
||||
}
|
||||
|
||||
export const getSupplierUserListLettera = (data: any) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/api/supplier/user/getSupplierUserListLettera',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue