Compare commits
No commits in common. "7a6c1c455caa66c5b43fc4bade316eb887254ae2" and "a5a2ffbb318476f7d008551c6bde049f85088864" have entirely different histories.
7a6c1c455c
...
a5a2ffbb31
|
|
@ -12,7 +12,6 @@
|
||||||
"axios": "^0.24.0",
|
"axios": "^0.24.0",
|
||||||
"blueimp-md5": "^2.19.0",
|
"blueimp-md5": "^2.19.0",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"echarts": "^5.3.3",
|
|
||||||
"element-plus": "^2.2.6",
|
"element-plus": "^2.2.6",
|
||||||
"moment": "^2.29.1",
|
"moment": "^2.29.1",
|
||||||
"vue": "^3.0.0",
|
"vue": "^3.0.0",
|
||||||
|
|
@ -5957,20 +5956,6 @@
|
||||||
"safer-buffer": "^2.1.0"
|
"safer-buffer": "^2.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/echarts": {
|
|
||||||
"version": "5.3.3",
|
|
||||||
"resolved": "https://registry.npmjs.org/echarts/-/echarts-5.3.3.tgz",
|
|
||||||
"integrity": "sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==",
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": "2.3.0",
|
|
||||||
"zrender": "5.3.2"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/echarts/node_modules/tslib": {
|
|
||||||
"version": "2.3.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
|
|
||||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
|
|
||||||
},
|
|
||||||
"node_modules/ee-first": {
|
"node_modules/ee-first": {
|
||||||
"version": "1.1.1",
|
"version": "1.1.1",
|
||||||
"resolved": "https://registry.npmmirror.com/ee-first/download/ee-first-1.1.1.tgz",
|
"resolved": "https://registry.npmmirror.com/ee-first/download/ee-first-1.1.1.tgz",
|
||||||
|
|
@ -15716,19 +15701,6 @@
|
||||||
"resolved": "https://registry.npmmirror.com/yallist/download/yallist-2.1.2.tgz",
|
"resolved": "https://registry.npmmirror.com/yallist/download/yallist-2.1.2.tgz",
|
||||||
"integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
|
"integrity": "sha1-HBH5IY8HYImkfdUS+TxmmaaoHVI=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
|
||||||
"node_modules/zrender": {
|
|
||||||
"version": "5.3.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/zrender/-/zrender-5.3.2.tgz",
|
|
||||||
"integrity": "sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==",
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": "2.3.0"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"node_modules/zrender/node_modules/tslib": {
|
|
||||||
"version": "2.3.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
|
|
||||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
|
@ -20435,22 +20407,6 @@
|
||||||
"safer-buffer": "^2.1.0"
|
"safer-buffer": "^2.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"echarts": {
|
|
||||||
"version": "5.3.3",
|
|
||||||
"resolved": "https://registry.npmjs.org/echarts/-/echarts-5.3.3.tgz",
|
|
||||||
"integrity": "sha512-BRw2serInRwO5SIwRviZ6Xgm5Lb7irgz+sLiFMmy/HOaf4SQ+7oYqxKzRHAKp4xHQ05AuHw1xvoQWJjDQq/FGw==",
|
|
||||||
"requires": {
|
|
||||||
"tslib": "2.3.0",
|
|
||||||
"zrender": "5.3.2"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": {
|
|
||||||
"version": "2.3.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
|
|
||||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"ee-first": {
|
"ee-first": {
|
||||||
"version": "1.1.1",
|
"version": "1.1.1",
|
||||||
"resolved": "https://registry.npmmirror.com/ee-first/download/ee-first-1.1.1.tgz",
|
"resolved": "https://registry.npmmirror.com/ee-first/download/ee-first-1.1.1.tgz",
|
||||||
|
|
@ -28501,21 +28457,6 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
|
||||||
"zrender": {
|
|
||||||
"version": "5.3.2",
|
|
||||||
"resolved": "https://registry.npmjs.org/zrender/-/zrender-5.3.2.tgz",
|
|
||||||
"integrity": "sha512-8IiYdfwHj2rx0UeIGZGGU4WEVSDEdeVCaIg/fomejg1Xu6OifAL1GVzIPHg2D+MyUkbNgPWji90t0a8IDk+39w==",
|
|
||||||
"requires": {
|
|
||||||
"tslib": "2.3.0"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"tslib": {
|
|
||||||
"version": "2.3.0",
|
|
||||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
|
|
||||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -11,7 +11,6 @@
|
||||||
"axios": "^0.24.0",
|
"axios": "^0.24.0",
|
||||||
"blueimp-md5": "^2.19.0",
|
"blueimp-md5": "^2.19.0",
|
||||||
"core-js": "^3.6.5",
|
"core-js": "^3.6.5",
|
||||||
"echarts": "^5.3.3",
|
|
||||||
"element-plus": "^2.2.6",
|
"element-plus": "^2.2.6",
|
||||||
"moment": "^2.29.1",
|
"moment": "^2.29.1",
|
||||||
"vue": "^3.0.0",
|
"vue": "^3.0.0",
|
||||||
|
|
|
||||||
|
|
@ -1,141 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="echartsPie" ref="echartsPie">
|
|
||||||
<div :id="id" class="echarts_box" style="width: 450px;height: 100%;"></div>
|
|
||||||
<!-- <div class="list_box">-->
|
|
||||||
<!-- <p>总人数：{{ getTotalNumber }}</p>-->
|
|
||||||
<!-- <p v-for="(item,index) in dataList" :key="index">{{ item.name }}：{{ item.value }}人</p>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import * as echarts from 'echarts'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "echartsPie",
|
|
||||||
props: {
|
|
||||||
// 标识，同页面不能相同
|
|
||||||
id: {
|
|
||||||
type: String
|
|
||||||
},
|
|
||||||
// 是否要上角图例
|
|
||||||
isLegend: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
// 是否为满圆
|
|
||||||
isRadius: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
// 数据列表
|
|
||||||
dataList: {
|
|
||||||
type: Array,
|
|
||||||
default: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
myChart: null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.initEcharts();
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
getTotalNumber() {
|
|
||||||
let total = this.dataList.reduce((prev, item) => {
|
|
||||||
prev += item.value
|
|
||||||
return prev
|
|
||||||
}, 0)
|
|
||||||
return total;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
// 获取配置
|
|
||||||
getOption() {
|
|
||||||
// 指定图表的配置项和数据
|
|
||||||
let option = {
|
|
||||||
tooltip: {
|
|
||||||
trigger: 'item'
|
|
||||||
},
|
|
||||||
series: [
|
|
||||||
{
|
|
||||||
name: '统计',
|
|
||||||
type: 'pie',
|
|
||||||
center: ['45%', '55%'],
|
|
||||||
// radius: ['40%', '70%'],
|
|
||||||
avoidLabelOverlap: false,
|
|
||||||
label: {
|
|
||||||
show: false,
|
|
||||||
position: 'center'
|
|
||||||
},
|
|
||||||
emphasis: {
|
|
||||||
label: {
|
|
||||||
show: true,
|
|
||||||
fontSize: '40',
|
|
||||||
fontWeight: 'bold'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
labelLine: {
|
|
||||||
show: false
|
|
||||||
},
|
|
||||||
data: this.dataList
|
|
||||||
}
|
|
||||||
]};
|
|
||||||
if (this.isLegend) {
|
|
||||||
option.legend = {
|
|
||||||
type: 'scroll',
|
|
||||||
orient: 'vertical',
|
|
||||||
right: 10,
|
|
||||||
top: 20,
|
|
||||||
bottom: 20,
|
|
||||||
}
|
|
||||||
}
|
|
||||||
option.series[0].radius = this.isRadius?'80%':['50%', '80%'];
|
|
||||||
return option;
|
|
||||||
},
|
|
||||||
// 初始化图表
|
|
||||||
initEcharts() {
|
|
||||||
this.$nextTick(()=>{
|
|
||||||
this.myChart = echarts.init(document.getElementById(this.id));
|
|
||||||
// 使用刚指定的配置项和数据显示图表。
|
|
||||||
this.myChart.setOption(this.getOption());
|
|
||||||
});
|
|
||||||
let that = this;
|
|
||||||
window.addEventListener('resize', function () {
|
|
||||||
console.log("addEventListener");
|
|
||||||
// 让我们的图表调用 resize这个方法
|
|
||||||
that.$nextTick(()=>{
|
|
||||||
that.myChart.resize();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 更新图表
|
|
||||||
updateEcharts() {
|
|
||||||
this.myChart.setOption(this.getOption(),true);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="scss">
|
|
||||||
#echartsPie {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
background: #fff;
|
|
||||||
.echarts_box {
|
|
||||||
flex-shrink: 0;
|
|
||||||
}
|
|
||||||
.list_box {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
overflow-y: scroll;
|
|
||||||
padding: 50px 50px;
|
|
||||||
box-sizing:border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,203 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<view style="display: flex;height: 100%;justify-content: space-around;">
|
<div>项目团队</div>
|
||||||
|
|
||||||
<div class="left" ref="leftRef" style="width: 50%;height: 100%;">
|
|
||||||
<div style="margin: 0 0 26px 0;display: flex;flex-direction: row;justify-content: space-between" ref="left_title_Ref">
|
|
||||||
<p style="text-align:center; 'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266">项目团队</p>
|
|
||||||
<el-button style="" type="primary" >新增成员</el-button>
|
|
||||||
</div>
|
|
||||||
<el-table
|
|
||||||
ref="tableRef"
|
|
||||||
class="projectTable"
|
|
||||||
:height="tableHeight"
|
|
||||||
:data="tableData">
|
|
||||||
<el-table-column prop="staffFullname" label="姓名" min-width="25%"> </el-table-column>
|
|
||||||
<el-table-column prop="projectStaffPosition" label="职位" min-width="35%">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column fixed="right" label="操作" min-width="40%">
|
|
||||||
<template #default="scope">
|
|
||||||
<span>
|
|
||||||
<el-button
|
|
||||||
@click.prevent="deleteRow(scope.$index, tableData)"
|
|
||||||
type="text"
|
|
||||||
size="midium"
|
|
||||||
>
|
|
||||||
修改
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
@click.prevent="deleteRow(scope.$index, tableData)"
|
|
||||||
type="text"
|
|
||||||
size="midium"
|
|
||||||
>
|
|
||||||
交接
|
|
||||||
</el-button>
|
|
||||||
<el-button
|
|
||||||
@click.prevent="deleteRow(scope.$index, tableData)"
|
|
||||||
type="text"
|
|
||||||
size="midium"
|
|
||||||
>
|
|
||||||
离队
|
|
||||||
</el-button>
|
|
||||||
|
|
||||||
</span>
|
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
|
|
||||||
<div ref="left_bottom_Ref">
|
|
||||||
<el-pagination
|
|
||||||
@current-change="handleCurrentChange"
|
|
||||||
@size-change="handleSizeChange"
|
|
||||||
v-model:currentPage="currentPage"
|
|
||||||
:page-sizes="[5, 10, 15, 20]"
|
|
||||||
v-model:page-size="pageSize"
|
|
||||||
layout="total, sizes, prev, pager, next, jumper"
|
|
||||||
:total="total"
|
|
||||||
style="padding: 15px 15px 15px 15px;box-sizing:border-box;background: #fff;display: flex;justify-content: flex-end;">
|
|
||||||
</el-pagination>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="right" style="width: 45%;display: flex;flex-direction: column;height: 100%;">
|
|
||||||
<div style="display: flex;flex-direction: column;height: 100%">
|
|
||||||
<p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 0 0 30px 0;flex-shrink: 0;">岗位统计</p>
|
|
||||||
<div style="flex: 1;height: 100%">
|
|
||||||
<EchartsPie :id="'pie_post'" ref="pie_post" :isLegend="true" :dataList="stationList"/>
|
|
||||||
</div>
|
|
||||||
<p style="'Segoe UI',sans-serif;font-size: 20px;font-weight: bold;color: #606266;margin: 15px 0 30px 0;flex-shrink: 0;">团队工作情况统计</p>
|
|
||||||
<div style="flex: 1;height: 100%">
|
|
||||||
<EchartsPie :id="'pie_team'" :isRadius="true" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
// table元素
|
|
||||||
import {nextTick, onMounted, ref} from "vue";
|
|
||||||
|
|
||||||
const tableRef = ref(null);
|
|
||||||
|
|
||||||
// 总高度
|
|
||||||
const leftRef = ref(null);
|
|
||||||
const left_title_Ref = ref(null);
|
|
||||||
const left_bottom_Ref = ref(null);
|
|
||||||
// table高度
|
|
||||||
const tableHeight = ref();
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
// 设置表格初始高度为innerHeight-offsetTop-表格底部与浏览器底部距离110
|
|
||||||
nextTick(()=>{
|
|
||||||
tableHeight.value = leftRef.value.clientHeight - left_title_Ref.value.clientHeight - 26 - left_bottom_Ref.value.clientHeight
|
|
||||||
});
|
|
||||||
// tableHeight.value = window.innerHeight - tableRef.value.$el.offsetTop - 100;
|
|
||||||
window.onresize = () => {
|
|
||||||
tableHeight.value = leftRef.value.clientHeight - left_title_Ref.value.clientHeight - 26 - left_bottom_Ref.value.clientHeight
|
|
||||||
// tableHeight.value = window.innerHeight - tableRef.value.$el.offsetTop - 100;
|
|
||||||
// echartsHeight.value = window.innerHeight - tableRef.value.$el.offsetTop - 100;
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import EchartsPie from "@/components/echartsPie";
|
|
||||||
import request from "../utils/request";
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
methods: {
|
name: "ProjectGroup"
|
||||||
getStationList() {
|
|
||||||
let projectId = this.$route.params.projectId
|
|
||||||
request({
|
|
||||||
url: `project/${projectId}/group/stats`,
|
|
||||||
method: 'get',
|
|
||||||
}).then(response => {
|
|
||||||
if (response.data.code === 200) {
|
|
||||||
console.log(response.data.data);
|
|
||||||
let data = response.data.data;
|
|
||||||
let array = [];
|
|
||||||
for (let key in data) {
|
|
||||||
array.push({value: data[key], name: key});
|
|
||||||
}
|
|
||||||
this.stationList = array;
|
|
||||||
this.$nextTick(()=>{
|
|
||||||
this.$refs.pie_post.updateEcharts();
|
|
||||||
});
|
|
||||||
console.log(array);
|
|
||||||
}
|
|
||||||
}).catch(function (error) {
|
|
||||||
console.log(error)
|
|
||||||
})
|
|
||||||
},
|
|
||||||
deleteRow(index, rows) {
|
|
||||||
rows.splice(index, 1)
|
|
||||||
},
|
|
||||||
// 选择一页显示多少条数据
|
|
||||||
handleSizeChange(val) {
|
|
||||||
|
|
||||||
},
|
|
||||||
// 选择当前的是第几页
|
|
||||||
handleCurrentChange(val) {
|
|
||||||
|
|
||||||
},
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.getStationList();
|
|
||||||
},
|
|
||||||
components: {EchartsPie},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
// 岗位列表
|
|
||||||
stationList: [],
|
|
||||||
total: 5,
|
|
||||||
currentPage: 1,
|
|
||||||
pageSize: 10,
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
staffFullname: '王小虎',
|
|
||||||
projectStaffPosition: '项目经理',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小虎',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小虎',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
staffFullname: '王小明',
|
|
||||||
projectStaffPosition: '研发人员',
|
|
||||||
},
|
|
||||||
],
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue