msb-mca
/
shop-admin
mirror of http://internel-git.mashibing.cn/yanxuan-frontend/shop-admin.git
2.1k
3
Code Issues Projects Releases Wiki Activity

feat: 首页

Browse Source
fix-0609-xwk
向文可 3 years ago
parent d6cf0a86f1
commit 1cf91f6b47
4 changed files with 242 additions and 87 deletions
Show Stats Download Patch File Download Diff File

99
src/api/home/index.js
Unescape View File

@ -0,0 +1,99 @@
import request from '@/utils/request.js';
// 获取头部数据 今日访客 今日订单 今日销售额 近七天销售额
export const summary = () => {
return request({
url: '/mall/base/frontPage/getHeaderData',
method: 'get',
});
};
// 获取待处理事务数据
export const order = () => {
return request({
url: '/mall/base/frontPage/getWaitHandleAffairs',
method: 'get',
});
};
// 获取商品总览数据
export const product = () => {
return request({
url: '/mall/base/frontPage/getProductOverview',
method: 'get',
});
};
// 获取用户总览数据
export const customer = () => {
return request({
url: '/mall/base/frontPage/getUserOverviewData',
method: 'get',
});
};
// 获取订单数量同比增长数据
export const orderInfo = () => {
return request({
url: '/mall/base/frontPage/getOrderTotal',
method: 'get',
});
};
// 获取订单统计数据
export const orderSummary = (params) => {
return request({
url: '/mall/base/frontPage/listOrderStatistics',
method: 'get',
params,
});
};
// 获取今日订单统计数据
export const orderToday = () => {
return request({
url: '/mall/base/frontPage/listOrderStatistics',
method: 'get',
});
};
// 获取访客数量同比增长数据
export const customerInfo = () => {
return request({
url: '/mall/base/frontPage/getVisitorTotal',
method: 'get',
});
};
// 获取访客统计数据
export const customerSummary = (params) => {
return request({
url: '/mall/base/frontPage/listVisitorStatistics',
method: 'get',
params,
});
};
// 获取今日访客统计数据
export const customerToday = () => {
return request({
url: '/mall/base/frontPage/listTodayVisitorStatistics',
method: 'get',
});
};
// 获取销售额同比增长数据
export const moneyInfo = () => {
return request({
url: '/mall/base/frontPage/getSalesTotal',
method: 'get',
});
};
// 获取销售额统计数据
export const moneySummary = (params) => {
return request({
url: '/mall/base/frontPage/listSalesStatistics',
method: 'get',
params,
});
};
// 获取今日销售额统计数据
export const moneyToday = () => {
return request({
url: '/mall/base/frontPage/listTodaySalesStatistics',
method: 'get',
});
};

214
src/store/modules/home/home.js
Unescape View File

@ -1,8 +1,6 @@
import * as api from '@/api/system/notify.js'; import * as api from '@/api/home/index.js';
import { ElMessage, ElMessageBox } from '@/plugins/element-plus';
const state = () => ({ const state = () => ({
opts: { opts: {
init: false,
summary: [ summary: [
{ {
label: '今日访客数', label: '今日访客数',
@ -150,95 +148,153 @@ const state = () => ({
value: 5000, value: 5000,
}, },
], ],
}, chart: [
chart: [ {
[ info: {},
{ label: '1月', value: 152 }, data: [
{ label: '2月', value: 215 }, { label: '1月', value: 152 },
{ label: '3月', value: 198 }, { label: '2月', value: 215 },
{ label: '4月', value: 348 }, { label: '3月', value: 198 },
{ label: '5月', value: 111 }, { label: '4月', value: 348 },
], { label: '5月', value: 111 },
[ ],
{ label: '1月', value: 152 }, },
{ label: '2月', value: 215 }, {
{ label: '3月', value: 198 }, info: {},
{ label: '4月', value: 348 }, data: [
{ label: '5月', value: 111 }, { label: '1月', value: 152 },
], { label: '2月', value: 215 },
[ { label: '3月', value: 198 },
{ label: '1月', value: 152 }, { label: '4月', value: 348 },
{ label: '2月', value: 215 }, { label: '5月', value: 111 },
{ label: '3月', value: 198 }, ],
{ label: '4月', value: 348 }, },
{ label: '5月', value: 111 }, {
info: {},
data: [
{ label: '1月', value: 152 },
{ label: '2月', value: 215 },
{ label: '3月', value: 198 },
{ label: '4月', value: 348 },
{ label: '5月', value: 111 },
],
},
], ],
], },
condition1: {
today: false,
beginDateTime: null,
endDateTime: null,
},
condition2: {
today: false,
beginDateTime: null,
endDateTime: null,
},
condition3: {
today: false,
beginDateTime: null,
endDateTime: null,
},
}); });
const getters = {}; const getters = {};
const mutations = { const mutations = {
setCode: (state, data) => (state.code = data), setSummary: (state, data) => {
setCondition: (state, data) => (state.condition = data), state.opts.summary[0].value = data.todayVisitorCount || 0;
setList: (state, data) => (state.list = data), state.opts.summary[1].value = data.todayOrderCount || 0;
setTotal: (state, data) => (state.total = data), state.opts.summary[2].value = data.todaySales || 0;
setOpts: (state, data) => (state.opts = data), state.opts.summary[3].value = data.lastSevenDaysSales || 0;
},
setOrder: (state, data) => {
state.opts.order[0].value = data.waitPayCount || 0;
state.opts.order[1].value = data.waitRefundCount || 0;
state.opts.order[2].value = data.waitShipCount || 0;
state.opts.order[3].value = data.waitReturnGoodsCount || 0;
state.opts.order[4].value = data.shippedCount || 0;
},
setProduct: (state, data) => {
state.opts.product[0].value = data.onTheShelfCount || 0;
state.opts.product[1].value = data.takeDownCount || 0;
state.opts.product[2].value = data.stockLessCount || 0;
state.opts.product[3].value = data.allCount || 0;
},
setCustomer: (state, data) => {
state.opts.customer[0].value = data.todayIncreaseCount || 0;
state.opts.customer[1].value = data.yesterdayIncreaseCount || 0;
state.opts.customer[2].value = data.monthIncreaseCount || 0;
state.opts.customer[3].value = data.allCount || 0;
},
setChartInfo1: (state, data) => (state.opts.chart[0].info = data),
setChartInfo2: (state, data) => (state.opts.chart[1].info = data),
setChartInfo3: (state, data) => (state.opts.chart[2].info = data),
setChartData1: (state, data) => (state.opts.chart[0].data = data),
setChartData2: (state, data) => (state.opts.chart[1].data = data),
setChartData3: (state, data) => (state.opts.chart[2].data = data),
}; };
const actions = { const actions = {
search: async ({ state, commit, rootGetters }) => { loadSummary: async ({ commit }) => {
let data = { ...state.condition }; let res = await api.summary();
data.startReleaseTime = data.dateRange?.[0]; commit('setSummary', res);
data.endReleaseTime = data.dateRange?.[1]; return res;
delete data.dateRange; },
let res = await api.search({ ...rootGetters['local/page'](state.code), ...state.condition }); loadOrder: async ({ commit }) => {
if (res) { let res = await api.order();
commit('setList', res.records); commit('setOrder', res);
commit('setTotal', res.total); return res;
} else { },
ElMessage.error('查询失败'); loadProduct: async ({ commit }) => {
commit('setList', []); let res = await api.product();
} commit('setProduct', res);
return res;
},
loadCustomer: async ({ commit }) => {
let res = await api.customer();
commit('setCustomer', res);
return res; return res;
}, },
load: async ({ commit }) => { loadChartInfo1: async ({ commit }) => {
commit('setOpts', { let res = await api.customerInfo();
init: true, commit('setChartInfo1', res);
}); return res;
},
loadChartInfo2: async ({ commit }) => {
let res = await api.orderInfo();
commit('setChartInfo2', res);
return res;
},
loadChartInfo3: async ({ commit }) => {
let res = await api.moneyInfo();
commit('setChartInfo3', res);
return res;
},
loadChartData1: async ({ state, commit }) => {
let res = await (state.condition1.today ? api.customerToday : api.customerSummary)(state.condition1);
commit('setChartData1', res);
return res;
}, },
detail: async (context, id) => { loadChartData2: async ({ state, commit }) => {
let res = await api.detail(id); let res = await (state.condition2.today ? api.orderToday : api.orderSummary)(state.condition2);
if (!res) { commit('setChartData2', res);
ElMessage.error('加载详情失败');
}
return res; return res;
}, },
save: async ({ dispatch }, data) => { loadChartData3: async ({ state, commit }) => {
let save = data.id ? api.update : api.create; let res = await (state.condition3.today ? api.orderToday : api.orderSummary)(state.condition3);
let res = await save(data); commit('setChartData3', res);
if (res) {
ElMessage.success('保存成功');
dispatch('search');
} else {
ElMessage.error('保存失败');
}
return res; return res;
}, },
remove: async ({ dispatch }, idList) => { load: async ({ dispatch }) => {
if (!idList.length) { return await Promise.all([
ElMessage.warning('请选择要删除的数据'); dispatch('loadSummary'),
} else { dispatch('loadOrder'),
try { dispatch('loadProduct'),
await ElMessageBox.confirm('数据删除后无法恢复，确定要删除吗?', '危险操作'); dispatch('loadCustomer'),
let res = await api.remove(idList.join(',')); dispatch('loadChartInfo1'),
if (res) { dispatch('loadChartInfo2'),
ElMessage.success('删除成功'); dispatch('loadChartInfo3'),
dispatch('search'); dispatch('loadChartData1'),
} else { dispatch('loadChartData2'),
ElMessage.error('删除失败'); dispatch('loadChartData3'),
} ]);
} catch (e) {
console.info('取消删除', e);
}
}
}, },
}; };
export default { export default {

10
src/views/home/index.vue
Unescape View File

@ -166,7 +166,6 @@
const router = useRouter(); const router = useRouter();
const store = useStore(); const store = useStore();
const opts = computed(() => store.state.home.opts); const opts = computed(() => store.state.home.opts);
const chartData = computed(() => store.state.home.chart);
const handleRoute = (route) => router.push(route); const handleRoute = (route) => router.push(route);
const handleChart = (selector, color, name, data) => { const handleChart = (selector, color, name, data) => {
const chart = echarts.init(document.querySelector(selector)); const chart = echarts.init(document.querySelector(selector));
@ -228,10 +227,11 @@
}; };
chart.setOption(option); chart.setOption(option);
}; };
onMounted(() => { onActivated(async () => {
handleChart('.row-5 .chart', '#80FFA5', '访客数量', unref(chartData)[0]); await store.dispatch('home/load');
handleChart('.row-6 .chart', '#00DDFF', '订单数量', unref(chartData)[1]); handleChart('.row-5 .chart', '#80FFA5', '访客数量', unref(opts).chart[0].data);
handleChart('.row-7 .chart', '#37A2FF', '销售额', unref(chartData)[2]); handleChart('.row-6 .chart', '#00DDFF', '订单数量', unref(opts).chart[1].data);
handleChart('.row-7 .chart', '#37A2FF', '销售额', unref(opts).chart[2].data);
}); });
</script> </script>

6
src/views/sales/product/form/step2.vue
Unescape View File

@ -83,9 +83,9 @@
<el-input-number v-model="row.costPrice" :min="0" /> <el-input-number v-model="row.costPrice" :min="0" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" header-align="center" label="库存预警值" prop="warn" width="160px"> <el-table-column align="center" header-align="center" label="库存预警值" prop="stockWarn" width="160px">
<template #default="{ row }"> <template #default="{ row }">
<el-input-number v-model="row.warn" :min="0" /> <el-input-number v-model="row.stockWarn" :min="0" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" header-align="center" label="SKU编号" min-width="100px" prop="id" /> <el-table-column align="center" header-align="center" label="SKU编号" min-width="100px" prop="id" />
@ -186,7 +186,7 @@
stock: 0, stock: 0,
stockChange: 0, stockChange: 0,
costPrice: 0, costPrice: 0,
warn: 100, stockWarn: 100,
isEnable: true, isEnable: true,
name: [], name: [],
attributeSymbolList: [], attributeSymbolList: [],

Write Preview
Loading…
Cancel
Save