报表2页面

This commit is contained in:
2024-06-19 08:48:48 +08:00
parent 89b71d5aa2
commit be75dd0702
9 changed files with 898 additions and 346 deletions

View File

@@ -3,7 +3,7 @@
<!-- 暂无数据 -->
<div
:style="{ height: chartHeight + 'px' }"
v-show="this.chartMsg.series.length === 0"
v-show="this.chartMsg.series[0].data.length === 0"
>
<div
class="no-data-bg"
@@ -11,7 +11,7 @@
></div>
</div>
<!-- 图例 -->
<div v-show="this.chartMsg.series.length > 0">
<div v-show="this.chartMsg.series[0].data.length > 0">
<div class="legend">
<span class="item" v-for="item in legendList" :key="item.id">
<span
@@ -74,10 +74,10 @@ export default {
? '<img width="10" height="10" style="margin-right:4px;" src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB3aWR0aD0iMTIuNzIxNjM5NXB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDEyLjcyMTYzOTUgOCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIj4KICAgIDx0aXRsZT7nvJbnu4QgNjwvdGl0bGU+CiAgICA8ZyBpZD0iMDTmiqXooajnrqHnkIYiIHN0cm9rZT0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIxIiBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPgogICAgICAgIDxnIGlkPSLmjIfmoIflrozmiJDmg4XlhrUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0xMDUxLjYzOTE4MCwgLTQyNS4wMDAwMDApIj4KICAgICAgICAgICAgPGcgaWQ9Iue8lue7hC025aSH5Lu9LTQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEwMjEuNTAwMDAwLCAzNDQuMDAwMDAwKSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0i57yW57uELTYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDI5LjUwMDAwMCwgNzguMDAwMDAwKSI+CiAgICAgICAgICAgICAgICAgICAgPHJlY3QgaWQ9IuefqeW9oiIgeD0iMCIgeT0iMCIgd2lkdGg9IjE0IiBoZWlnaHQ9IjE0Ij48L3JlY3Q+CiAgICAgICAgICAgICAgICAgICAgPHBhdGggZD0iTTcuMTM5MTgwMjYsMyBDOS4wMDMxMDczNywzIDEwLjU2OTI2NzMsNC4yNzQ4OTI3MiAxMS4wMTMyMjU0LDYuMDAwMjQzNDcgTDEyLjM2MDgxOTcsNiBDMTIuOTEzMTA0NSw2IDEzLjM2MDgxOTcsNi40NDc3MTUyNSAxMy4zNjA4MTk3LDcgQzEzLjM2MDgxOTcsNy41NTIyODQ3NSAxMi45MTMxMDQ1LDggMTIuMzYwODE5Nyw4IEwxMS4wMTI5NjY3LDguMDAwNzYxMzQgQzEwLjU2ODY1OTIsOS43MjU2MDIyNCA5LjAwMjc0NTUxLDExIDcuMTM5MTgwMjYsMTEgQzUuMjc1NjE1MDEsMTEgMy43MDk3MDEzMSw5LjcyNTYwMjI0IDMuMjY1MzkzNzgsOC4wMDA3NjEzNCBMMS42MzkxODAyNiw4IEMxLjA4Njg5NTUxLDggMC42MzkxODAyNTgsNy41NTIyODQ3NSAwLjYzOTE4MDI1OCw3IEMwLjYzOTE4MDI1OCw2LjQ0NzcxNTI1IDEuMDg2ODk1NTEsNiAxLjYzOTE4MDI2LDYgTDMuMjY1MTM1MDksNi4wMDAyNDM0NyBDMy43MDkwOTMyLDQuMjc0ODkyNzIgNS4yNzUyNTMxNSwzIDcuMTM5MTgwMjYsMyBaIiBpZD0i5b2i54q257uT5ZCIIiBmaWxsPSIjRkZDRTZBIiBmaWxsLXJ1bGU9Im5vbnplcm8iPjwvcGF0aD4KICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgPC9nPgogICAgICAgIDwvZz4KICAgIDwvZz4KPC9zdmc+" />'
: `<span style="display:inline-block;margin-right:4px;border-radius:2px;width:10px;height:10px;background-color:${params[i].color}"></span>`
}` +
`<span style='display:inline-block;width:150px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
`<span style='display:inline-block;width:180px;color:rgba(0,0,0,0.8);font-size:14px;'>${params[i].seriesName}</span>` +
`<span style='color:rgba(0,0,0,0.48);font-size:14px;'>${
params[i].name === "%"
? (params[i].value ? params[i].value.toFixed(2) : 0.0) +
? (params[i].value ? params[i].value.toFixed(2) : "0.00") +
params[i].name
: String(params[i].value).replace(
/\B(?=(\d{3})+(?!\d))/g,

View File

@@ -16,41 +16,45 @@
</el-option>
</el-select>
</el-form-item>
<el-form-item v-show="form.type === 1" label="时间" prop="dayTime">
<el-form-item v-show="form.type === 0" label="时间" prop="dayTime">
<el-date-picker
size="small"
clearable
v-model="form.dayTime"
type="date"
placeholder="选择日期"
value-format="yyyy-MM-dd"
style="width: 150px"
>
</el-date-picker>
</el-form-item>
<el-form-item v-show="form.type === 2" label="时间" prop="weekTime">
<el-form-item v-show="form.type === 1" label="时间" prop="weekTime">
<el-date-picker
v-model="form.weekTime"
type="week"
format="yyyy 第 WW 周"
format="yyyy-MM-dd"
placeholder="选择周"
value-format="yyyy-MM-dd"
style="width: 150px"
>
</el-date-picker>
</el-form-item>
<el-form-item v-show="form.type === 3" label="时间" prop="monthTime">
<el-form-item v-show="form.type === 2" label="时间" prop="monthTime">
<el-date-picker
v-model="form.monthTime"
type="month"
placeholder="选择月份"
value-format="yyyy-MM-dd"
style="width: 150px"
>
</el-date-picker>
</el-form-item>
<el-form-item v-show="form.type === 4" label="时间" prop="yearTime">
<el-form-item v-show="form.type === 3" label="时间" prop="yearTime">
<el-date-picker
v-model="form.yearTime"
type="year"
placeholder="选择年份"
value-format="yyyy-MM-dd"
style="width: 150px"
>
</el-date-picker>
@@ -73,48 +77,73 @@
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="getDataList"
<el-button type="primary" size="small" @click="getDataList('search')"
>查询</el-button
>
<el-divider direction="vertical"></el-divider>
<el-button type="primary" size="small" plain @click="handleExport"
<el-button
type="primary"
size="small"
plain
@click="getDataList('export')"
>导出</el-button
>
</el-form-item>
</el-form>
</template>
<script>
import moment from "moment";
export default {
name: "bmSearchBar",
data() {
return {
form: {
type: 1,
dayTime: "",
weekTime: "",
monthTime: "",
yearTime: "",
factory: "",
type: 2,
dayTime: moment().format("yyyy-MM-DD"),
weekTime: moment().format("yyyy-MM-DD"),
monthTime: moment().format("yyyy-MM-DD"),
yearTime: moment().format("yyyy-MM-DD"),
factory: [],
},
typeList: [
{ id: 1, name: "日" },
{ id: 2, name: "周" },
{ id: 3, name: "月" },
{ id: 4, name: "年" },
{ id: 0, name: "日" },
{ id: 1, name: "周" },
{ id: 2, name: "月" },
{ id: 3, name: "年" },
],
factoryList: [
{ id: 1, name: "瑞昌" },
{ id: 2, name: "邯郸" },
{ id: 0, name: "瑞昌" },
{ id: 1, name: "邯郸" },
],
};
},
methods: {
getDataList() {
getDataList(val) {
console.log(this.form);
this.$emit("getSearch", this.form);
},
handleExport() {
this.$emit("handleExport");
let params = {};
params.factory = this.form.factory;
switch (this.form.type) {
case 0:
params.startDate = this.form.dayTime;
break;
case 1:
params.startDate = this.form.weekTime;
break;
case 2:
params.startDate = this.form.monthTime;
break;
case 3:
params.startDate = this.form.yearTime;
break;
default:
break;
}
params.type = this.form.type;
if (val === "search") {
this.$emit("getSearch", params);
} else {
this.$emit("handleExport", params);
}
},
},
};