中建五局-质量管理模块新增字段/新增整改排名页面/人员管理页面

This commit is contained in:
jxj_yjl 2023-04-23 14:50:59 +08:00
parent 1be73a29e9
commit 35a3ef9e55
8 changed files with 857 additions and 38 deletions

View File

@ -1,4 +1,4 @@
var COMPANY = ''; //通用
// var COMPANY = ''; //通用
// var COMPANY='zhongjian'; //中建,和沃尔对接的插件版用这个企业
// var COMPANY='hezhan'; //合展-宿迁
// var COMPANY='nanchang'; //南昌地铁、衢州
@ -10,7 +10,8 @@ var COMPANY = ''; //通用
// COMPANY = 'hengtong'//瑞士恒通
// COMPANY = 'yunlian'//云联万物
// COMPANY = 'neimenggu'//内蒙古项目
// COMPANY = 'zjsj'//中建四局
// COMPANY = 'zjsj'//中建四局
COMPANY = 'zjwj'//中建五局

View File

@ -169,3 +169,22 @@ export const addMakeAnAppointmentItem = data=>post('/xmgl/weight/weighBookVehicl
export const editMakeAnAppointmentItem = data=>post('/xmgl/weight/weighBookVehicleInfo/edit',data)
export const deleteMakeAnAppointmentItem = data=>post('/xmgl/weight/weighBookVehicleInfo/delete',data)
export const weighTypeList = data=>get('/xmgl/weight/weighBookVehicleInfo/weighingType',data)
//整改排名
export const getDepartmentListApi = data=>get('/xmgl/qualityInspectionRecord/department/rectified/rank',data)
//人员管理_部门
export const addDepartmentInfoApi = data=>post('/xmgl/departmentInfo/add',data)
export const deleteDepartmentInfoApi = data=>post('/xmgl/departmentInfo/delete',data)
export const editDepartmentInfoApi = data=>post('/xmgl/departmentInfo/edit',data)
export const getDepartmentInfoListApi = data=>post('/xmgl/departmentInfo/getDepartmentInfoList',data)
//人员管理_人员
export const addSystemUserApi = data=>post('/xmgl/systemUser/zjwj/add',data)
export const deletSystemUserApi = data=>post('/xmgl/systemUser/zjwj/delete',data)
export const editSystemUserApi = data=>post('/xmgl/systemUser/zjwj/update',data)
export const getSystemUserPageApi = data=>get('/xmgl/systemUser/zjwj/list',data)

View File

@ -81,6 +81,7 @@ if (process.env.NODE_ENV == 'development') {
// axios.defaults.baseURL = 'http://192.168.34.221:12350' //金林湾本地
// axios.defaults.baseURL = 'http://192.168.34.122:8070' //彭洁本地
axios.defaults.baseURL = 'http://192.168.34.221:8070' //演示平台郭圣雄本地
// axios.defaults.baseURL = 'http://192.168.34.221:30000' //中建五局郭圣雄本地
// axios.defaults.baseURL = 'http://101.43.164.214:11111' //百色线上
// axios.defaults.baseURL = 'http://101.43.164.214:12345/'//内蒙古线上
// axios.defaults.baseURL = 'http://121.196.214.246/api/'//金林湾线上新

View File

@ -760,6 +760,16 @@ const routes2 = [
name: '质量管理_分部分项工程',
component: resolve => require(['@/views/projectFront/quality/subdivisionalWorks.vue'], resolve)
},
{
path: '/project/quality/rectificationRanking', //质量管理 -- 整改排名
name: '质量管理_整改排名',
component: resolve => require(['@/views/projectFront/quality/rectificationRanking.vue'], resolve)
},
{
path: '/project/quality/qualitypersonnel', //质量管理 -- 整改排名
name: '质量管理_人员管理',
component: resolve => require(['@/views/projectFront/quality/qualitypersonnel.vue'], resolve)
},
{
path: '/project/quality/materialManagement', //质量管理 -- 物料管理 --称重信息
name: '物料管理_称重信息',
@ -2544,6 +2554,7 @@ const routes2 = [
name: '质量管理_数据中心',
component: resolve => require(['@/views/projectFront/quality/recordsCenter.vue'], resolve)
},
// 材料管理
{
path: '/projectQu/materialManage/constructionTeamManage',

View File

@ -87,8 +87,10 @@ export default new Vuex.Store({
// FILEURL:'http://'+"47.97.202.104:6023"+'/image/',//正式
// UPLOADURL: 'http://182.90.224.147:100/upload/image',//演示平台
// FILEURL: 'http://182.90.224.147:100/image/',//演示平台
UPLOADURL: 'http://192.168.34.221:8070/upload/image',//郭圣雄本地
FILEURL: 'http://192.168.34.221:8070/image/',//郭圣雄本地
UPLOADURL: 'http://192.168.34.221:8070/upload/image',//演示平台郭圣雄本地
FILEURL: 'http://192.168.34.221:8070/image/',//演示平台郭圣雄本地
// UPLOADURL: 'http://192.168.34.221:30000/upload/image',//郭圣雄本地
// FILEURL: 'http://192.168.34.221:30000/image/',//郭圣雄本地
// UPLOADURL: 'http://101.43.164.214:12345/upload/image',//内蒙古
// FILEURL: 'http://101.43.164.214:12345/image/',//内蒙古

View File

@ -0,0 +1,535 @@
<template>
<div class="fullHeight">
<div class="block fullHeight">
<div class="system-left">
<div class="pageTitle">
部门名称
<el-button
type="primary"
plain
size="small"
style="float: right; margin-top: -2px"
@click="add(1)"
>
新增部门
</el-button>
</div>
<vue-scroll class="treeList">
<div
style="padding-top: 10px"
v-for="(item, index) in depart"
:key="index"
>
<div
class="menuDiv"
:class="checkedId == item.id ? 'active:' : ''"
@click="next(index, item)"
>
<span style="margin-left: 20px">{{ item.departmentName }}</span>
<span class="custom-tree-node">
<span class="operateBtns">
<i
class="el-icon-edit"
@click.stop="edit(item)"
style="color: #5181f6"
></i>
<i
class="el-icon-delete"
@click.stop="deleteData(item)"
style="color: red"
></i>
</span>
</span>
</div>
</div>
</vue-scroll>
</div>
<div class="system-right">
<div class="pageTitle">
人员信息
<el-button
type="primary"
size="small"
style="margin-left: 40px"
@click="add(2)"
>
人员录入
</el-button>
</div>
<div class="table_box" style="margin: 13px">
<el-table height="552px" :data="threeData" class="tables">
<el-table-column prop="account" label="账号" align="center">
</el-table-column>
<el-table-column
prop="realName"
label="姓名"
align="center"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
prop="roleName"
label="角色"
align="center"
></el-table-column>
<el-table-column
prop="userTel"
label="手机号"
align="center"
></el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="scope">
<el-button
@click="edit2(scope.row, 3)"
type="text"
size="small"
icon="el-icon-edit"
>
<span style="font-size: 14px">编辑</span>
</el-button>
<el-button
@click="del1(scope.row, 3)"
type="text"
size="small"
style="color: red"
icon="el-icon-delete"
>
<span style="font-size: 14px; margin-right: 0px !important"
>删除</span
>
</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
</div>
<!-- 新增部门弹框 -->
<el-dialog
:modal-append-to-body="false"
class="dialig"
:title="title"
:visible.sync="dialogVisible"
width="667px"
>
<div class="dialog_content">
<el-form
ref="form"
:model="dialogdata"
:rules="rules"
label-width="150px"
size="medium"
>
<el-form-item label="部门名称" prop="departmentName">
<el-input style="width: 350px" v-model="dialogdata.departmentName"></el-input>
</el-form-item>
<div class="dialog-footer">
<el-button
@click="dialogVisible = false"
size="medium"
icon="el-icon-circle-close"
> </el-button
>
<el-button
type="primary"
@click="addSave"
size="medium"
icon="el-icon-circle-check"
> </el-button
>
</div>
</el-form>
</div>
</el-dialog>
<!-- 新增人员弹框 -->
<el-dialog
class="dialig"
:title="title"
:modal-append-to-body="false"
:visible.sync="dialogVisible3"
width="667px"
>
<div class="dialog_content">
<el-form
ref="form2"
:model="dialogTable"
label-width="140px"
:rules="rules2"
size="medium"
>
<el-form-item label="账号" prop="account">
<el-input
v-model="dialogTable.account"
style="width: 350px"
></el-input>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input
v-model="dialogTable.password"
style="width: 350px"
></el-input>
</el-form-item>
<el-form-item label="角色" prop="roleId">
<el-select
style="width: 350px"
v-model="dialogTable.roleId"
filterable
:placeholder="$t('message.personnelAccess.juese')"
>
<el-option
v-for="item in roleList"
:key="item.roleId"
:label="item.roleName"
:value="item.roleId"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="姓名" prop="realName">
<el-input
style="width: 350px"
v-model="dialogTable.realName"
></el-input>
</el-form-item>
<el-form-item label="手机号" prop="userTel">
<el-input
style="width: 350px"
v-model="dialogTable.userTel"
></el-input>
</el-form-item>
</el-form>
<div class="dialog-footer">
<el-button
@click="dialogVisible3 = false"
size="medium"
icon="el-icon-circle-close"
> </el-button
>
<el-button
type="primary"
size="medium"
icon="el-icon-circle-check"
@click="addPersonnel"
> </el-button
>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import {
addDepartmentInfoApi, //
deleteDepartmentInfoApi,
editDepartmentInfoApi,
getDepartmentInfoListApi,
addSystemUserApi,
deletSystemUserApi,
editSystemUserApi,
getSystemUserPageApi,//
} from "@/assets/js/api/quality";
import {
getBaseRoleListApi,
} from "@/assets/js/api/configManage";
export default {
data() {
return {
title: '',
dialogdata: {
departmentName: "",//
},
rules: {},
threeData: [],
dialogVisible: false,
depart: [],
//------
dialogVisible3: false,
dialogTable: {
account: '',
password: '',
roleId: '',
realName: '',
userTel: '',
departmentId: '',
},
rules2: {
account: [{
required: true,
message: '请输入账号',
trigger: "blur"
}],
password: [{
required: true,
message: '请输入密码',
trigger: "blur"
}],
realName: [{
required: true,
message: '请输入姓名',
trigger: "blur"
}],
},
roleList: [],
pagInfo: {
current: 1, //
pages: 10, //
total: 0 //
},
departmentId: '',
currentTwo: -1,
current: 0,
checkedId: 1,
};
},
mounted() {
this.getList()
},
methods: {
next(index, data) {
console.log('切换index', index);
this.departmentId = data.id;
this.checkedId = data.id
this.getData();
},
//
getRoleList() {
getBaseRoleListApi({ projectSn: this.$store.state.projectSn }).then(
(result) => {
this.roleList = result.result;
}
);
},
//
getList() {
getDepartmentInfoListApi({
projectSn: this.$store.state.projectSn,
}).then((res) => {
this.depart = res.result.list
console.log('this.depart', this.depart);
this.departmentId = res.result.list[0].id
this.getData()
})
},
//
getData() {
getSystemUserPageApi({
projectSn: this.$store.state.projectSn,
// current:this.pagInfo.current,
// total:this.pagInfo.total,
// pages:this.pagInfo.pages,
departmentId: this.departmentId
}).then((res) => {
console.log('res===', res);
this.threeData = res.result
})
},
//
add(type) {
if (type == 1) {
this.dialogVisible = true
this.title = '新增部门'
this.dialogdata = {}
}
if (type == 2) {
this.dialogVisible3 = true
this.title = '新增人员'
this.getRoleList()
this.dialogTable = {}
}
},
//
edit(val) {
this.dialogVisible = true
this.title = '编辑部门'
this.dialogdata = JSON.parse(JSON.stringify(val))
},
//
edit2(val) {
this.dialogVisible3 = true
this.title = '编辑人员'
this.dialogTable = JSON.parse(JSON.stringify(val))
},
///
addSave() {
let params = JSON.parse(JSON.stringify(this.dialogdata));
params.projectSn = this.$store.state.projectSn;
this.$refs.form.validate((valid) => {
if (valid) {
if (this.title == "新增部门") {
addDepartmentInfoApi(params).then((res) => {
this.$message.success("新增成功");
this.dialogVisible = false;
this.getList()
});
} else if (this.title == "编辑部门") {
editDepartmentInfoApi(params).then((res) => {
this.$message.success("编辑成功");
this.dialogVisible = false;
this.getList()
});
}
}
});
},
//
deleteData(val) {
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
deleteDepartmentInfoApi({ id: val.id }).then((res) => {
this.$message({
type: "success",
message: "删除成功!",
});
this.getList()
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
del1(val) {
this.$confirm("此操作将永久删除, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
deletSystemUserApi({ userId: val.userId }).then((res) => {
this.$message({
type: "success",
message: "删除成功!",
});
this.getData()
});
})
.catch(() => {
this.$message({
type: "info",
message: "已取消删除",
});
});
},
///
addPersonnel() {
let params = JSON.parse(JSON.stringify(this.dialogTable));
params.projectSn = this.$store.state.projectSn;
params.departmentId = this.departmentId
this.$refs.form2.validate((valid) => {
if (valid) {
if (this.title == "新增人员") {
addSystemUserApi(params).then((res) => {
this.$message.success("新增成功");
this.dialogVisible3 = false;
this.getData()
});
} else if (this.title == "编辑人员") {
editSystemUserApi(params).then((res) => {
this.$message.success("编辑成功");
this.dialogVisible3 = false;
this.getData()
});
}
}
});
},
}
};
</script>
<style scoped lang="less">
.el-button--small,
.el-button--small.is-round {
padding: 6px 9px;
}
.block {
overflow: hidden;
height: calc(100% + 50px);
background-color: #f3f5fd;
.system-left {
float: left;
width: 330px;
padding: 20px 15px;
height: calc(100% - 40px);
background-color: white;
.treeList {
background-color: rgba(216, 216, 216, 0.2);
height: calc(100% - 42px) !important;
}
li {
cursor: pointer;
font-size: 16px;
line-height: 32px;
letter-spacing: 1px;
font-weight: bold;
.clickName {
.imgbox {
display: inline-block;
margin: 0 6px 0 13px;
color: black;
font-size: 14px;
opacity: 0.5;
}
}
}
li:hover,
.active {
background-color: rgba(81, 129, 246, 0.14);
color: @--color-primary;
}
#child {
li {
font-size: 15px;
padding-left: 39px;
font-weight: normal;
}
}
}
.system-right {
float: right;
margin-left: 20px;
width: calc(100% - 360px - 20px - 30px);
height: calc(100% - 40px);
background-color: white;
padding: 20px 15px;
}
.menuDiv {
cursor: pointer;
height: 30px;
line-height: 30px;
text-align: left;
padding: 5px 5px;
}
.menuDiv:hover {
background-color: rgba(81, 129, 246, 0.14);
color: @--color-primary;
}
.operateBtns {
float: right;
i {
margin-right: 10px;
cursor: pointer;
}
}
.active {
// background: linear-gradient(270deg, white, #b7d8ff 100%);
background-color: rgba(81, 129, 246, 0.14);
color: @--color-primary;
}
}
</style>

View File

@ -38,6 +38,17 @@
>{{ $t('message.quality.toCheck') }}:
<span class="value">{{ statisticsValue.verificationNum }}</span></span
>
<!-- 中建五局添加字段 -->
<span v-if="COMPANY == 'zjwj'"
>整改率:
<span class="value">{{
statisticsValue.rectificationRatio
}}%</span></span
>
<span v-if="COMPANY == 'zjwj'"
>闭合率:
<span class="value">{{ statisticsValue.completeRatio }}%</span></span
>
</div>
<el-form
:inline="true"
@ -170,6 +181,16 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="区域" prop="regionId" v-if="COMPANY == 'zjwj'">
<el-cascader
v-model="formInline.regionId"
clearable
ref="formRegion1"
:options="checkPointList"
:props="checkPointProps"
@change="changeRegion"
></el-cascader>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="onSubmit">{{
$t('message.quality.inquire')
@ -315,6 +336,7 @@
>{{ $t('message.quality.qualityProblem') }}</el-radio-button
>
<el-radio-button
v-if="COMPANY != 'zjwj'"
:label="2"
v-show="type == 'add' || (type == 'detail' && recordType == 2)"
>{{ $t('message.quality.recordsOfTheFebruary') }}</el-radio-button
@ -330,6 +352,20 @@
:model="addForm1"
label-width="120px"
>
<!-- 图纸定位 -->
<el-form-item
v-if="COMPANY != 'longguang'"
:label="$t('message.quality.drawingPositioning')"
>
<el-button
:disabled="type == 'detail'"
type="text"
icon="el-icon-location-information"
@click="drawingPositionBtn"
>{{ $t('message.quality.positionOnTheDrawing') }}</el-button
>
<!-- {{ $t('message.quality.selectDrawings') }} -->
</el-form-item>
<!-- 检查部位-->
<el-form-item
:label="$t('message.quality.checkPoint')"
@ -584,20 +620,9 @@
>
</el-date-picker>
</el-form-item>
<!-- <el-form-item
v-if="COMPANY != 'longguang'"
:label="$t('message.quality.drawingPositioning')"
>
<el-button
:disabled="type == 'detail'"
type="text"
icon="el-icon-location-information"
@click="drawingPositionBtn"
>{{ $t('message.quality.positionOnTheDrawing') }}</el-button
>
{{ $t('message.quality.selectDrawings') }}
</el-form-item> -->
<el-form-item
v-if="COMPANY != 'zjwj'"
:label="$t('message.quality.subContractor')"
prop="enterpriseName"
>
@ -643,9 +668,9 @@
>
<el-option
v-for="item in crewList"
:key="item.userId+''"
:key="item.userId "
:label="item.workerName"
:value="item.userId+''"
:value="item.userId"
>
<!-- <span style="float: left">{{ item.workerName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px"
@ -674,9 +699,9 @@
>
<el-option
v-for="item in crewList"
:key="item.userId+''"
:key="item.userId + ''"
:label="item.workerName"
:value="item.userId+''"
:value="item.userId + ''"
>
<!-- <span style="float: left">{{ item.workerName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px"
@ -705,9 +730,9 @@
>
<el-option
v-for="item in crewList"
:key="item.userId+''"
:key="item.userId + ''"
:label="item.workerName"
:value="item.userId+''"
:value="item.userId + ''"
>
<!-- <span style="float: left">{{ item.workerName }}</span>
<span style="float: right; color: #8492a6; font-size: 13px"
@ -736,9 +761,9 @@
>
<el-option
v-for="item in crewList"
:key="item.userId+''"
:key="item.userId + ''"
:label="item.workerName"
:value="item.userId+''"
:value="item.userId + ''"
>
<!-- <span style="float: left">{{ item.workerName }}</span>
<span
@ -1214,7 +1239,7 @@
id="mapContent"
:style="{
transform: 'scale(' + multiples + ')',
transformOrigin: 'top left'
transformOrigin: 'top left',
}"
>
<img
@ -1231,7 +1256,7 @@
:key="index"
:style="{
left: item.coordinateX + 'px',
top: item.coordinateY + 'px'
top: item.coordinateY + 'px',
}"
>
<el-popover placement="top" width="auto" trigger="click">
@ -1373,6 +1398,7 @@ import { VueCropper } from 'vue-cropper'
import {
getSubdivisionProjectApi //
} from '@/assets/js/api/quality'
var VUE = null
export default {
components: {
@ -1391,7 +1417,8 @@ export default {
recordStatus: '',
level: '',
status: '',
urgentLevel: ''
urgentLevel: '',
regionId:'',
},
type: 'add',
pageNo: 1,
@ -1406,7 +1433,9 @@ export default {
rectificationNum: 0,
reviewNum: 0,
totalNum: 0,
verificationNum: 0
verificationNum: 0,
rectificationRatio: 0,//
completeRatio: 0,//
},
tableData: [], //
recordType: 1, // 12
@ -1510,6 +1539,7 @@ export default {
this.onSubmit()
this.COMPANY = COMPANY
this.getProgressListData()
this.getPositionList()
},
computed: {
isJSON() {
@ -1529,7 +1559,7 @@ export default {
}
}
},
mounted() {},
mounted() { },
methods: {
checkSubListData(val) {
console.log('一级菜单改动了 ', val)
@ -1722,7 +1752,7 @@ export default {
},
//
showDatadetails(val) {
console.log('查看详情====',val)
console.log('查看详情====', val)
this.selectRectifyRecordList(val.id)
this.hideUpload = true
this.addBtn(1)
@ -1812,6 +1842,7 @@ export default {
data.pageNo = this.pageNo
data.pageSize = this.pageSize
getInspectionRecordListApi(data).then((res) => {
console.log('res----', res);
if (res.code == 200) {
this.statisticsValue = res.result.total
this.tableData = res.result.page.records
@ -1889,7 +1920,7 @@ export default {
projectSn: this.projectSn
}
getQualityRegionListApi(data).then((res) => {
// console.log(res);
console.log('res=================', res);
if (res.code == 200) {
this.checkPointList = res.result
}
@ -1945,7 +1976,6 @@ export default {
}
getProjectChilderSystemUserListApi(data).then((res) => {
if (res.code == 200) {
console.log(123, res.result)
this.crewList = res.result
}
})
@ -2179,9 +2209,9 @@ export default {
})
},
//
beforeAvatarUpload(file) {},
beforeAvatarUpload(file) { },
editPoint(item) {},
editPoint(item) { },
//
removePoint(item, index) {
let arr = JSON.parse(JSON.stringify(this.pointList))
@ -2200,6 +2230,7 @@ export default {
savePointBtn() {
this.showPositioning = false
this.createdCoord = false
},
//
cancleEvent() {
@ -2250,6 +2281,7 @@ export default {
fileUrl.push(obj)
}
data.measurePoints = pointArr.join(',')
console.log('data.measurePoints=============', data.measurePoints);
data.notifyPerson = this.addForm1.notifyPerson.join(',')
data.imageUrl = imgUrl.join(',')
data.fileUrl = fileUrl.join(',')
@ -2299,6 +2331,7 @@ export default {
this.fileList4 = []
this.pointList = []
this.recordType = 1
this.mapUrl = ''
this.pageNo = 1
this.onSubmit()
}
@ -2320,7 +2353,7 @@ export default {
},
close() {
this.mapUrl = ''
// this.mapUrl = ''
this.fileList1 = []
this.fileList2 = []
this.fileList3 = []
@ -2329,9 +2362,9 @@ export default {
this.$refs.addForm2.resetFields() //
this.hideUpload = false
},
submit() {},
submit() { },
handleExceed() {}
handleExceed() { }
}
}
</script>

View File

@ -0,0 +1,217 @@
<template>
<div class="reportCenter flex">
<div class="left whiteBlock">
<vue-scroll style="width: 100%">
<div
v-for="item in listData"
:key="item.id"
class="list_title"
:class="checkedId == item.id ? 'checked_color' : 'nocheck'"
@click="checkedId = item.id"
>
<span class="list_name">{{ item.name }}</span>
</div>
</vue-scroll>
</div>
<div class="right whiteBlock">
<div class="chart" ref="ageChart"></div>
</div>
</div>
</template>
<script>
import {
getDepartmentListApi
} from '@/assets/js/api/quality.js'
import echarts from 'echarts4';;
export default {
data() {
return {
projectSn: "",
userEnterpriseId: '',
listData: [
{ id: 1, name: '整改排名' },
],
checkedId: "",
};
},
created() {
this.projectSn = this.$store.state.projectSn;
this.checkedId = this.listData[0].id;
this.getListData();
},
methods: {
getListData() {
let data = {
projectSn: this.projectSn,
};
getDepartmentListApi(data).then((res) => {
console.log('res---------', res);
if (res.code == 200) {
var Data = res.result;
var yData2 = []
var yData3 = []
Data.forEach((element) => {
yData2.push(element.rectifiedNumber);
yData3.push(element.departmentName);
});
this.createdBarCharts(
yData2,
yData3,
// yData2 = [10],
// yData3 = [''],
this.$refs.ageChart,
);
} else {
this.$message.error(res.message);
}
});
},
//---
createdBarCharts(yData2, yData3, el) {
console.log('yData2', yData2);
let that = this;
let ageChart = echarts.init(el);
ageChart.clear();
let option = {
grid: {
top: 40,
left: 0,
bottom: 5,
right: 20,
containLabel: true,
},
color: ["#5CE2F6", "#5181F6", '#8EBDD2'],
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
legend: {
show: true,
align: "left",
top: 5,
left: 0,
itemWidth: 13,
itemHeight: 5,
textStyle: {
color: "#9fa2ad",
},
},
xAxis: [
{
type: "category",
data: yData3,
boundaryGap: true,
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
color: "#9fa2ad",
fontSize: 12,
},
},
],
yAxis: {
type: "value",
axisTick: {
show: false,
},
axisLine: {
show: false,
},
splitLine: {
lineStyle: {
type: "dashed",
color: "rgba(231, 233, 243, 1)",
},
},
axisLabel: {
color: "#9fa2ad",
},
},
series: [
{
name: '部门',
type: "bar",
data: yData2,
barWidth: 35,
barGap: 0.1,
},
// {
// name: legendData[0],
// type: "bar",
// data: yData1,
// barWidth: 35,
// },
// {
// name: legendData[2],
// type: "bar",
// data: yData3,
// barWidth: 35,
// barGap: 0.1,
// },
],
};
ageChart.setOption(option);
},
},
};
</script>
<style lang="less" scoped>
.flex {
display: flex;
}
.flex2 {
display: flex;
align-content: center;
}
.flex3 {
display: flex;
align-content: center;
justify-content: space-between;
}
.reportCenter {
width: 100%;
height: 100%;
box-sizing: border-box;
.left {
width: 300px;
box-sizing: border-box;
margin-right: 15px;
padding: 5px 0;
.list_title {
width: 100%;
line-height: 43px;
cursor: pointer;
box-sizing: border-box;
}
.checked_color {
border-left: 3px solid #5181f6;
background: #edf2fe;
}
.nocheck {
padding-left: 3px;
}
.list_name {
padding: 0 15px;
}
}
.right {
width: calc(100% - 300px);
box-sizing: border-box;
padding: 15px 20px;
.chart {
width: 100%;
height: 100%;
}
}
}
</style>