Browse Source

项目统计管理

dev_kxc
xzt 1 year ago
parent
commit
3e859ec0fa
  1. 11
      jwtech-admin-page/src/api/projectStatistics/invest.js
  2. 249
      jwtech-admin-page/src/views/projectStatistics/projectStatisticsInvest/index.vue
  3. 177
      jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/components/dataCharts.vue
  4. 513
      jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/components/list.vue
  5. 37
      jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/index.vue
  6. 8
      jwtech-admin-page/vue.config.js

11
jwtech-admin-page/src/api/projectStatistics/invest.js

@ -0,0 +1,11 @@
import request from '@/utils/request'
// 查询项目投资统计列表
export function listProjectInvest(query) {
return request({
url: '/statistics/assert/list',
method: 'post',
data: query
})
}

249
jwtech-admin-page/src/views/projectStatistics/projectStatisticsInvest/index.vue

@ -0,0 +1,249 @@
<template>
<div class="app-container">
<!-- 面包屑 -->
<el-breadcrumb separator="/" style="margin-bottom: 20px">
<el-breadcrumb-item
v-for="(item, index) in routeList"
:key="item + index"
:to="{ path: item.path }"
>{{ item.routeName }}</el-breadcrumb-item
>
</el-breadcrumb>
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="项目类型" prop="projectType">
<el-cascader
v-model="queryParams.data.projectType"
:options="projectTypeoptions"
:props="projectTypeOptionProps"
placeholder="请选择项目类型"
clearable
size="small"
style="width: 100%"
></el-cascader>
<!-- <el-select
v-model="queryParams.data.projectType"
placeholder="请选择项目类型"
@change="handleQuery"
clearable
size="small"
:popper-append-to-body="false"
>
<el-option-group
v-for="(group, index) in projectTypeoptions"
:key="group.label"
:label="group.label"
>
<el-option
v-for="dict in group.options"
:key="dict.dictValue + dict.dictLabel"
:label="dict.dictLabel"
:value="index + dict.dictValue"
>
</el-option>
</el-option-group>
</el-select> -->
</el-form-item>
<el-form-item label="项目名称" prop="projectName">
<el-input
v-model="queryParams.data.projectName"
placeholder="请输入项目名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
>
<el-button
type="primary"
slot="append"
icon="el-icon-search"
size="small"
@click="handleQuery"
></el-button>
</el-input>
</el-form-item>
<el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="infoList">
<!-- <el-table-column type="selection" width="55" align="center" fixed /> -->
<el-table-column
label="序号"
type="index"
width="50"
align="center"
fixed
/>
<el-table-column
label="项目名称"
align="center"
prop="projectName"
min-width="120"
/>
<el-table-column
label="业务单位"
align="center"
prop="unit"
min-width="120"
/>
<el-table-column
label="项目投资概算(万元)"
align="center"
prop="total"
min-width="180"
/>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { listProjectInvest } from "@/api/projectStatistics/invest";
export default {
data() {
return {
//
routeList: [
{
path: "/projectStatistics/projectStatisticsInvest",
routeName: "项目投资统计",
},
],
infoList: [],
loading: true,
//
showSearch: true,
total: 0,
//
queryParams: {
pageNum: 1,
pageSize: 10,
ids: null,
data: {},
//
params: {
//
orderBy: "create_time",
// descasc
sortBy: "desc",
},
},
projectTypeOptionProps: {
emitPath: false,
checkStrictly: true, //
},
//
zd_projectTypeOptions: [],
//
ms_projectTypeOptions: [],
};
},
computed: {
projectTypeoptions() {
// let op = [
// {
// label: "",
// options: this.zd_projectTypeOptions,
// },
// {
// label: "",
// options: this.ms_projectTypeOptions,
// },
// ];
let op = [
{
label: "重大项目",
value: "zd, ",
children: this.zd_projectTypeOptions.map((item) => {
return {
label: item.dictLabel,
value: "zd," + item.dictValue,
};
}),
},
{
label: "面上项目",
value: "ms, ",
children: this.ms_projectTypeOptions.map((item) => {
return {
label: item.dictLabel,
value: "ms," + item.dictValue,
};
}),
},
];
// console.log(3333, op);
return op;
},
},
created() {
this.getList();
this.getDicts("major_project").then((response) => {
this.zd_projectTypeOptions = response.data;
});
this.getDicts("general_project").then((response) => {
this.ms_projectTypeOptions = response.data;
});
},
methods: {
getList() {
this.loading = true;
listProjectInvest(this.queryParams).then((res) => {
console.log(77777, res);
this.loading = false;
});
},
//
resetQueryForm() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
data: {},
//
params: {
//
orderBy: "create_time",
// descasc
sortBy: "desc",
},
};
this.resetForm("queryForm");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetQueryForm();
this.handleQuery();
},
},
};
</script>

177
jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/components/dataCharts.vue

@ -0,0 +1,177 @@
<template>
<div class="content">
<!-- <div ref="pieEle" style="width: 30%; height: 100%"></div> -->
<div ref="barEle" style="width: 70%; height: 100%"></div>
</div>
</template>
<script>
// import { getPie, getHistogram } from "@/api/yg/dike/yhxx";
import * as echarts from "echarts";
export default {
data() {
return {
pieChartData: [],
barChartData: [],
};
},
created() {
// this.getData();
},
methods: {
async getData() {
const res1 = await getPie();
const res2 = await getHistogram();
this.pieChartData = [];
for (let key in res1[0]) {
this.pieChartData.push({ value: res1[0][key], name: key });
}
// for (let key in res1[0]) {
// this.barChartData.push({ value: res1[0][key], name: key });
// }
this.barChartData = res2;
this.pieInit();
this.barInit();
console.log("pieChartData", this.pieChartData);
console.log("barChartData", this.barChartData);
},
pieInit() {
let chartDom = this.$refs.pieEle;
let myChart = echarts.init(chartDom);
let option = {
title: {
// text: "Referer of a Website",
// subtext: "Fake Data",
left: "center",
},
color: ["#6DD48C", "#5DB1FF", "#FBD437", "#36CBCB"],
tooltip: {
trigger: "item",
},
legend: {
orient: "horizontal",
bottom: "2%",
icon: "circle",
},
series: [
{
// name: "",
type: "pie",
radius: "65%",
data: this.pieChartData,
label: {
formatter: (params) => {
// console.log(11, params);
return `${params.name}: ${params.value}`;
},
},
emphasis: {
itemStyle: {
shadowBlur: 10,
shadowOffsetX: 0,
shadowColor: "rgba(0, 0, 0, 0.5)",
},
},
},
],
};
option && myChart.setOption(option);
window.addEventListener("resize", function () {
myChart.resize();
});
},
barInit() {
Object.values(this.barChartData);
let chartDom = this.$refs.barEle;
let myChart = echarts.init(chartDom);
let option = {
title: {
// text: "World Population",
},
color: ["#38A0FF", "#4CCA73"],
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
legend: {
orient: "horizontal",
bottom: "2%",
icon: "circle",
},
grid: {
left: "3%",
right: "4%",
bottom: "12%",
containLabel: true,
},
xAxis: {
type: "category",
axisLine: {
show: false,
},
axisTick: {
alignWithLabel: true,
},
data: Object.keys(this.barChartData),
},
yAxis: {
type: "value",
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
//线
show: true, //
lineStyle: {
//线
// color: "#0735a2", //线
// width: 1, //线
type: "dashed", //线
},
},
minInterval: 1, //1
max: function (value) {
return value.max + Math.ceil(0.2 * value.max);
},
// boundaryGap: [0, 1],
},
series: [
{
name: "已解决",
type: "bar",
data: Object.values(this.barChartData).map((res) => res["1"]),
barMaxWidth: "10%",
},
{
name: "未解决",
type: "bar",
data: Object.values(this.barChartData).map((res) => res["0"]),
barMaxWidth: "10%",
},
],
};
option && myChart.setOption(option);
window.addEventListener("resize", function () {
myChart.resize();
});
},
},
};
</script>
<style lang="scss" scoped>
.content {
height: 300px;
// border: 1px solid #000;
background: #fff;
box-shadow: 2px 4px 6px 2px rgba(0, 0, 0, 0.2);
margin-bottom: 10px;
display: flex;
}
</style>

513
jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/components/list.vue

@ -0,0 +1,513 @@
<template>
<!-- 项目基本信息-->
<div>
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="项目类型" prop="projectType">
<el-cascader
v-model="queryParams.data.projectType"
:options="projectTypeoptions"
:props="projectTypeOptionProps"
placeholder="请选择项目类型"
clearable
size="small"
style="width: 100%"
></el-cascader>
<!-- <el-select
v-model="queryParams.data.projectType"
placeholder="请选择项目类型"
@change="handleQuery"
clearable
size="small"
:popper-append-to-body="false"
>
<el-option-group
v-for="(group, index) in projectTypeoptions"
:key="group.label"
:label="group.label"
>
<el-option
v-for="dict in group.options"
:key="dict.dictValue + dict.dictLabel"
:label="dict.dictLabel"
:value="index + dict.dictValue"
>
</el-option>
</el-option-group>
</el-select> -->
</el-form-item>
<el-form-item label="项目名称" prop="projectName">
<el-input
v-model="queryParams.data.projectName"
placeholder="请输入项目名称"
clearable
size="small"
@keyup.enter.native="handleQuery"
>
<el-button
type="primary"
slot="append"
icon="el-icon-search"
size="small"
@click="handleQuery"
></el-button>
</el-input>
</el-form-item>
<el-form-item>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="infoList">
<!-- <el-table-column type="selection" width="55" align="center" fixed /> -->
<el-table-column
label="序号"
type="index"
width="50"
align="center"
fixed
/>
<el-table-column
label="项目名称"
align="center"
prop="projectName"
min-width="120"
/>
<!-- <el-table-column
label="项目编码"
align="center"
prop="proCode"
min-width="120"
/> -->
<!-- <el-table-column
label="行政区划"
align="center"
prop="adcd"
min-width="120"
:formatter="formatAdcd"
/> -->
<el-table-column
label="项目类型"
align="center"
prop="projectType"
:formatter="projectTypeFormat"
min-width="120"
/>
<el-table-column
label="业务单位"
align="center"
prop="unit"
min-width="120"
/>
<el-table-column
label="项目投资概算(万元)"
align="center"
prop="total"
min-width="180"
/>
<el-table-column
label="是否属规划内"
align="center"
prop="isBelong"
:formatter="isBelongFormat"
min-width="120"
/>
<el-table-column
label="项目阶段"
align="center"
prop="projectPhase"
:formatter="projectPhaseFormat"
min-width="120"
/>
<!-- <el-table-column
label="亮灯情况"
align="center"
prop="aaa"
min-width="120"
/> -->
<!-- <el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
min-width="180"
fixed="right"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-view"
@click="viewInfo(scope.row)"
>查看</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['build:info:edit']"
>编辑</el-button
>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['build:info:remove']"
>删除</el-button
>
</template>
</el-table-column> -->
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!--查看 -->
<el-dialog
:title="viewTitle"
:visible.sync="viewOpen"
width="1200px"
append-to-body
@close="closeView"
:close-on-click-modal="false"
>
<div>查看页面</div>
</el-dialog>
</div>
</template>
<script>
import { listProjectManage } from "@/api/warn/earlyWarning";
import { regionData, codeToText, TextToCode } from "element-china-area-data";
export default {
name: "earlyWarin",
data() {
return {
//
loading: true,
//
ids: [],
//
single: true,
//
multiple: true,
//
showSearch: true,
//
total: 0,
//
infoList: [],
//
title: "",
viewTitle: "",
//
open: false,
viewOpen: false,
//
zd_projectTypeOptions: [],
//
ms_projectTypeOptions: [],
//
isBelongOptions: [],
//
projectPhaseOptions: [],
//
queryParams: {
pageNum: 1,
pageSize: 10,
ids: null,
data: {},
//
params: {
//
orderBy: "create_time",
// descasc
sortBy: "desc",
},
},
//
form: {},
//
rules: {},
proMsg: {},
//
routeList: [
{
path: "/projectStatistics/projectStatisticsSort",
routeName: "项目分类统计",
},
],
areasOptions: [],
areasOptionProps: {
emitPath: false,
checkStrictly: true, //
},
projectTypeOptionProps: {
emitPath: false,
checkStrictly: true, //
},
};
},
created() {
this.getList();
this.getDicts("major_project").then((response) => {
this.zd_projectTypeOptions = response.data;
});
this.getDicts("general_project").then((response) => {
this.ms_projectTypeOptions = response.data;
});
this.getDicts("project_phase").then((response) => {
this.projectPhaseOptions = response.data;
});
this.getDicts("whether").then((response) => {
this.isBelongOptions = response.data;
});
},
computed: {
projectTypeoptions() {
// let op = [
// {
// label: "",
// options: this.zd_projectTypeOptions,
// },
// {
// label: "",
// options: this.ms_projectTypeOptions,
// },
// ];
let op = [
{
label: "重大项目",
value: "zd, ",
children: this.zd_projectTypeOptions.map((item) => {
return {
label: item.dictLabel,
value: "zd," + item.dictValue,
};
}),
},
{
label: "面上项目",
value: "ms, ",
children: this.ms_projectTypeOptions.map((item) => {
return {
label: item.dictLabel,
value: "ms," + item.dictValue,
};
}),
},
];
// console.log(3333, op);
return op;
},
},
methods: {
// aaaa(value) {
// console.log(99999, value);
// },
formatAdcd(row) {
if (row.adcd) {
let provinceCode = row.adcd.slice(0, 2);
let cityCode = row.adcd.slice(2, 4);
let areaCode = row.adcd.slice(4, 6);
if (areaCode != "00") {
return (
codeToText[provinceCode] +
"-" +
codeToText[provinceCode + cityCode] +
"-" +
codeToText[provinceCode + cityCode + areaCode]
);
} else if (cityCode != "00") {
return (
codeToText[provinceCode] + "-" + codeToText[provinceCode + cityCode]
);
} else {
return codeToText[provinceCode];
}
}
},
//
projectTypeFormat(row, column) {
if (row.isMajor == "zd") {
return this.selectDictLabel(
this.zd_projectTypeOptions,
row.projectType
);
} else if (row.isMajor == "ms") {
return this.selectDictLabel(
this.ms_projectTypeOptions,
row.projectType
);
}
},
//
isBelongFormat(row, column) {
return this.selectDictLabel(this.isBelongOptions, row.isBelong);
},
//
projectPhaseFormat(row, column) {
return this.selectDictLabel(this.projectPhaseOptions, row.projectPhase);
},
/** 查询项目基本信息管理列表 */
getList() {
this.loading = true;
listProjectManage(this.queryParams).then((response) => {
this.infoList = response.records;
// console.log(999999, response);
this.total = response.total;
this.loading = false;
});
},
//
cancel() {
this.open = false;
this.reset();
},
//
reset() {
this.form = {};
this.resetForm("form");
},
//
resetQueryForm() {
this.queryParams = {
pageNum: 1,
pageSize: 10,
data: {},
//
params: {
//
orderBy: "create_time",
// descasc
sortBy: "desc",
},
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetQueryForm();
this.handleQuery();
},
//
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
//
viewInfo(row) {
this.proMsg = row;
console.log("proMsg", row);
this.viewOpen = true;
},
//
closeView() {
this.proMsg = {};
},
/** 修改按钮操作 */
handleUpdate(row) {
// const id = row.id || this.ids;
this.routeList[0].routeName = row.projectName;
this.routeList.push({
path: "/evaluationEarlyWarning/earlyWarningManage/warning/options",
routeName: row.proCode,
isEdit: true,
});
//
this.$store.commit("setRouteList", JSON.stringify(this.routeList));
//
this.$router.push({
path:
"/evaluationEarlyWarning/earlyWarningManage/warning/options?baseDataId=" +
row.id,
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
if (ids) {
this.$confirm("是否删除选中的数据?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(function () {
return delInfo(ids);
})
.then(() => {
this.getList();
this.msgSuccess("删除成功");
})
.catch(function () {});
} else {
this.$message.warning("请选择要删除的数据!!");
}
},
},
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/dialog.scss";
::v-deep {
.el-dialog {
margin-top: 2vh !important;
}
.el-dialog__body {
transform: scale(1);
}
.el-select-dropdown {
.el-select-dropdown__list {
display: flex;
.el-select-group__wrap {
padding-bottom: 0;
}
.el-select-group__wrap::after {
display: none;
}
}
}
}
</style>

37
jwtech-admin-page/src/views/projectStatistics/projectStatisticsSort/index.vue

@ -0,0 +1,37 @@
<template>
<div class="app-container">
<!-- 面包屑 -->
<el-breadcrumb separator="/" style="margin-bottom: 20px">
<el-breadcrumb-item
v-for="(item, index) in routeList"
:key="item + index"
:to="{ path: item.path }"
>{{ item.routeName }}</el-breadcrumb-item
>
</el-breadcrumb>
<dataCharts />
<list />
</div>
</template>
<script>
import dataCharts from "./components/dataCharts.vue";
import list from "./components/list.vue";
export default {
components: {
dataCharts,
list,
},
data() {
return {
//
routeList: [
{
path: "/projectStatistics/projectStatisticsSort",
routeName: "项目分类统计",
},
],
};
},
};
</script>

8
jwtech-admin-page/vue.config.js

@ -31,15 +31,15 @@ module.exports = {
devServer: {
// host: '0.0.0.0',
// host: '192.168.1.104',
// host: '127.0.0.1',
host: '192.168.2.107',
host: '127.0.0.1',
// host: '192.168.2.107',
port: 80,
open: true,
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
// target: "http://127.0.0.1:18082",
target: "http://192.168.2.108:18080",
target: "http://127.0.0.1:18082",
// target: "http://192.168.2.108:18080",
// target: "http://192.168.1.20:8084",
changeOrigin: true,
pathRewrite: {

Loading…
Cancel
Save