java_project
/
logpm_page
4
1
Fork 0
Code Issues Pull Requests Activity
Browse Source

关闭顶部搜索，优化数据看板

dev
qb 4 months ago
parent
64637f8234
commit
64f08e6fb3
7 changed files with 326 additions and 128 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      src/css/common.css
  2. 2
      src/page/index/index.vue
  3. 14
      src/page/index/top/index.vue
  4. 6
      src/page/index/top/top-search.vue
  5. 39
      src/page/login/aiqa.vue
  6. 11
      src/styles/top.scss
  7. 376
      src/views/desk/DataBoard.vue

6
src/css/common.css
Unescape View File

@ -74,7 +74,7 @@ a {
.avue-view {
width: 100%;
box-sizing: border-box;
box-sizing: border-box;
}
.avue-footer {
@ -208,8 +208,8 @@ a {
.top-search {
line-height: 50px;
position: absolute !important;
right: 200px;
/* position: absolute !important; */
/* right: 200px; */
top: 0;
width: 300px;
}

2
src/page/index/index.vue
Unescape View File

@ -206,7 +206,7 @@ export default {
#avue-view {
position: relative;
}
.el-popup-parent--hidden{
.el-popup-parent--hidden {
width: 100% !important;
}
</style>

14
src/page/index/top/index.vue
Unescape View File

@ -11,9 +11,9 @@
</div>
<div class="top-bar__title">
<top-menu ref="topMenu" v-if="setting.menu"></top-menu>
<top-search class="top-bar__item" v-if="setting.search"></top-search>
</div>
<div class="top-bar__right">
<!-- <top-search class="top-bar__item" v-if="setting.search"></top-search> -->
<div v-if="setting.lock" class="top-bar__item">
<top-lock></top-lock>
</div>
@ -137,23 +137,21 @@ export default {
filters: {},
created() {
getMyCurrentWarehouse().then(res => {
if (res.data.data == null) {
console.log('当前没有数据');
localStorage.setItem('WarehouseName', void 0);
localStorage.setItem('my_data', JSON.stringify(''))
localStorage.setItem('my_data', JSON.stringify(''));
return;
}
localStorage.setItem('WarehouseName', res.data.data.name);
localStorage.setItem('my_data', JSON.stringify(res.data.data))
if(!res.data.data.name){
localStorage.setItem('my_data', JSON.stringify(res.data.data));
if (!res.data.data.name) {
this.dataName = '';
}else{
this.dataName = res.data.data.name;//仓库名字
} else {
this.dataName = res.data.data.name; //仓库名字
}
});
},
computed: {
...mapGetters([

6
src/page/index/top/top-search.vue
Unescape View File

@ -117,10 +117,10 @@ export default {
}
}
}
.el-autocomplete{
.el-autocomplete {
width: 300px !important;
margin-right:7% !important;
.el-input__wrapper{
// margin-right:7% !important;
.el-input__wrapper {
border: 1px solid #d3d3d3 !important;
}
}

39
src/page/login/aiqa.vue
Unescape View File

@ -66,6 +66,8 @@
@keydown.enter="inputData(Data.input)"
v-model="Data.input"
placeholder="请输入问题描述"
type="textarea"
style="height: 100%; resize: none"
/>
<el-button type="primary" @click="inputData(Data.input)">发送</el-button>
</div>
@ -106,7 +108,7 @@ const isFirstMessage = ref(true);
const chatContainer = ref(null);
const inputState = ref(false); //当前是否在回答
const props = defineProps({
templateData:Boolean,
templateData: Boolean,
});
const input = ref(null); //输入框实例
const Data = ref({
@ -146,8 +148,7 @@ const Data = ref({
},
{
content: '向日葵下载地址',
}
},
],
ChathistoryList: [
// {
@ -316,11 +317,9 @@ const AiData = (value = '') => {
lowercaseValue.includes('东集pad安装初始密码')
) {
aiResponse = '东集PDA安装初始密码是：4007770876';
}
else if (
lowercaseValue.includes('东集pad-q7恢复出厂设置')
) {
aiResponse = '东集pad-q7恢复出厂设置教程地址:1、关机状态下，按下【电源键】、【两侧扫描键】； 2、出现开机画面，松开【电源键】，出现工厂模式界面，按键全部松开；3、进入工厂模式后通过方向键选择【wipe data/factory reset】, 按电源键确认进入子菜单，选择【yes】，按【电源键】确认，恢复出厂完成后选择第一个【reboot system now】 ，按【电源键】确认重启设备。视频教程如下:https://mp.weixin.qq.com/s/0CG-jYooh9LJ-9aLauVGfA';
} else if (lowercaseValue.includes('东集pad-q7恢复出厂设置')) {
aiResponse =
'东集pad-q7恢复出厂设置教程地址:1、关机状态下，按下【电源键】、【两侧扫描键】； 2、出现开机画面，松开【电源键】，出现工厂模式界面，按键全部松开；3、进入工厂模式后通过方向键选择【wipe data/factory reset】, 按电源键确认进入子菜单，选择【yes】，按【电源键】确认，恢复出厂完成后选择第一个【reboot system now】 ，按【电源键】确认重启设备。视频教程如下:https://mp.weixin.qq.com/s/0CG-jYooh9LJ-9aLauVGfA';
}
// else if (
// lowercaseValue.includes('货无忧的汇通物流公司编码是多少')
@ -328,17 +327,15 @@ const AiData = (value = '') => {
// aiResponse = '货无忧的汇通物流公司编码是：627683';
// }
else if (
lowercaseValue.includes('蓝牙打印机芝柯tx453设备连接密码是多少') || lowercaseValue.includes('tx453')
lowercaseValue.includes('蓝牙打印机芝柯tx453设备连接密码是多少') ||
lowercaseValue.includes('tx453')
) {
aiResponse = '蓝牙打印机芝柯xt453设备连接密码是：0000';
}
else if (
lowercaseValue.includes('向日葵') || lowercaseValue.includes('向日葵下载地址')
) {
} else if (lowercaseValue.includes('向日葵') || lowercaseValue.includes('向日葵下载地址')) {
aiResponse = '向日葵下载地址：https://sunlogin.oray.com/,使用教程点击下方立即下载';
data.link = 'http://files.huo5u.com/plugins/%E5%90%91%E6%97%A5%E8%91%B5%E8%BF%9C%E7%A8%8B%E8%BD%AF%E4%BB%B6%E4%BD%BF%E7%94%A8%E6%95%99%E7%A8%8B.docx';
}
else {
data.link =
'http://files.huo5u.com/plugins/%E5%90%91%E6%97%A5%E8%91%B5%E8%BF%9C%E7%A8%8B%E8%BD%AF%E4%BB%B6%E4%BD%BF%E7%94%A8%E6%95%99%E7%A8%8B.docx';
} else {
aiResponse = '我不太理解您的问题，我正在努力学习中，请重新描述或输入其他问题，或联系管理员';
}
}
@ -500,10 +497,11 @@ AiData(); //初始化AI机器人
flex: 1;
background-color: #fff;
border: 1px solid #9e9e9e;
padding: 0 4px;
padding: 0px 10px;
border-radius: 4px;
p {
font-size: 13px;
margin: 10px 0;
// text-indent: 24px;
}
}
@ -537,6 +535,13 @@ AiData(); //初始化AI机器人
height: 100%;
font-size: 16px;
}
.el-textarea__inner {
height: 100%;
box-shadow: none;
resize: none;
}
.is-focus {
box-shadow: none;
}

11
src/styles/top.scss
Unescape View File

@ -2,7 +2,7 @@
position: relative;
background-color: #fff;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.15);
color: rgba(0, 0, 0, .65);
color: rgba(0, 0, 0, 0.65);
font-size: 28px;
height: $top_height;
line-height: $top_height;
@ -10,13 +10,14 @@
white-space: nowrap;
.el-menu-item {
i, span {
i,
span {
font-size: 13px;
// background-color: #d3832a;
}
}
}
.el-menu-item>.is-active{
.el-menu-item > .is-active {
background-color: #d3832a !important;
}
.avue-breadcrumb {
@ -46,8 +47,8 @@
.top-search {
line-height: $top_height;
position: absolute !important;
right: 200px;
// position: absolute !important;
// right: 200px;
top: 0;
width: 300px;

376
src/views/desk/DataBoard.vue
Unescape View File

@ -520,7 +520,7 @@
<img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
<span>总数</span>
</div>
<!-- <div
<div
class="mt10"
@click="
() =>
@ -534,12 +534,12 @@
details.allocationDataInfo.totalNum || 0
}}</span>
<span class="">个</span>
</div> -->
</div>
<div class="mt10">
<!-- <div class="mt10">
<span class="data mr5px">{{ details.allocationDataInfo.totalNum || 0 }}</span>
<span class="">个</span>
</div>
</div> -->
</div>
<!-- 已上架 -->
@ -831,7 +831,7 @@
<div class="abnormal_item red">
<div class="align_center">
<img class="dataIcon mr5px " src="@/static/icon_money_day.png" alt="" />
<img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
<span>处理率</span>
</div>
<div class="mt10">
@ -839,10 +839,15 @@
class="data mr5px underline"
@click="
() =>
handleShowAbnormalData('异常数据-处理率-%', abnormal_status, {
tip: '处理率',
prop: 'processingRate',
},'bar')
handleShowAbnormalData(
'异常数据-处理率-%',
abnormal_status,
{
tip: '处理率',
prop: 'processingRate',
},
'bar'
)
"
>{{ abnormal_Info.abnormalRate }}</span
>
@ -1028,7 +1033,7 @@
</div>
<div class="border pd10 flex-c-sb">
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box mb10"
@click="
@ -1046,7 +1051,7 @@
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box orange mb10"
@click="
@ -1064,14 +1069,19 @@
</div>
</div>
<div class="text_center" v-if="signforData_status !== 'daySignData'">
<div class="text_center flex1 mr10" v-if="signforData_status !== 'daySignData'">
<div
class="data_box blue mb10"
@click="
handleShowSignDetail('签收数据 - 签收率 - %', signforData_status, {
tip: '签收率',
prop: 'signScale',
},'bar')
handleShowSignDetail(
'签收数据 - 签收率 - %',
signforData_status,
{
tip: '签收率',
prop: 'signScale',
},
'bar'
)
"
>
<div class="data mr5px underline">
@ -1084,7 +1094,7 @@
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box purple mb10"
@click="
@ -1102,27 +1112,32 @@
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10" v-if="signforData_status !== 'daySignData'">
<div
class="data_box purple mb10"
@click="
handleShowSignDetail('签收数据 - 文员签收数 - 件', signforData_status, {
tip: '文员签收数',
prop: 'clerkSignforScale',
})
handleShowSignDetail(
'签收数据 - 文员签收率 - %',
signforData_status,
{
tip: '文员签收率',
prop: 'clerkSignforScale',
},
'bar'
)
"
>
<div class="data mr5px underline">
{{ signforData.clerkSignforScale || 0 }}
</div>
<div class="">件</div>
<div class="">%</div>
</div>
<div class="">
<span>文员签收件</span>
<span>文员签收率</span>
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box red mb10"
@click="
@ -1142,17 +1157,22 @@
</div>
</div>
<div class="text_center" v-if="signforData_status !== 'daySignData'">
<div class="text_center flex1" v-if="signforData_status !== 'daySignData'">
<div
class="data_box red mb10"
@click="
handleShowSignDetail('签收数据 - 签收超时率 - %', signforData_status, {
tip: '签收超时率',
prop: 'clerkOverTimeScale',
},'bar')
handleShowSignDetail(
'签收数据 - 签收超时率 - %',
signforData_status,
{
tip: '签收超时率',
prop: 'clerkOverTimeScale',
},
'bar'
)
"
>
<div class="data mr5px">
<div class="data mr5px underline">
{{ signforData.clerkOverTimeScale ? signforData.clerkOverTimeScale : 0 }}
</div>
<div class="">%</div>
@ -1311,7 +1331,7 @@
</div>
<div class="border pd10 flex-c-sb">
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box mb10"
@click="
@ -1329,7 +1349,7 @@
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box orange mb10"
@click="
@ -1347,14 +1367,22 @@
</div>
</div>
<div class="text_center" v-if="billSignforData_status !== 'dayBillLadingSignData'">
<div
class="text_center flex1 mr10"
v-if="billSignforData_status !== 'dayBillLadingSignData'"
>
<div
class="data_box blue mb10"
@click="
handleShowSignDetail('自提签收数据 - 签收率 - %', billSignforData_status, {
tip: '签收率',
prop: 'signScale',
},'bar')
handleShowSignDetail(
'自提签收数据 - 签收率 - %',
billSignforData_status,
{
tip: '签收率',
prop: 'signScale',
},
'bar'
)
"
>
<div class="data mr5px underline">
@ -1367,7 +1395,7 @@
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box purple mb10"
@click="
@ -1385,27 +1413,35 @@
</div>
</div>
<div class="text_center">
<div
class="text_center flex1 mr10"
v-if="billSignforData_status !== 'dayBillLadingSignData'"
>
<div
class="data_box purple mb10"
@click="
handleShowSignDetail('自提签收数据 - 文员签收数 - 件', billSignforData_status, {
tip: '文员签收率',
prop: 'clerkSignforScale',
})
handleShowSignDetail(
'自提签收数据 - 文员签收数 - %',
billSignforData_status,
{
tip: '文员签收率',
prop: 'clerkSignforScale',
},
'bar'
)
"
>
<div class="data mr5px underline">
{{ billSignforData.clerkSignforScale ? billSignforData.clerkSignforScale : 0 }}
</div>
<div class="">件</div>
<div class="">%</div>
</div>
<div class="">
<span>文员签收数</span>
<span>文员签收率</span>
</div>
</div>
<div class="text_center">
<div class="text_center flex1 mr10">
<div
class="data_box red mb10"
@click="
@ -1425,14 +1461,22 @@
</div>
</div>
<div class="text_center" v-if="billSignforData_status !== 'dayBillLadingSignData'">
<div
class="text_center flex1 mr10"
v-if="billSignforData_status !== 'dayBillLadingSignData'"
>
<div
class="data_box red mb10"
@click="
handleShowSignDetail('自提签收数据 - 超时签收任务 - %', billSignforData_status, {
tip: '超时签收任务',
prop: 'clerkOverTimeScale',
},'bar')
handleShowSignDetail(
'自提签收数据 - 超时签收任务 - %',
billSignforData_status,
{
tip: '超时签收任务',
prop: 'clerkOverTimeScale',
},
'bar'
)
"
>
<div class="data mr5px underline">
@ -1628,13 +1672,53 @@ const details = reactive({
/** 签收数据 */
signforDataInfo: {
/** 当日签收数据 */
daySignData: {},
daySignData: {
signNum: 0,
clerkOverTimeSignfoNum: 0,
clerkOverTimeScale: 0,
signScale: 0,
clerkSignNum: 0,
planNum: 0,
unSignNum: 0,
clerkSignforScale: 0,
data: [],
},
/** 当月签收数据 */
monthSignData: {},
monthSignData: {
signNum: 0,
clerkOverTimeSignfoNum: 0,
clerkOverTimeScale: 0,
signScale: 0,
clerkSignNum: 0,
planNum: 0,
unSignNum: 0,
clerkSignforScale: 0,
data: [],
},
/** 当日自提签收数据 */
dayBillLadingSignData: {},
dayBillLadingSignData: {
signNum: 0,
clerkOverTimeSignfoNum: 0,
clerkOverTimeScale: 0,
signScale: 0,
clerkSignNum: 0,
planNum: 0,
unSignNum: 0,
clerkSignforScale: 0,
data: [],
},
/** 当月自提签收数据 */
monthBillLadingSignData: {},
monthBillLadingSignData: {
signNum: 0,
clerkOverTimeSignfoNum: 0,
clerkOverTimeScale: 0,
signScale: 0,
clerkSignNum: 0,
planNum: 0,
unSignNum: 0,
clerkSignforScale: 0,
data: [],
},
},
loadingObj: {
/** 开单数据 */
@ -1996,15 +2080,7 @@ const initDeliveryData = async () => {
/** 签收数据 */
const initSignforData = async () => {
const _keyArr = [
'signNum',
'unSignNum',
'signScale',
'clerkSignNum',
'clerkSignforScale',
'clerkOverTimeSignfoNum',
'clerkOverTimeScale',
];
const _keyArr = ['signNum', 'unSignNum', 'clerkSignNum', 'planNum', 'clerkOverTimeSignfoNum'];
const _obj = {
daySignData: { data: [] },
@ -2030,6 +2106,8 @@ const initSignforData = async () => {
const item = _obj[key];
item[value] = 0;
console.log('item :>> ', item);
}
}
@ -2042,6 +2120,7 @@ const initSignforData = async () => {
const key = _keyArr[j];
const _val = isNumber(value[key]) ? Number(value[key]) : 0;
value[key] = _val;
// 签收数据
if (Number(value.type) === 1) {
@ -2063,6 +2142,106 @@ const initSignforData = async () => {
: // 自提签收数据
_obj.monthBillLadingSignData.data.push(value);
}
_obj.monthBillLadingSignData.totalSinNum = computeNumber(
_obj.monthBillLadingSignData.signNum,
'+',
_obj.monthBillLadingSignData.unSignNum
).result;
_obj.monthSignData.totalSinNum = computeNumber(
_obj.monthSignData.signNum,
'+',
_obj.monthSignData.unSignNum
).result;
console.log('_obj :>> ', _obj);
// 签收率
if (
!isNumber(_obj.monthBillLadingSignData.signNum) ||
!isNumber(_obj.monthBillLadingSignData.totalSinNum) ||
Number(_obj.monthBillLadingSignData.totalSinNum) === 0
) {
_obj.monthBillLadingSignData.signScale = 0;
} else {
_obj.monthBillLadingSignData.signScale = computeNumber(
_obj.monthBillLadingSignData.signNum,
'/',
_obj.monthBillLadingSignData.totalSinNum
).result;
}
if (
!isNumber(_obj.monthSignData.signNum) ||
!isNumber(_obj.monthSignData.totalSinNum) ||
Number(_obj.monthSignData.totalSinNum) === 0
) {
_obj.monthSignData.signScale = 0;
} else {
_obj.monthSignData.signScale = computeNumber(
_obj.monthSignData.signNum,
'/',
_obj.monthSignData.totalSinNum
).result;
}
// 文员签收率
if (
!isNumber(_obj.monthBillLadingSignData.clerkSignNum) ||
!isNumber(_obj.monthBillLadingSignData.planNum) ||
Number(_obj.monthBillLadingSignData.planNum) === 0
) {
_obj.monthBillLadingSignData.clerkSignforScale = 0;
} else {
_obj.monthBillLadingSignData.clerkSignforScale = computeNumber(
Number(_obj.monthBillLadingSignData.clerkSignNum),
'/',
Number(_obj.monthBillLadingSignData.planNum)
).result;
}
if (
!isNumber(_obj.monthSignData.clerkSignNum) ||
!isNumber(_obj.monthSignData.planNum) ||
Number(_obj.monthSignData.planNum) === 0
) {
_obj.monthSignData.clerkSignforScale = 0;
} else {
_obj.monthSignData.clerkSignforScale = computeNumber(
Number(_obj.monthSignData.clerkSignNum),
'/',
Number(_obj.monthSignData.planNum)
).result;
}
// 异常签收率
if (
!isNumber(_obj.monthBillLadingSignData.clerkOverTimeSignfoNum) ||
!isNumber(_obj.monthBillLadingSignData.planNum) ||
Number(_obj.monthBillLadingSignData.planNum) === 0
) {
_obj.monthBillLadingSignData.clerkOverTimeScale = 0;
} else {
_obj.monthBillLadingSignData.clerkOverTimeScale = computeNumber(
_obj.monthBillLadingSignData.clerkOverTimeSignfoNum,
'/',
_obj.monthBillLadingSignData.planNum
).result;
}
if (
!isNumber(_obj.monthSignData.clerkOverTimeSignfoNum) ||
!isNumber(_obj.monthSignData.planNum) ||
Number(_obj.monthSignData.planNum) === 0
) {
_obj.monthSignData.clerkOverTimeScale = 0;
} else {
_obj.monthSignData.clerkOverTimeScale = computeNumber(
_obj.monthSignData.clerkOverTimeSignfoNum,
'/',
_obj.monthSignData.planNum
).result;
}
}
// 当日数据
@ -2097,11 +2276,12 @@ const initSignforData = async () => {
}
}
details.signforDataInfo = data || [];
// details.signforDataInfo = data || [];
} catch (error) {
console.log('error :>> ', error);
} finally {
details.signforDataInfo = _obj;
console.log('details.signforDataInfo :>> ', details.signforDataInfo);
details.loadingObj.signforData = false;
}
};
@ -2156,7 +2336,7 @@ const delivery_bill_info = computed(() => {
/** 签收数据 */
const signforData = computed<any>(() => {
const _obj: any = details.signforDataInfo[signforData_status.value] || {};
console.log('_obj :>> ', _obj);
// console.log('_obj :>> ', _obj);
_obj.signScaleNum ? _obj.signScaleNum : (_obj.signScaleNum = _obj.signScale || 0);
_obj.clerkSignforScaleNum
@ -2202,7 +2382,6 @@ const billSignforData = computed<any>(() => {
type OptionObjType = { prop: string; tip: string };
// 定义两种颜色
const colors = ['#008CBA', '#808080']; // 蓝色和灰色
// /** 获取百分比 */
@ -2317,10 +2496,15 @@ const getProportion = (value: number) => {
// });
// };
// 定义显示图表的函数，接受数据、标题、选项对象和图表类型（默认为饼图）
const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType, chartType: string = 'pie') => {
console.log('data :>> ', data);
console.log('title :>> ', title);
console.log('optionObj :>> ', optionObj);
const handleShowEcharts = (
data: any[],
title: string,
optionObj: OptionObjType,
chartType: string = 'pie'
) => {
console.log('data :>> ', data);
console.log('title :>> ', title);
console.log('optionObj :>> ', optionObj);
if (getObjType(data) !== 'array') return; // 检查传入的数据是否为数组，如果不是则返回
@ -2344,7 +2528,8 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
const item = _arr[j]; // 获取当前 _arr 中的数据项
if (item.value > value[optionObj.prop]) continue; // 如果当前 _arr 中的数据项值大于当前数据项的值，继续下一个循环
_arr.splice(j, 0, { // 在当前位置插入当前数据项
_arr.splice(j, 0, {
// 在当前位置插入当前数据项
name: value.warehouseName, // 数据项的名称
value: value[optionObj.prop], // 数据项的值
});
@ -2353,13 +2538,15 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
}
if (isContinue) continue; // 如果已插入当前数据项，跳过插入到数组末尾的操作
_arr.push({ // 如果未插入，将当前数据项添加到数组末尾
_arr.push({
// 如果未插入，将当前数据项添加到数组末尾
name: value.warehouseName, // 数据项的名称
value: value[optionObj.prop], // 数据项的值
});
}
nextTick(() => { // 确保 DOM 更新完成后再进行图表初始化
nextTick(() => {
// 确保 DOM 更新完成后再进行图表初始化
// 获取图表容器元素
const chartDom = document.getElementById('echartBox');
if (!chartDom) return; // 如果未找到图表容器元素，则返回
@ -2373,7 +2560,7 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
},
tooltip: {
trigger: 'item', // 设置提示框触发方式为数据项
formatter: (params) => {
formatter: params => {
if (chartType === 'pie') {
return `${params.name}: ${params.value} (${params.percent}%)`; // 如果是饼图，格式化提示信息为名称、值和百分比
} else {
@ -2385,7 +2572,8 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
orient: 'vertical', // 图例布局方向
left: 'left', // 图例位置
},
...(chartType === 'bar' && { // 如果是柱状图，添加柱状图的配置
...(chartType === 'bar' && {
// 如果是柱状图，添加柱状图的配置
xAxis: {
type: 'category', // x 轴类型为类别
data: _arr.map(item => item.name), // x 轴数据为类别名称
@ -2397,24 +2585,25 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
yAxis: {
type: 'value', // y 轴类型为数值
axisLabel: {
formatter: (value) => {
formatter: value => {
return getProportion(value); // 将 y 轴标签格式化为百分比形式
}
},
},
},
series: [
{
name: optionObj.tip, // 系列名称
type: 'bar', // 系列类型为柱状图
data: _arr.map(item => ({ // 系列数据
data: _arr.map(item => ({
// 系列数据
name: item.name, // 数据项名称
value: item.value, // 数据项值
})),
itemStyle: {
color: (params) => {
color: params => {
// 根据数据项的索引选择颜色
return colors[params.dataIndex % 2];
}
},
},
emphasis: {
itemStyle: {
@ -2426,9 +2615,9 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
show: true, // 显示高亮标签
fontSize: 20, // 高亮标签字体大小
fontWeight: 'bold', // 高亮标签字体粗细
formatter: (params) => {
formatter: params => {
return getProportion(params.value); // 高亮标签格式化为百分比形式
}
},
},
},
barGap: '30%', // 柱子之间的间隔
@ -2437,12 +2626,14 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
},
],
}),
...(chartType === 'pie' && { // 如果是饼图，添加饼图的配置
...(chartType === 'pie' && {
// 如果是饼图，添加饼图的配置
series: [
{
name: optionObj.tip, // 系列名称
type: 'pie', // 系列类型为饼图
data: _arr.map((item) => ({ // 系列数据
data: _arr.map(item => ({
// 系列数据
name: item.name + ' - ' + getProportion(item.value / _total), // 数据项名称，附加百分比
value: item.value, // 数据项值
})),
@ -2469,8 +2660,6 @@ const handleShowEcharts = (data: any[], title: string, optionObj: OptionObjType,
});
};
/** 请求详情 */
const handleDetails = async (type, title, optionObj: OptionObjType) => {
details.popUpShow.isShow = true;
@ -2534,7 +2723,12 @@ const handleShowDeliveryDetail = (
handleShowEcharts(data, title, optionObj);
};
/** 显示售后异常数据 */
const handleShowAbnormalData = (title, type: 'dayData' | 'monthData', optionObj: any = {},chartType) => {
const handleShowAbnormalData = (
title,
type: 'dayData' | 'monthData',
optionObj: any = {},
chartType
) => {
details.popUpShow.isShow = true;
details.title = title;
console.log(optionObj, 'optionObj');
@ -2544,7 +2738,7 @@ const handleShowAbnormalData = (title, type: 'dayData' | 'monthData', optionObj:
if (getObjType(details.unloadAbnormalDataInfo[type]) !== 'object') return;
const { data } = details.unloadAbnormalDataInfo[type];
handleShowEcharts(data, title, optionObj,chartType);
handleShowEcharts(data, title, optionObj, chartType);
};
/** 显示签收详情 */
@ -2567,7 +2761,7 @@ const handleShowSignDetail = (
console.log('data :>> ', data);
handleShowEcharts(data, title, optionObj,chartType);
handleShowEcharts(data, title, optionObj, chartType);
};
/** 导出 */

Write Preview
Loading…
Cancel
Save