williamet/vis389
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bug fixed

Browse Source
This commit is contained in:
cxc
2023-02-03 10:26:11 +08:00
parent 53e6ace735
commit 3cbf5a779e
18 changed files with 1169 additions and 895 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/views/bigScreen/drivingCabin/left1.vue
View File

@ -106,11 +106,12 @@ export default {
start() { start() {
// 每隔一段时间，页码+1，判断是否到最后一页，是则将页码重设为1 // 每隔一段时间，页码+1，判断是否到最后一页，是则将页码重设为1
this.time = setInterval(() => { this.time = setInterval(() => {
this.currentPage1 = this.currentPage1 + 1;
this.handleCurrentChange(this.currentPage1);
if (this.currentPage1 >= this.total / this.pageSize) { if (this.currentPage1 >= this.total / this.pageSize) {
this.currentPage1 = 0; this.currentPage1 = 1;
} else {
this.currentPage1 = this.currentPage1 + 1;
} }
this.handleCurrentChange(this.currentPage1);
}, 5000); }, 5000);
}, },
end() { end() {
@ -130,15 +131,70 @@ export default {
url: "/hx/cockpitOverview/businessResponsibility", url: "/hx/cockpitOverview/businessResponsibility",
method: "get", method: "get",
}).then((res) => { }).then((res) => {
// this.res = {
// list: [
// {
// targetTasks: 2,
// cate: 100,
// completedTasks: 2,
// indicator_name: "类别1",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别2",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别3",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别4",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别5",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别6",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别7",
// },
// {
// targetTasks: 2,
// cate: 50,
// completedTasks: 1,
// indicator_name: "类别8",
// },
// ],
// map: null,
// };
this.res = res.data; this.res = res.data;
// console.log(res.data);
// TODO: 分页 // TODO: 分页
this.total = this.res.list.length; this.total = this.res.list.length;
for (let i = 0; i < this.res.list.length; i++) { for (let i = 0; i < this.res.list.length; i++) {
const item = this.res.list[i]; const item = this.res.list[i];
this.titData.push(item.indicator_name); this.titData.push(item.indicator_name);
this.valData.push({ this.valData.push({
value: item.cate, // TODO:
// value: item.rate,
value: item.completedTasks,
name: item.indicator_name, name: item.indicator_name,
tooltip: { tooltip: {
trigger: "item", trigger: "item",

3
src/views/bigScreen/drivingCabin/right1.vue
View File

@ -94,7 +94,8 @@ export default {
this.chart.setOption({ this.chart.setOption({
tooltip: { tooltip: {
trigger: "item", trigger: "item",
formatter: "{a} <br/>{b}: {c} ({d}%)", // formatter: "{a} <br/>{b}: {c} ({d}%)",
formatter: "{a} <br/>{b}: {c}",
}, },
color: this.colorList, color: this.colorList,
legend: { legend: {

37
src/views/bigScreen/information/left1.vue
View File

@ -25,10 +25,11 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="7">责任令</el-col> <el-col style="text-align: center" :span="4">月份</el-col>
<el-col style="text-align: center" :span="7">部门</el-col> <el-col style="text-align: center" :span="6">责任令</el-col>
<el-col style="text-align: center" :span="7">完成情况</el-col> <el-col style="text-align: center" :span="6">部门</el-col>
<el-col style="text-align: center" :span="5">完成情况</el-col>
</el-row> </el-row>
</el-col> </el-col>
<vue-seamless-scroll <vue-seamless-scroll
@ -37,27 +38,31 @@
class="warp-scroll" class="warp-scroll"
:class-option="{ :class-option="{
singleHeight: 43, singleHeight: 43,
limitMoveNum: 4,
}" }"
> >
<ul class="item"> <ul class="item">
<li v-for="item in dataList" :key="item.id"> <li v-for="(item, index) in dataList" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id index + 1
}}</el-col> --> }}</el-col>
<el-col style="text-align: center" :span="4">{{
item.month
}}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:span="7" :span="6"
:title="item.responsibilityContent" :title="item.responsibilityContent"
>{{ item.responsibilityContent }}</el-col >{{ item.responsibilityContent }}</el-col
> >
<el-col <el-col
style="text-align: center" style="text-align: center"
:span="7" :span="6"
:title="item.deptName" :title="item.deptName"
>{{ item.deptName }}</el-col >{{ item.deptName }}</el-col
> >
<el-col style="text-align: center" :span="7"> <el-col style="text-align: center" :span="5">
<section class="box"> <section class="box">
<span <span
v-if="item.completionStatus == '已完成'" v-if="item.completionStatus == '已完成'"
@ -124,7 +129,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="7">项目名称</el-col> <el-col style="text-align: center" :span="7">项目名称</el-col>
<el-col style="text-align: center" :span="7">计划名称</el-col> <el-col style="text-align: center" :span="7">计划名称</el-col>
<!-- <el-col style="text-align: center" :span="7">部门</el-col> --> <!-- <el-col style="text-align: center" :span="7">部门</el-col> -->
@ -141,11 +146,11 @@
style="height: 168px" style="height: 168px"
> >
<ul class="item"> <ul class="item">
<li v-for="item in listData" :key="item.id"> <li v-for="(item, idx) in listData" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.projectName" :title="item.projectName"

10
src/views/bigScreen/information/right1.vue
View File

@ -35,7 +35,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="5">名称</el-col> <el-col style="text-align: center" :span="5">名称</el-col>
<el-col style="text-align: center" :span="5">部门</el-col> <el-col style="text-align: center" :span="5">部门</el-col>
<el-col style="text-align: center" :span="7">时间</el-col> <el-col style="text-align: center" :span="7">时间</el-col>
@ -50,11 +50,11 @@
}" }"
> >
<ul class="item"> <ul class="item">
<li v-for="item in listData" :key="item.id"> <li v-for="(item, idx) in listData" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.planName" :title="item.planName"

10
src/views/bigScreen/management/left1.vue
View File

@ -67,7 +67,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="5">项目名称</el-col> <el-col style="text-align: center" :span="5">项目名称</el-col>
<el-col style="text-align: center" :span="5">部门</el-col> <el-col style="text-align: center" :span="5">部门</el-col>
<el-col style="text-align: center" :span="7">时间</el-col> <el-col style="text-align: center" :span="7">时间</el-col>
@ -84,11 +84,11 @@
style="height: 168px" style="height: 168px"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList" :key="item.id"> <li v-for="(item, idx) in scrollList" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.projectName" :title="item.projectName"

10
src/views/bigScreen/management/left2.vue
View File

@ -68,7 +68,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="5">合同名称</el-col> <el-col style="text-align: center" :span="5">合同名称</el-col>
<el-col style="text-align: center" :span="3">数量</el-col> <el-col style="text-align: center" :span="3">数量</el-col>
<el-col style="text-align: center" :span="5">金额</el-col> <el-col style="text-align: center" :span="5">金额</el-col>
@ -83,11 +83,11 @@
}" }"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList" :key="item.id"> <li v-for="(item, idx) in scrollList" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.contractName" :title="item.contractName"

357
src/views/bigScreen/management/right1.vue
View File

@ -49,8 +49,8 @@
</div> </div>
</div> </div>
<div style="display: flex; height: 100%" v-else> <div style="display: flex; height: 100%" v-else>
<div style="height: 100%; width: 75%" ref="chart2"></div> <div style="height: 100%; width: 100%" ref="chart2"></div>
<div <!-- <div
style=" style="
height: 100%; height: 100%;
width: 25%; width: 25%;
@ -66,7 +66,7 @@
</div> </div>
<progressBar :percentage="80" style="margin: 10px 0 20px" /> <progressBar :percentage="80" style="margin: 10px 0 20px" />
<i class="num">80%</i> <i class="num">80%</i>
</div> </div> -->
</div> </div>
</container2> </container2>
<container2 title="信息公示" style="margin-top: 10px"> <container2 title="信息公示" style="margin-top: 10px">
@ -87,7 +87,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="5">项目名称</el-col> <el-col style="text-align: center" :span="5">项目名称</el-col>
<el-col style="text-align: center" :span="5">负责人</el-col> <el-col style="text-align: center" :span="5">负责人</el-col>
<el-col style="text-align: center" :span="7">团队</el-col> <el-col style="text-align: center" :span="7">团队</el-col>
@ -104,11 +104,11 @@
style="height: 168px" style="height: 168px"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList1" :key="item.id"> <li v-for="(item, idx) in scrollList1" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.projectName" :title="item.projectName"
@ -158,7 +158,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="7">部门</el-col> <el-col style="text-align: center" :span="7">部门</el-col>
<el-col style="text-align: center" :span="7">公示内容</el-col> <el-col style="text-align: center" :span="7">公示内容</el-col>
<el-col style="text-align: center" :span="7">时间</el-col> <el-col style="text-align: center" :span="7">时间</el-col>
@ -174,11 +174,11 @@
style="height: 168px" style="height: 168px"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList2" :key="item.id"> <li v-for="(item, idx) in scrollList2" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col style="text-align: center" :span="7">{{ <el-col style="text-align: center" :span="7">{{
item.deptName item.deptName
}}</el-col> }}</el-col>
@ -308,6 +308,11 @@ export default {
let { rate, list } = res.data; let { rate, list } = res.data;
if (rate) { if (rate) {
this.rate = rate; this.rate = rate;
} else {
this.rate = {
comprehensiveRate: 0,
performanceRate: 0,
};
} }
this.chart = echarts.init(this.$refs.chart); this.chart = echarts.init(this.$refs.chart);
this.chart.setOption({ this.chart.setOption({
@ -461,153 +466,187 @@ export default {
this.chart2 = echarts.init(this.$refs.chart2); this.chart2 = echarts.init(this.$refs.chart2);
this.setOptions2(); this.setOptions2();
}, },
setOptions2() { async setOptions2() {
this.chart2.setOption({ let params = { type: 1 };
tooltip: { // if (month) {
trigger: "axis", // params["month"] = month;
axisPointer: { // }
type: "shadow", const res = await this.request({
}, url: "/hx/operating/getComprehensivePlanPic",
}, method: "get",
legend: { params: params,
data: ["综合", "绩效"],
textStyle: {
color: "#fff", //legend字体颜色
},
},
grid: {
left: 20,
right: 20,
top: 30,
bottom: 50,
containLabel: true,
},
dataZoom: {
type: "slider",
start: 0,
end: 50,
},
xAxis: [
{
type: "category",
data: [
"部门5",
"部门二",
"部门三",
"部门四",
"部门五",
"部门六",
"部门七",
],
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
],
yAxis: [
{
name: "个",
splitLine: {
show: true,
// 改变轴线颜色
lineStyle: {
// 使用深浅的间隔色
color: ["rgba(255, 255, 255,.5)"],
},
},
axisLabel: {
formatter: "{value}",
},
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
{
type: "value",
min: 0,
max: 100,
interval: 20,
axisLabel: {
formatter: "{value} %",
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
],
series: [
{
name: "绩效",
type: "bar",
stack: "Ad",
emphasis: {
focus: "series",
},
itemStyle: {
color: "#F64F58",
},
barWidth: 30,
data: [150, 232, 201, 154, 190, 330, 410],
},
{
name: "综合",
type: "bar",
stack: "Ad",
emphasis: {
focus: "series",
},
itemStyle: {
color: "#F6D97E",
},
barWidth: 30,
data: [150, 232, 201, 154, 190, 330, 410],
},
{
name: "完成率",
type: "scatter",
symbol: "rect",
symbolSize: [30, 4],
symbolOffset: [0, 0],
position: [0, 0],
itemStyle: {
color: "#7EA7FC",
},
data: [600, 650, 700, 750, 800, 750, 700],
},
// {
// name: '',
// type: 'line',
// smooth: false,
// data: [500, 550, 700, 520, 650, 520, 550],
// itemStyle: {
// color: '#F6D97E',
// },
// symbol: 'none',
// },
// {
// name: '',
// type: 'line',
// smooth: false,
// itemStyle: {
// color: '#F64F58',
// },
// data: [600, 500, 700, 620, 750, 800, 600],
// symbol: 'none',
// },
],
}); });
if (200 == res.code) {
let { rate, list } = res.data;
// if (rate) {
// this.rate = rate;
// }
this.chart2.setOption({
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
legend: {
data: ["综合", "绩效"],
textStyle: {
color: "#fff", //legend字体颜色
},
},
grid: {
left: 20,
right: 20,
top: 30,
bottom: 50,
containLabel: true,
},
dataZoom: {
type: "slider",
start: 0,
end: 50,
},
xAxis: [
{
type: "category",
data: list.map((e) => e.deptName),
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
],
yAxis: [
{
name: "个",
max: "dataMax",
splitLine: {
show: true,
// 改变轴线颜色
lineStyle: {
// 使用深浅的间隔色
color: ["rgba(255, 255, 255,.5)"],
},
},
axisLabel: {
formatter: "{value}",
},
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
{
type: "value",
min: 0,
max: 100,
interval: 20,
axisLabel: {
formatter: "{value} %",
},
splitLine: {
show: false, //不显示网格线
},
splitArea: {
show: false, //不显示网格区域
},
axisLine: {
lineStyle: {
color: "rgb(255, 255, 255)",
},
},
},
],
series: [
{
name: "绩效",
type: "bar",
stack: "Ad",
emphasis: {
focus: "series",
},
itemStyle: {
color: "#F64F58",
},
barWidth: 30,
data: list.map((el) => el.performancePlanCompleted),
},
{
name: "综合",
type: "bar",
stack: "Ad",
emphasis: {
focus: "series",
},
itemStyle: {
color: "#F6D97E",
},
barWidth: 30,
data: list.map((el) => el.comprehensivePlanCompleted),
},
{
name: "综合完成率",
// type: "scatter",
type: "line",
symbol: "rect",
symbolSize: [30, 4],
symbolOffset: [0, 0],
position: [0, 0],
itemStyle: {
color: "#F6D97E",
},
yAxisIndex: "1",
data: list.map((el) =>
(
(el.comprehensivePlanCompleted / el.comprehensivePlanTotal) *
100
).toFixed(2)
),
},
{
name: "绩效完成率",
// type: "scatter",
type: "line",
yAxisIndex: "1",
symbol: "rect",
symbolSize: [30, 4],
symbolOffset: [0, 0],
position: [0, 0],
itemStyle: {
color: "#F64F58",
},
data: list.map((el) =>
(
(el.performancePlanCompleted / el.performancePlanTotal) *
100
).toFixed(2)
),
},
// {
// name: '',
// type: 'line',
// smooth: false,
// data: [500, 550, 700, 520, 650, 520, 550],
// itemStyle: {
// color: '#F6D97E',
// },
// symbol: 'none',
// },
// {
// name: '',
// type: 'line',
// smooth: false,
// itemStyle: {
// color: '#F64F58',
// },
// data: [600, 500, 700, 620, 750, 800, 600],
// symbol: 'none',
// },
],
});
}
}, },
}, },
}; };

10
src/views/bigScreen/qualityManage/right1.vue
View File

@ -42,7 +42,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="4">序号</el-col> --> <el-col style="text-align: center" :span="4">序号</el-col>
<el-col style="text-align: center" :span="8">部门</el-col> <el-col style="text-align: center" :span="8">部门</el-col>
<el-col style="text-align: center" :span="12">案例名称</el-col> <el-col style="text-align: center" :span="12">案例名称</el-col>
</el-row> </el-row>
@ -56,11 +56,11 @@
}" }"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList" :key="item.id"> <li v-for="(item, idx) in scrollList" :key="item.id">
<el-row style="font-size: 14px"> <el-row style="font-size: 14px">
<!-- <el-col style="text-align: center" :span="4">{{ <el-col style="text-align: center" :span="4">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col style="text-align: center" :span="8">{{ <el-col style="text-align: center" :span="8">{{
item.className item.className
}}</el-col> }}</el-col>

114
src/views/bigScreen/scientific/tab1/center1.vue
View File

@ -31,7 +31,7 @@
<div> <div>
<div class="box"> <div class="box">
<div class="tit"> <div class="tit">
<img src="./icon2.png" alt="" /> <img src="./icon2.png" alt=""/>
<span>总装车间</span> <span>总装车间</span>
</div> </div>
</div> </div>
@ -62,7 +62,7 @@
:key="index" :key="index"
> >
<!-- <el-image style="width: 42px; height: 42px" :src="row.avatar" fit="cover"></el-image> --> <!-- <el-image style="width: 42px; height: 42px" :src="row.avatar" fit="cover"></el-image> -->
<img style="width: 42px; height: 42px" :src="row.avatar" /> <img style="width: 42px; height: 42px" :src="row.avatar"/>
<el-tooltip <el-tooltip
effect="dark" effect="dark"
:content="row.nickname" :content="row.nickname"
@ -93,102 +93,103 @@
</div> </div>
</div> </div>
<el-button type="text" style="padding: 0" slot="reference"> <el-button type="text" style="padding: 0" slot="reference">
<img style="width: 100%; height: 100%" src="./icon.png" alt="" /> <img style="width: 100%; height: 100%" src="./icon1.png" alt="" width="40" height="45"/>
</el-button> </el-button>
</el-popover> </el-popover>
</container3> </container3>
</template> </template>
<script> <script>
import flvjs from "flv.js"; import flvjs from 'flv.js'
import container3 from './components/container3/index.vue'
import vueSeamlessScroll from 'vue-seamless-scroll'
import echarts from 'echarts'
import container3 from "./components/container3/index.vue";
import vueSeamlessScroll from "vue-seamless-scroll";
import echarts from "echarts";
export default { export default {
components: { components: {
container3, //#endregion, container3, //#endregion,
vueSeamlessScroll, vueSeamlessScroll
}, },
data() { data() {
return { return {
pic: "", pic: '',
listData: [], listData: [],
listData2: [], listData2: [],
flvPlayer: null, flvPlayer: null
}; }
}, },
methods: { methods: {
getList() { getList() {
this.request({ this.request({
url: "/hx/scientificProduction/getHxWorkHomePic", url: '/hx/scientificProduction/getHxWorkHomePic'
}).then(({ data }) => { }).then(({ data }) => {
// data.map((item) => { // data.map((item) => {
// item.avAddress = // item.avAddress =
// "http://192.168.0.151:81/stream/live/classic_cases_video.flv"; // "http://192.168.0.151:81/stream/live/classic_cases_video.flv";
// }); // });
this.listData = data; this.listData = data
}); })
}, },
handleShow(index) { handleShow(index) {
this.hadleHide(); this.hadleHide()
this.listData2 = this.listData[index]["userList"]; this.listData2 = this.listData[index]['userList']
setTimeout(() => { setTimeout(() => {
if (flvjs.isSupported()) { if (flvjs.isSupported()) {
this.flvPlayer = flvjs.createPlayer( this.flvPlayer = flvjs.createPlayer(
{ {
type: "flv", // 媒体类型 flv 或 mp4 type: 'flv', // 媒体类型 flv 或 mp4
isLive: true, // 是否为直播流 isLive: true, // 是否为直播流
fluid: true, fluid: true,
// hasAudio: true, // 是否开启声音 // hasAudio: true, // 是否开启声音
stashInitialSize: 128, // 减少首桢显示等待时长 stashInitialSize: 128, // 减少首桢显示等待时长
url: this.listData[index]["avAddress"], url: this.listData[index]['avAddress']
}, },
{ {
enableStashBuffer: false, enableStashBuffer: false,
fixAudioTimestampGap: false, fixAudioTimestampGap: false,
isLive: true, isLive: true
} }
); )
let all = document.querySelectorAll("#videoElement"); let all = document.querySelectorAll('#videoElement')
let videoElement = all[all.length - 1]; let videoElement = all[all.length - 1]
this.flvPlayer.attachMediaElement(videoElement); this.flvPlayer.attachMediaElement(videoElement)
this.flvPlayer.load(); this.flvPlayer.load()
this.flvPlayer.play(); this.flvPlayer.play()
} }
}, 0); }, 0)
}, },
hadleHide() { hadleHide() {
if (this.flvPlayer) { if (this.flvPlayer) {
this.flvPlayer.pause(); this.flvPlayer.pause()
this.flvPlayer.unload(); this.flvPlayer.unload()
this.flvPlayer.detachMediaElement(); this.flvPlayer.detachMediaElement()
this.flvPlayer.destroy(); this.flvPlayer.destroy()
this.flvPlayer = null; this.flvPlayer = null
} }
}, }
}, },
beforeDestroy() { beforeDestroy() {
if (this.flvPlayer) { if (this.flvPlayer) {
this.flvPlayer.pause(); this.flvPlayer.pause()
this.flvPlayer.unload(); this.flvPlayer.unload()
this.flvPlayer.detachMediaElement(); this.flvPlayer.detachMediaElement()
this.flvPlayer.destroy(); this.flvPlayer.destroy()
this.flvPlayer = null; this.flvPlayer = null
} }
}, },
created() { created() {
this.getList(); this.getList()
this.request({ this.request({
url: "/hx/bigPic/getByType", url: '/hx/bigPic/getByType',
method: "get", method: 'get',
params: { type: 2 }, params: { type: 2 }
}).then((res) => { }).then((res) => {
if (200 == res.code) { if (200 == res.code) {
this.pic = res.data.pic; this.pic = res.data.pic
} }
}); })
}, }
}; }
</script> </script>
<style> <style>
.el-popover { .el-popover {
@ -200,6 +201,7 @@ export default {
.icon_img { .icon_img {
position: absolute; position: absolute;
} }
.el-popover { .el-popover {
.box { .box {
width: 177px; width: 177px;
@ -207,11 +209,13 @@ export default {
border-width: 0px 20px 30px 0px; border-width: 0px 20px 30px 0px;
border-style: none solid solid; border-style: none solid solid;
border-color: transparent transparent rgba(10, 90, 132, 1); border-color: transparent transparent rgba(10, 90, 132, 1);
.tit { .tit {
height: 30px; height: 30px;
padding-left: 16px; padding-left: 16px;
display: flex; display: flex;
align-items: center; align-items: center;
span { span {
margin-left: 8px; margin-left: 8px;
color: #fff; color: #fff;
@ -219,13 +223,16 @@ export default {
} }
} }
} }
.cont { .cont {
background-color: #0d1049; background-color: #0d1049;
padding: 8px 13px 11px 16px; padding: 8px 13px 11px 16px;
video { video {
width: 100%; width: 100%;
height: 143px; height: 143px;
} }
.user_box { .user_box {
color: #fff; color: #fff;
font-size: 16px; font-size: 16px;
@ -233,30 +240,36 @@ export default {
line-height: 32px; line-height: 32px;
padding: 0 16px; padding: 0 16px;
background: linear-gradient( background: linear-gradient(
270deg, 270deg,
rgba(10, 16, 75, 0) 0%, rgba(10, 16, 75, 0) 0%,
rgba(8, 56, 105, 0.11) 0%, rgba(8, 56, 105, 0.11) 0%,
rgba(6, 116, 151, 0.91) 60%, rgba(6, 116, 151, 0.91) 60%,
#00ffff 146% #00ffff 146%
); );
span:nth-child(1) { span:nth-child(1) {
float: left; float: left;
} }
span:nth-child(2) { span:nth-child(2) {
float: right; float: right;
} }
} }
.warp-scroll { .warp-scroll {
// height: 100px; // height: 100px;
margin: 0 auto; margin: 0 auto;
margin-top: 25px; margin-top: 25px;
overflow: hidden; overflow: hidden;
ul { ul {
list-style: none; list-style: none;
padding: 0; padding: 0;
margin: 0 auto; margin: 0 auto;
&.ul-item { &.ul-item {
display: flex; display: flex;
.li-item { .li-item {
width: 42px; width: 42px;
// height: 120px; // height: 120px;
@ -265,6 +278,7 @@ export default {
// background-color: #999; // background-color: #999;
color: #fff; color: #fff;
text-align: center; text-align: center;
.one_hidden { .one_hidden {
word-break: keep-all; word-break: keep-all;
white-space: nowrap; white-space: nowrap;

BIN
src/views/bigScreen/scientific/tab1/icon1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

10
src/views/bigScreen/scientific/tab2/center3.vue
View File

@ -10,7 +10,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="4">序号</el-col> --> <el-col style="text-align: center" :span="4">序号</el-col>
<el-col style="text-align: center" :span="4">物资名称</el-col> <el-col style="text-align: center" :span="4">物资名称</el-col>
<el-col style="text-align: center" :span="3">现有库存</el-col> <el-col style="text-align: center" :span="3">现有库存</el-col>
<el-col style="text-align: center" :span="6" <el-col style="text-align: center" :span="6"
@ -27,11 +27,11 @@
:class-option="{ singleHeight: 42 }" :class-option="{ singleHeight: 42 }"
> >
<ul class="item"> <ul class="item">
<li v-for="item in scrollList" :key="item.id"> <li v-for="(item, idx) in scrollList" :key="item.id">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="4">{{ <el-col style="text-align: center" :span="4">{{
item.id idx + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.materialName" :title="item.materialName"

489
src/views/bigScreen/scientific/tab3/left1.vue
View File

@ -41,34 +41,34 @@
</container1> </container1>
<container1 style="margin-right: 14px" title="单台产品信息"> <container1 style="margin-right: 14px" title="单台产品信息">
<div class="trends" style="text-align: center"> <div class="trends" style="text-align: center">
<img :src="dataInfo.pic" alt="" width="100%" /> <img :src="dataInfo.pic" alt="" width="100%" height="100%" :style="{objectFit:'contain'}"/>
</div> </div>
</container1> </container1>
</div> </div>
</template> </template>
<script> <script>
import container1 from "./components/container1/index.vue"; import container1 from './components/container1/index.vue'
import progressBar from "@/views/bigScreen/components/progress/index.vue"; import progressBar from '@/views/bigScreen/components/progress/index.vue'
import bigScreenTabs from "../../components/bigScreenTabs/index.vue"; import bigScreenTabs from '../../components/bigScreenTabs/index.vue'
import vueSeamlessScroll from "vue-seamless-scroll"; import vueSeamlessScroll from 'vue-seamless-scroll'
import colorList from "@/utils/colorPalette"; import colorList from '@/utils/colorPalette'
import { import {
blueColorList, blueColorList,
greenColorList, greenColorList,
yelloColorList, yelloColorList,
redColorList, redColorList
} from "@/utils/gradualColor"; } from '@/utils/gradualColor'
import echarts from "echarts"; import echarts from 'echarts'
require("echarts/theme/macarons"); // echarts theme require('echarts/theme/macarons') // echarts theme
export default { export default {
components: { components: {
container1, //#endregion, container1, //#endregion,
progressBar, progressBar,
bigScreenTabs, bigScreenTabs,
vueSeamlessScroll, vueSeamlessScroll
}, },
data() { data() {
return { return {
@ -80,211 +80,212 @@ export default {
chart3: null, chart3: null,
listData: [1, 2, 3, 4, 5, 6, 7, 8], listData: [1, 2, 3, 4, 5, 6, 7, 8],
customColor: colorList, customColor: colorList,
prodMonthlyPlan: "", // prodMonthlyPlan: '' //
}; }
}, },
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
this.initChart(); this.initChart()
this.initChart2(this.prodMonthlyPlan); this.initChart2(this.prodMonthlyPlan)
this.initChart3(); this.initChart3()
}); })
},
beforeDestroy() {
}, },
beforeDestroy() {},
methods: { methods: {
getData() { getData() {
this.request({ this.request({
url: "/hx/scientificProduction/getProductPic", url: '/hx/scientificProduction/getProductPic'
}).then(({ data }) => { }).then(({ data }) => {
this.dataInfo = data; this.dataInfo = data
}); })
}, },
initChart() { initChart() {
this.request({ this.request({
url: "/hx/scientificProduction/getModelYearPlanPic", url: '/hx/scientificProduction/getModelYearPlanPic'
}).then(({ data }) => { }).then(({ data }) => {
this.chart = echarts.init(this.$refs.chart); this.chart = echarts.init(this.$refs.chart)
this.setOptions(data); this.setOptions(data)
}); })
}, },
setOptions(resData) { setOptions(resData) {
let titList = []; let titList = []
let realCharge = []; // 实际装药量 let realCharge = [] // 实际装药量
let realDeliver = []; // 实际支付 let realDeliver = [] // 实际支付
let chargeRate = []; // 装药量率 let chargeRate = [] // 装药量率
let deliverRate = []; // 支付率 let deliverRate = [] // 支付率
for (let i = 0; i < resData.length; i++) { for (let i = 0; i < resData.length; i++) {
const item = resData[i]; const item = resData[i]
titList.push(item.productModel); titList.push(item.productModel)
realCharge.push(item.realCharge); realCharge.push(item.realCharge)
realDeliver.push(item.realDeliver); realDeliver.push(item.realDeliver)
chargeRate.push(item.chargeRate); chargeRate.push(item.chargeRate)
deliverRate.push(item.deliverRate); deliverRate.push(item.deliverRate)
} }
this.chart.setOption({ this.chart.setOption({
tooltip: { tooltip: {
trigger: "axis", trigger: 'axis',
axisPointer: { axisPointer: {
type: "shadow", type: 'shadow'
}, },
formatter: "{b0}<br /> {a0}:{c0}%<br />{a1}: {c1}%", formatter: '{b0}<br /> {a0}:{c0}%<br />{a1}: {c1}%'
}, },
legend: { legend: {
textStyle: { textStyle: {
color: "#fff", //legend字体颜色 color: '#fff' //legend字体颜色
}, }
}, },
grid: { grid: {
top: 30, top: 30,
left: "3%", left: '3%',
right: "4%", right: '4%',
bottom: 20, bottom: 20,
containLabel: true, containLabel: true
}, },
xAxis: { xAxis: {
show: false, show: false
// type: 'value', // type: 'value',
// splitLine: { // splitLine: {
// show: false, //不显示网格线 // show: false, //不显示网格线
// }, // },
}, },
yAxis: { yAxis: {
type: "category", type: 'category',
boundaryGap: true, boundaryGap: true,
splitLine: { splitLine: {
show: false, // 不显示网格线 show: false // 不显示网格线
}, },
axisTick: { axisTick: {
show: false, // y轴刻度线 show: false // y轴刻度线
}, },
axisLine: { axisLine: {
show: false, show: false,
lineStyle: { lineStyle: {
color: "rgb(255, 255, 255)", color: 'rgb(255, 255, 255)'
}, }
}, },
data: titList, data: titList
}, },
color: ["#55C5A2", "#55C5A2"], color: ['#55C5A2', '#55C5A2'],
series: [ series: [
{ {
roundCap: true, // 没效果 roundCap: true, // 没效果
showBackground: true, showBackground: true,
backgroundStyle: { backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)", color: 'rgba(180, 180, 180, 0.2)'
}, },
name: "装药", name: '装药',
type: "bar", type: 'bar',
stack: "total", stack: 'total',
// label: { // label: {
// show: true, // show: true,
// }, // },
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
barWidth: 12, barWidth: 12,
data: chargeRate, data: chargeRate,
color: "#F6D97E", color: '#F6D97E'
}, },
{ {
showBackground: true, showBackground: true,
backgroundStyle: { backgroundStyle: {
color: "rgba(180, 180, 180, 0.2)", color: 'rgba(180, 180, 180, 0.2)'
}, },
name: "交付", name: '交付',
type: "bar", type: 'bar',
stack: "total", stack: 'total',
// label: { // label: {
// show: true, // show: true,
// }, // },
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
barWidth: 12, barWidth: 12,
data: deliverRate, data: deliverRate,
color: "#55C5A2", color: '#55C5A2'
}, }
], ]
}); })
}, },
initChart2(month) { initChart2(month) {
this.request({ this.request({
url: "/hx/scientificProduction/getProductionPlanPic?month=" + month, url: '/hx/scientificProduction/getProductionPlanPic?month=' + month
}).then(({ data }) => { }).then(({ data }) => {
this.chart2 = echarts.init(this.$refs.chart2); this.chart2 = echarts.init(this.$refs.chart2)
this.setOptions2(data); this.setOptions2(data)
}); })
// 测试数据 // 测试数据
const data2 = { const data2 = {
allMonth: ["2021-01", "2021-02"], allMonth: ['2021-01', '2021-02'],
list: [ list: [
{ {
"2021-01": [ '2021-01': [
{ {
id: 1, id: 1,
month: "2021-01", month: '2021-01',
productModel: "型号1", productModel: '型号1',
adiabat: "10", adiabat: '10',
charge: "11", charge: '11',
assembly: "12", assembly: '12',
deliver: "13", deliver: '13'
}, },
{ {
id: 2, id: 2,
month: "2021-01", month: '2021-01',
productModel: "型号2", productModel: '型号2',
adiabat: "16", adiabat: '16',
charge: "17", charge: '17',
assembly: "18", assembly: '18',
deliver: "19", deliver: '19'
}, }
], ]
}, },
{ {
"2021-02": [ '2021-02': [
{ {
id: 10, id: 10,
month: "2021-02", month: '2021-02',
productModel: "型号1", productModel: '型号1',
adiabat: "20", adiabat: '20',
charge: "21", charge: '21',
assembly: "22", assembly: '22',
deliver: "23", deliver: '23'
}, },
{ {
id: 11, id: 11,
month: "2021-02", month: '2021-02',
productModel: "型号2", productModel: '型号2',
adiabat: "26", adiabat: '26',
charge: "27", charge: '27',
assembly: "28", assembly: '28',
deliver: "29", deliver: '29'
}, }
], ]
}, }
], ],
allModel: ["型号1", "型号2"], allModel: ['型号1', '型号2']
}; }
}, },
setOptions2(resData) { setOptions2(resData) {
const xAixsList = resData.map((el) => el.productModel); // 横坐标列表 const xAixsList = resData.map((el) => el.productModel) // 横坐标列表
const adiabatList = []; // 绝热 const adiabatList = [] // 绝热
adiabatList.push(resData.map((el) => el.realAdiabat)); // 实际 adiabatList.push(resData.map((el) => el.realAdiabat)) // 实际
adiabatList.push(resData.map((el) => el.forecastAdiabat)); // 预测 adiabatList.push(resData.map((el) => el.forecastAdiabat)) // 预测
const deliverList = []; const deliverList = []
deliverList.push(resData.map((el) => el.realDeliver)); // 交付数量列表 deliverList.push(resData.map((el) => el.realDeliver)) // 交付数量列表
deliverList.push(resData.map((el) => el.forecastDeliver)); // 交付数量列表 deliverList.push(resData.map((el) => el.forecastDeliver)) // 交付数量列表
const chargeList = []; const chargeList = []
chargeList.push(resData.map((el) => el.realCharge)); //装药数量列表 chargeList.push(resData.map((el) => el.realCharge)) //装药数量列表
chargeList.push(resData.map((el) => el.forecastCharge)); //装药数量列表 chargeList.push(resData.map((el) => el.forecastCharge)) //装药数量列表
const assemblyList = []; const assemblyList = []
assemblyList.push(resData.map((el) => el.realAssembly)); // 总装数列表 assemblyList.push(resData.map((el) => el.realAssembly)) // 总装数列表
assemblyList.push(resData.map((el) => el.forecastAssembly)); // 总装数列表 assemblyList.push(resData.map((el) => el.forecastAssembly)) // 总装数列表
// // console.log(adiabatList); // // console.log(adiabatList);
// // return; // // return;
// let adiabat = []; // 绝热数量 // let adiabat = []; // 绝热数量
@ -335,38 +336,38 @@ export default {
this.chart2.setOption({ this.chart2.setOption({
tooltip: { tooltip: {
formatter: (params, ticket, callback) => { formatter: (params, ticket, callback) => {
const type = ["实际", "预测"]; const type = ['实际', '预测']
// // console.log(type[params.dataIndex]); // // console.log(type[params.dataIndex]);
// console.log(params.seriesIndex % 2); // console.log(params.seriesIndex % 2);
let seriesName = params.seriesName; let seriesName = params.seriesName
let newSeriesName = seriesName.split(","); let newSeriesName = seriesName.split(',')
let name = params.name; let name = params.name
let num = params.value; let num = params.value
return ` return `
<div> <div>
<div>${name}</div> <div>${name}</div>
<div>${type[params.seriesIndex % 2]} ${num}</div> <div>${type[params.seriesIndex % 2]} ${num}</div>
</div> </div>
`; `
}, }
// <div><span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:${ // <div><span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:${
// params.color // params.color
// };"></span> ${newSeriesName[0]} ${num}</div> // };"></span> ${newSeriesName[0]} ${num}</div>
}, },
legend: { legend: {
data: ["绝热", "装药", "总装", "交付"], data: ['绝热', '装药', '总装', '交付'],
textStyle: { textStyle: {
color: "#fff", //legend字体颜色 color: '#fff' //legend字体颜色
}, }
}, },
grid: { grid: {
left: 0, left: 0,
right: 10, right: 10,
top: 10, top: 10,
bottom: 50, bottom: 50,
containLabel: true, containLabel: true
}, },
// dataZoom: { // dataZoom: {
// type: 'slider', // type: 'slider',
@ -391,96 +392,96 @@ export default {
// ], // ],
xAxis: [ xAxis: [
{ {
type: "category", type: 'category',
data: xAixsList, data: xAixsList,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "rgb(255, 255, 255)", color: 'rgb(255, 255, 255)'
}, }
}, }
}, }
], ],
yAxis: [ yAxis: [
{ {
name: "", name: '',
splitLine: { splitLine: {
show: true, show: true,
// 改变轴线颜色 // 改变轴线颜色
lineStyle: { lineStyle: {
// 使用深浅的间隔色 // 使用深浅的间隔色
color: ["rgba(255, 255, 255,.5)"], color: ['rgba(255, 255, 255,.5)']
}, }
}, },
axisLabel: { axisLabel: {
formatter: "{value}", formatter: '{value}'
}, },
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "rgb(255, 255, 255)", color: 'rgb(255, 255, 255)'
}, }
}, }
}, },
{ {
type: "value", type: 'value'
}, }
], ],
series: [ series: [
...adiabatList.map((el, index) => { ...adiabatList.map((el, index) => {
return { return {
name: "绝热", name: '绝热',
type: "bar", type: 'bar',
stack: "adiabat", stack: 'adiabat',
data: el, data: el,
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
itemStyle: { itemStyle: {
color: blueColorList[index], color: blueColorList[index]
}, }
}; }
}), }),
...chargeList.map((el, index) => { ...chargeList.map((el, index) => {
return { return {
name: "装药", name: '装药',
type: "bar", type: 'bar',
data: el, data: el,
stack: "charge", stack: 'charge',
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
itemStyle: { itemStyle: {
color: yelloColorList[index], color: yelloColorList[index]
}, }
}; }
}), }),
...assemblyList.map((el, index) => { ...assemblyList.map((el, index) => {
return { return {
name: "总装", name: '总装',
type: "bar", type: 'bar',
data: el, data: el,
stack: "assembly", stack: 'assembly',
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
itemStyle: { itemStyle: {
color: redColorList[index], color: redColorList[index]
}, }
}; }
}), }),
...deliverList.map((el, index) => { ...deliverList.map((el, index) => {
return { return {
name: "交付", name: '交付',
type: "bar", type: 'bar',
data: el, data: el,
stack: "deliver", stack: 'deliver',
emphasis: { emphasis: {
focus: "series", focus: 'series'
}, },
itemStyle: { itemStyle: {
color: greenColorList[index], color: greenColorList[index]
}, }
}; }
}), })
// { // {
// name: "装药", // name: "装药",
// type: "bar", // type: "bar",
@ -670,129 +671,129 @@ export default {
// color: blueColorList[3], // color: blueColorList[3],
// }, // },
// }, // },
], ]
}); })
}, },
initChart3() { initChart3() {
this.request({ this.request({
url: "/hx/scientificProduction/getModelProductionStatisticPic", url: '/hx/scientificProduction/getModelProductionStatisticPic'
}).then(({ data }) => { }).then(({ data }) => {
this.chart3 = echarts.init(this.$refs.chart3); this.chart3 = echarts.init(this.$refs.chart3)
this.setOptions3(data); this.setOptions3(data)
}); })
}, },
setOptions3(resData) { setOptions3(resData) {
// // console.log(resData) // // console.log(resData)
let models = []; let models = []
let adiabat = []; let adiabat = []
let charge = []; let charge = []
let deliver = []; let deliver = []
let assembly = []; let assembly = []
let review = []; let review = []
let settlement = []; let settlement = []
let productionNumber = []; let productionNumber = []
for (let i = 0; i < resData.length; i++) { for (let i = 0; i < resData.length; i++) {
const item = resData[i]; const item = resData[i]
models.push(item.model); models.push(item.model)
adiabat.push(item.realAdiabat); adiabat.push(item.realAdiabat)
charge.push(item.realCharge); charge.push(item.realCharge)
deliver.push(item.realDeliver); deliver.push(item.realDeliver)
assembly.push(item.realAssembly); assembly.push(item.realAssembly)
review.push(item.review); review.push(item.review)
settlement.push(item.settlement); settlement.push(item.settlement)
productionNumber.push(item.productionNumber); productionNumber.push(item.productionNumber)
} }
this.chart3.setOption({ this.chart3.setOption({
tooltip: { tooltip: {
trigger: "axis", trigger: 'axis',
axisPointer: { axisPointer: {
type: "shadow", type: 'shadow'
}, }
}, },
legend: { legend: {
textStyle: { textStyle: {
color: "#fff", //legend字体颜色 color: '#fff' //legend字体颜色
}, }
}, },
grid: { grid: {
left: "3%", left: '3%',
right: "4%", right: '4%',
bottom: "3%", bottom: '3%',
containLabel: true, containLabel: true
}, },
xAxis: { xAxis: {
type: "value", type: 'value',
boundaryGap: [0, 0.01], boundaryGap: [0, 0.01],
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "rgb(255, 255, 255)", color: 'rgb(255, 255, 255)'
}, }
}, }
}, },
yAxis: { yAxis: {
type: "category", type: 'category',
data: models, data: models,
axisLine: { axisLine: {
lineStyle: { lineStyle: {
color: "rgb(255, 255, 255)", color: 'rgb(255, 255, 255)'
}, }
}, }
}, },
color: colorList, color: colorList,
series: [ series: [
{ {
name: "绝热数", name: '绝热数',
type: "bar", type: 'bar',
data: adiabat, data: adiabat
}, },
{ {
name: "装药数", name: '装药数',
type: "bar", type: 'bar',
data: charge, data: charge
}, },
{ {
name: "总装数", name: '总装数',
type: "bar", type: 'bar',
data: assembly, data: assembly
}, },
{ {
name: "交付数(地试数)", name: '交付数(地试数)',
type: "bar", type: 'bar',
data: deliver, data: deliver
}, },
{ {
name: "评审数", name: '评审数',
type: "bar", type: 'bar',
data: review, data: review
}, },
{ {
name: "结算数", name: '结算数',
type: "bar", type: 'bar',
data: settlement, data: settlement
}, },
{ {
name: "生产数", name: '生产数',
type: "bar", type: 'bar',
data: productionNumber, data: productionNumber
}, }
], ]
}); })
}, }
}, },
created() { created() {
const month = new Date().getMonth() + 1; const month = new Date().getMonth() + 1
if (month < 10) { if (month < 10) {
this.prodMonthlyPlan = `${new Date().getFullYear()}-0${month}`; this.prodMonthlyPlan = `${new Date().getFullYear()}-0${month}`
} else { } else {
this.prodMonthlyPlan = `${new Date().getFullYear()}-${month}`; this.prodMonthlyPlan = `${new Date().getFullYear()}-${month}`
} }
this.getData(); this.getData()
}, }
}; }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -808,10 +809,12 @@ export default {
vertical-align: middle; vertical-align: middle;
color: #fff; color: #fff;
background-color: transparent; background-color: transparent;
.el-range-input, .el-range-input,
.el-range-separator { .el-range-separator {
color: #fff; color: #fff;
} }
.el-range-editor.is-active { .el-range-editor.is-active {
border-color: #fff !important; border-color: #fff !important;
} }

163
src/views/bigScreen/securityManage/center.vue
View File

@ -20,12 +20,14 @@
class="con_right" class="con_right"
:style="{ top: v.ordinate + '%', left: v.abscissa + '%' }" :style="{ top: v.ordinate + '%', left: v.abscissa + '%' }"
> >
<div class="con_title con_title_bg1"> <div class="con_title con_title_bg1" v-show="index == activedPointIndex">
<img src="./img/left1/icon.png" alt="" /> <img src="./img/left1/icon.png" alt=""/>
<span style="margin-left: 2px">Ⅰ级：{{ v.pointName }}</span> <span style="margin-left: 2px">Ⅰ级：{{ v.pointName }}</span>
</div> </div>
<div class="com_img" @click="handleItem(v)"> <div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
<img src="./img/left1/icon1.png" alt="" /> @mouseleave="activedPointIndex=-1"
>
<img src="./img/left1/icon1.png" alt=""/>
</div> </div>
</div> </div>
<div <div
@ -33,12 +35,14 @@
class="con_right con_two" class="con_right con_two"
:style="{ top: v.ordinate + '%', left: v.abscissa + '%' }" :style="{ top: v.ordinate + '%', left: v.abscissa + '%' }"
> >
<div class="con_title con_title_bg2"> <div class="con_title con_title_bg2" v-show="index == activedPointIndex">
<img src="./img/left1/icon.png" alt="" /> <img src="./img/left1/icon.png" alt=""/>
<span style="margin-left: 2px">Ⅱ级：{{ v.pointName }}</span> <span style="margin-left: 2px">Ⅱ级：{{ v.pointName }}</span>
</div> </div>
<div class="com_img" @click="handleItem(v)"> <div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
<img src="./img/left1/icon2.png" alt="" /> @mouseleave="activedPointIndex=-1"
>
<img src="./img/left1/icon2.png" alt=""/>
</div> </div>
</div> </div>
<div <div
@ -46,12 +50,14 @@
class="con_right con_three" class="con_right con_three"
:style="{ top: v.ordinate + '%', left: v.abscissa + '%' }" :style="{ top: v.ordinate + '%', left: v.abscissa + '%' }"
> >
<div class="con_title con_title_bg3"> <div class="con_title con_title_bg3" v-show="index == activedPointIndex">
<img src="./img/left1/icon.png" alt="" /> <img src="./img/left1/icon.png" alt=""/>
<span style="margin-left: 2px">Ⅲ级：{{ v.pointName }}</span> <span style="margin-left: 2px">Ⅲ级：{{ v.pointName }}</span>
</div> </div>
<div class="com_img" @click="handleItem(v)"> <div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
<img src="./img/left1/icon3.png" alt="" /> @mouseleave="activedPointIndex=-1"
>
<img src="./img/left1/icon3.png" alt=""/>
</div> </div>
</div> </div>
</div> </div>
@ -84,8 +90,8 @@
</div> </div>
<div class="box"> <div class="box">
<i <i
>{{ getItem(pointLevelCount, "Ⅰ级").COUNTNUMBER }}/{{ >{{ getItem(pointLevelCount, 'Ⅰ级').COUNTNUMBER }}/{{
getItem(sourceLevelCount, "一级").COUNTNUMBER getItem(sourceLevelCount, '一级').COUNTNUMBER
}}</i }}</i
><span class="num2">个</span> ><span class="num2">个</span>
</div> </div>
@ -96,8 +102,8 @@
</div> </div>
<div class="box"> <div class="box">
<i <i
>{{ getItem(pointLevelCount, "Ⅱ级").COUNTNUMBER }}/{{ >{{ getItem(pointLevelCount, 'Ⅱ级').COUNTNUMBER }}/{{
getItem(sourceLevelCount, "二级").COUNTNUMBER getItem(sourceLevelCount, '二级').COUNTNUMBER
}}</i }}</i
><span class="num2">个</span> ><span class="num2">个</span>
</div> </div>
@ -108,8 +114,8 @@
</div> </div>
<div class="box"> <div class="box">
<i <i
>{{ getItem(pointLevelCount, "Ⅲ级").COUNTNUMBER }}/{{ >{{ getItem(pointLevelCount, 'Ⅲ级').COUNTNUMBER }}/{{
getItem(sourceLevelCount, "三级").COUNTNUMBER getItem(sourceLevelCount, '三级').COUNTNUMBER
}}</i }}</i
><span class="num2">个</span> ><span class="num2">个</span>
</div> </div>
@ -117,7 +123,7 @@
<div class="data-item"> <div class="data-item">
<div><span style="font-weight: bold">四级重大危险源</span></div> <div><span style="font-weight: bold">四级重大危险源</span></div>
<div class="box"> <div class="box">
<i>{{ getItem(sourceLevelCount, "四级").COUNTNUMBER }}</i <i>{{ getItem(sourceLevelCount, '四级').COUNTNUMBER }}</i
><span class="num2">个</span> ><span class="num2">个</span>
</div> </div>
</div> </div>
@ -127,73 +133,76 @@
</template> </template>
<script> <script>
import container100 from "../components/container3/index.vue"; import container100 from '../components/container3/index.vue'
import rocketTit from "../components/rocketTit/index.vue"; import rocketTit from '../components/rocketTit/index.vue'
import progressBar from "./../components/progress/index.vue"; import progressBar from './../components/progress/index.vue'
import echarts from 'echarts'
require('echarts/theme/macarons') // echarts theme
import resize from '../../dashboard/mixins/resize'
import echarts from "echarts";
require("echarts/theme/macarons"); // echarts theme
import resize from "../../dashboard/mixins/resize";
export default { export default {
mixins: [resize], mixins: [resize],
name: "left1", name: 'left1',
components: { components: {
container100, container100,
rocketTit, rocketTit,
progressBar, progressBar
}, },
data() { data() {
return { return {
pic: "", pic: '',
activedPointIndex: -1,
pointLevelCount: [ pointLevelCount: [
{ {
name: "Ⅰ级", name: 'Ⅰ级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, },
{ {
name: "Ⅱ级", name: 'Ⅱ级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, },
{ {
name: "Ⅲ级", name: 'Ⅲ级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, }
], ],
sourceLevelCount: [ sourceLevelCount: [
{ {
name: "二级", name: '二级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, },
{ {
name: "三级", name: '三级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, },
{ {
name: "四级", name: '四级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, },
{ {
name: "一级", name: '一级',
COUNTNUMBER: 0, COUNTNUMBER: 0
}, }
], ],
points: [], points: []
}; }
}, },
mounted() { mounted() {
this.$nextTick(() => { this.$nextTick(() => {
this.getData(); this.getData()
// this.initChart3() // this.initChart3()
}); })
}, },
methods: { methods: {
handleItem(item) { handleItem(item) {
this.$bus.emit("getTarget", item); this.$bus.emit('getTarget', item)
}, },
getItem(list, name) { getItem(list, name) {
return list.find((item) => { return list.find((item) => {
return item.name === name; return item.name === name
}); })
// for (let index = 0; index < list.length; index++) { // for (let index = 0; index < list.length; index++) {
// const item = list[index]; // const item = list[index];
// console.log(item.name + "---" + name + "---" + (name == item.name)); // console.log(item.name + "---" + name + "---" + (name == item.name));
@ -205,51 +214,53 @@ export default {
}, },
getData() { getData() {
this.request({ this.request({
url: "/hx/securityManagement/dangerousMap", url: '/hx/securityManagement/dangerousMap',
method: "get", method: 'get'
}).then((res) => { }).then((res) => {
if (200 == res.code) { if (200 == res.code) {
// console.log(res.data); // console.log(res.data);
if (res.data.pointLevelCount) { if (res.data.pointLevelCount) {
this.pointLevelCount = res.data.pointLevelCount; this.pointLevelCount = res.data.pointLevelCount
} }
if (res.data.sourceLevelCount) { if (res.data.sourceLevelCount) {
this.sourceLevelCount = res.data.sourceLevelCount; this.sourceLevelCount = res.data.sourceLevelCount
} }
if (res.data.points) { if (res.data.points) {
this.points = res.data.points; this.points = res.data.points
} }
} }
}); })
this.request({ this.request({
url: "/hx/bigPic/getByType", url: '/hx/bigPic/getByType',
method: "get", method: 'get',
params: { type: 1 }, params: { type: 1 }
}).then((res) => { }).then((res) => {
if (200 == res.code) { if (200 == res.code) {
this.pic = res.data.pic; this.pic = res.data.pic
} }
}); })
}, }
}, },
beforeDestroy() { beforeDestroy() {
//销毁监听事件 //销毁监听事件
this.$bus.off("getTarget"); this.$bus.off('getTarget')
}, }
}; }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.tit { .tit {
padding: 16px 24px; padding: 16px 24px;
} }
.img { .img {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: -1; z-index: -1;
} }
.data { .data {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
@ -257,6 +268,7 @@ export default {
background: rgba(2, 18, 63, 0.33); background: rgba(2, 18, 63, 0.33);
color: #ffffff; color: #ffffff;
font-size: 18px; font-size: 18px;
.data-item { .data-item {
// flex: 1; // flex: 1;
margin-left: 15px; margin-left: 15px;
@ -264,10 +276,12 @@ export default {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
> div { > div {
margin: 5px 0; margin: 5px 0;
text-align: center; text-align: center;
font-size: 16px; font-size: 16px;
img { img {
// width: 10px; // width: 10px;
// height: 10px; // height: 10px;
@ -275,15 +289,18 @@ export default {
margin-right: 5px; margin-right: 5px;
} }
} }
.box { .box {
font-size: 26px; font-size: 26px;
font-family: Roboto-BlackItalic, Roboto; font-family: Roboto-BlackItalic, Roboto;
font-weight: 600; font-weight: 600;
color: #55c5a2; color: #55c5a2;
} }
.num { .num {
font-size: 14px; font-size: 14px;
} }
.num2 { .num2 {
font-size: 16px; font-size: 16px;
margin-left: 5px; margin-left: 5px;
@ -294,10 +311,12 @@ export default {
.container3 { .container3 {
position: relative; position: relative;
.con_right { .con_right {
&:hover { &:hover {
z-index: 10; z-index: 10;
} }
width: 138px; width: 138px;
position: absolute; position: absolute;
top: 41%; top: 41%;
@ -308,41 +327,53 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
cursor: pointer; cursor: pointer;
.con_title { .con_title {
width: 100%; width: 100%;
height: 42px; height: 42px;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
position: absolute;
top: -100%;
z-index: 99999;
img { img {
width: 18px; width: 18px;
height: 18px; height: 18px;
margin-right: 3px; margin-right: 3px;
} }
} }
.con_title_bg1 { .con_title_bg1 {
background: url("./img/left1/1.png") no-repeat; background: url("./img/left1/1.png") no-repeat;
} }
.con_title_bg2 { .con_title_bg2 {
background: url("./img/left1/2.png") no-repeat; background: url("./img/left1/2.png") no-repeat;
} }
.con_title_bg3 { .con_title_bg3 {
background: url("./img/left1/3.png") no-repeat; background: url("./img/left1/3.png") no-repeat;
} }
.com_img { .com_img {
margin-top: 5px; margin-top: 5px;
width: 40px; width: 40px;
height: 40px; height: 40px;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
} }
.con_two { .con_two {
top: 37%; top: 37%;
left: 13%; left: 13%;
} }
.con_three { .con_three {
top: 70%; top: 70%;
right: 16%; right: 16%;

14
src/views/bigScreen/securityManage/center2.vue
View File

@ -17,7 +17,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="4">序号</el-col> --> <el-col style="text-align: center" :span="4">序号</el-col>
<el-col style="text-align: center" :span="8">部门</el-col> <el-col style="text-align: center" :span="8">部门</el-col>
<el-col style="text-align: center" :span="12" <el-col style="text-align: center" :span="12"
>作业内容(周危险)</el-col >作业内容(周危险)</el-col
@ -35,7 +35,9 @@
<ul class="item"> <ul class="item">
<li v-for="(item, index) in scrollList1" :key="index"> <li v-for="(item, index) in scrollList1" :key="index">
<el-row style="font-size: 14px"> <el-row style="font-size: 14px">
<!-- <el-col style="text-align: center" :span="4">{{ item.id }}</el-col> --> <el-col style="text-align: center" :span="4">{{
index + 1
}}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.deptName" :title="item.deptName"
@ -63,7 +65,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="4">序号</el-col> --> <el-col style="text-align: center" :span="4">序号</el-col>
<el-col style="text-align: center" :span="8">部门</el-col> <el-col style="text-align: center" :span="8">部门</el-col>
<el-col style="text-align: center" :span="12" <el-col style="text-align: center" :span="12"
>作业内容(月重点)</el-col >作业内容(月重点)</el-col
@ -81,9 +83,9 @@
<ul class="item"> <ul class="item">
<li v-for="(item, index) in scrollList2" :key="index"> <li v-for="(item, index) in scrollList2" :key="index">
<el-row style="font-size: 14px"> <el-row style="font-size: 14px">
<!-- <el-col style="text-align: center" :span="4">{{ <el-col style="text-align: center" :span="4">{{
item.id index + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.deptName" :title="item.deptName"

8
src/views/bigScreen/securityManage/left1.vue
View File

@ -66,7 +66,7 @@
background: rgba(0, 255, 255, 0.3); background: rgba(0, 255, 255, 0.3);
" "
> >
<!-- <el-col style="text-align: center" :span="3">序号</el-col> --> <el-col style="text-align: center" :span="3">序号</el-col>
<el-col style="text-align: center" :span="7">危险点</el-col> <el-col style="text-align: center" :span="7">危险点</el-col>
<el-col style="text-align: center" :span="7">危险级别</el-col> <el-col style="text-align: center" :span="7">危险级别</el-col>
<el-col style="text-align: center" :span="7">运行状态</el-col> <el-col style="text-align: center" :span="7">运行状态</el-col>
@ -83,9 +83,9 @@
<ul class="item"> <ul class="item">
<li v-for="(item, index) in points" :key="index"> <li v-for="(item, index) in points" :key="index">
<el-row> <el-row>
<!-- <el-col style="text-align: center" :span="3">{{ <el-col style="text-align: center" :span="3">{{
item.id index + 1
}}</el-col> --> }}</el-col>
<el-col <el-col
style="text-align: center" style="text-align: center"
:title="item.pointName" :title="item.pointName"

611
src/views/chartList/page1/center1.vue
View File

@ -1,52 +1,116 @@
<template> <template>
<div> <div>
<el-row :gutter="20"> <el-row :gutter="20">
<!--用户数据--> <!--用户数据-->
<el-col :span="24" :xs="24"> <el-col :span="24" :xs="24">
<!-- <el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button> <el-button
</el-col> type="primary"
</el-row> --> plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
>新增</el-button
>
</el-col>
</el-row>
<el-table v-loading="loading" :data="userList"> <el-table v-loading="loading" :data="userList">
<el-table-column label="序号" align="center" type="index" width="80"/> <el-table-column
<el-table-column label="图片" align="center" prop="bigPic" width="100"> label="序号"
<template slot-scope="scope"> align="center"
<el-image style="width: 100px; height: 100px" :src="scope.row.bigPic" fit="cover"></el-image> type="index"
</template> width="80"
</el-table-column> />
<el-table-column label="年份" align="center" prop="year" width="100" /> <el-table-column
<el-table-column label="收入（万）" align="center" prop="completedIncome" width="100" /> label="图片"
<el-table-column label="目标收入（万）" align="center" prop="targetIncome" /> align="center"
<el-table-column label="利润（万）" align="center" prop="completedProfit" /> prop="bigPic"
<el-table-column label="目标利润（万）" align="center" prop="targetProfit" /> width="100"
<el-table-column label="装药量（万件）" align="center" prop="completedChargeQuantity" /> >
<el-table-column label="目标装药量（万件）" align="center" prop="targetChargeQuantity" /> <template slot-scope="scope">
<el-table-column label="交付数量（万件）" align="center" prop="completedDeliveryQuantity" /> <el-image
<el-table-column label="目标交付数量（万件）" align="center" prop="targetDeliveryQuantity" /> style="width: 100px; height: 100px"
<el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width"> :src="scope.row.bigPic"
<template slot-scope="scope"> fit="cover"
<el-button ></el-image>
size="mini" </template>
type="text" </el-table-column>
icon="el-icon-edit" <el-table-column
@click="handleUpdate(scope.row)" label="年份"
v-hasPermi="['system:user:edit']" align="center"
>修改</el-button prop="year"
> width="100"
<!-- <el-button />
<el-table-column
label="收入（万）"
align="center"
prop="completedIncome"
width="100"
/>
<el-table-column
label="目标收入（万）"
align="center"
prop="targetIncome"
/>
<el-table-column
label="利润（万）"
align="center"
prop="completedProfit"
/>
<el-table-column
label="目标利润（万）"
align="center"
prop="targetProfit"
/>
<el-table-column
label="装药量（万件）"
align="center"
prop="completedChargeQuantity"
/>
<el-table-column
label="目标装药量（万件）"
align="center"
prop="targetChargeQuantity"
/>
<el-table-column
label="交付数量（万件）"
align="center"
prop="completedDeliveryQuantity"
/>
<el-table-column
label="目标交付数量（万件）"
align="center"
prop="targetDeliveryQuantity"
/>
<el-table-column
label="操作"
align="center"
width="160"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:user:edit']"
>修改</el-button
>
<!-- <el-button
size="mini" size="mini"
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
>删除</el-button >删除</el-button
> --> > -->
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- <pagination <!-- <pagination
v-show="total > 0" v-show="total > 0"
:total="total" :total="total"
:autoScroll="false" :autoScroll="false"
@ -55,219 +119,268 @@
:limit.sync="queryParams.pageSize" :limit.sync="queryParams.pageSize"
@pagination="getList" @pagination="getList"
/> --> /> -->
</el-col> </el-col>
</el-row> </el-row>
<!-- 添加或修改参数配置对话框 --> <!-- 添加或修改参数配置对话框 -->
<el-dialog :title="title" :visible.sync="open" width="40%" append-to-body> <el-dialog :title="title" :visible.sync="open" width="60%" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="收入" prop="completedIncome"> <el-form-item label="收入" prop="completedIncome">
<el-input v-model="form.completedIncome" placeholder="请输入收入" maxlength="30"> <el-input
<template slot="append">万</template> v-model="form.completedIncome"
</el-input> placeholder="请输入收入"
</el-form-item> maxlength="30"
</el-col> >
<el-col :span="12"> <template slot="append">万</template>
<el-form-item label="目标收入" prop="targetIncome"> </el-input>
<el-input v-model="form.targetIncome" placeholder="请输入目标收入"> </el-form-item>
<template slot="append">万</template> </el-col>
</el-input> <el-col :span="12">
</el-form-item> <el-form-item label="目标收入" prop="targetIncome">
</el-col> <el-input
</el-row> v-model="form.targetIncome"
<el-row> placeholder="请输入目标收入"
<el-col :span="12"> >
<el-form-item label="利润" prop="completedProfit"> <template slot="append">万</template>
<el-input v-model="form.completedProfit" placeholder="请输入利润"> </el-input>
<template slot="append">万</template> </el-form-item>
</el-input> </el-col>
</el-form-item> </el-row>
</el-col> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="目标利润" prop="targetProfit"> <el-form-item label="利润" prop="completedProfit">
<el-input v-model="form.targetProfit" placeholder="请输入目标利润"> <el-input v-model="form.completedProfit" placeholder="请输入利润">
<template slot="append">万</template> <template slot="append">万</template>
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> <el-col :span="12">
<el-row> <el-form-item label="目标利润" prop="targetProfit">
<el-col :span="12"> <el-input
<el-form-item label="装药量" prop="completedChargeQuantity"> v-model="form.targetProfit"
<el-input v-model="form.completedChargeQuantity" placeholder="请输入装药量"> placeholder="请输入目标利润"
<template slot="append">万件</template> >
</el-input> <template slot="append">万</template>
</el-form-item> </el-input>
</el-col> </el-form-item>
<el-col :span="12"> </el-col>
<el-form-item label="目标装药量" prop="targetChargeQuantity"> </el-row>
<el-input v-model="form.targetChargeQuantity" placeholder="请输入目标装药量"> <el-row>
<template slot="append">万件</template> <el-col :span="12">
</el-input> <el-form-item label="装药量" prop="completedChargeQuantity">
</el-form-item> <el-input
</el-col> v-model="form.completedChargeQuantity"
</el-row> placeholder="请输入装药量"
<el-row> >
<el-col :span="12"> <template slot="append">万件</template>
<el-form-item label="交付数量" prop="completedDeliveryQuantity"> </el-input>
<el-input v-model="form.completedDeliveryQuantity" placeholder="请输入交付数量"> </el-form-item>
<template slot="append">万件</template> </el-col>
</el-input> <el-col :span="12">
</el-form-item> <el-form-item label="目标装药量" prop="targetChargeQuantity">
</el-col> <el-input
<el-col :span="12"> v-model="form.targetChargeQuantity"
<el-form-item label="目标交付数量" prop="targetDeliveryQuantity"> placeholder="请输入目标装药量"
<el-input v-model="form.targetDeliveryQuantity" placeholder="请输入目标交付数量"> >
<template slot="append">万件</template> <template slot="append">万件</template>
</el-input> </el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="目标年份" prop="year"> <el-form-item label="交付数量" prop="completedDeliveryQuantity">
<el-date-picker v-model="form.year" type="year" value-format="yyyy" placeholder="选择年"> <el-input
</el-date-picker> v-model="form.completedDeliveryQuantity"
</el-form-item> placeholder="请输入交付数量"
</el-col> >
<el-col :span="12"> <template slot="append">万件</template>
<el-form-item label="图片" prop="bigPic"> </el-input>
<ImageUpload v-model="form.bigPic" :isShowTip="false" :limit="1" /> </el-form-item>
</el-form-item> </el-col>
</el-col> <el-col :span="12">
</el-row> <el-form-item label="目标交付数量" prop="targetDeliveryQuantity">
</el-form> <el-input
<div slot="footer" class="dialog-footer"> v-model="form.targetDeliveryQuantity"
<el-button type="primary" @click="submitForm">确 定</el-button> placeholder="请输入目标交付数量"
<el-button @click="cancel">取 消</el-button> >
</div> <template slot="append">万件</template>
</el-dialog> </el-input>
</div> </el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="目标年份" prop="year">
<el-date-picker
v-model="form.year"
type="year"
value-format="yyyy"
placeholder="选择年"
>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="图片" prop="bigPic">
<ImageUpload
v-model="form.bigPic"
:isShowTip="false"
:limit="1"
/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
import { centerOneList, updateAnnualTarget } from './indexApi' import { addAnnualTarget, centerOneList, updateAnnualTarget } from "./indexApi";
import { getToken } from '@/utils/auth' import { getToken } from "@/utils/auth";
export default { export default {
data() { data() {
return { return {
// 遮罩层 // 遮罩层
loading: true, loading: true,
// 总条数 // 总条数
total: 0, total: 0,
// 用户表格数据 // 用户表格数据
userList: null, userList: null,
// 弹出层标题 // 弹出层标题
title: '', title: "",
// 是否显示弹出层 // 是否显示弹出层
open: false, open: false,
// 表单参数 // 表单参数
form: {}, form: {},
// 查询参数 // 查询参数
queryParams: { queryParams: {
pageNum: 1, pageNum: 1,
pageSize: this.page_size, pageSize: this.page_size,
}, },
// 表单校验 // 表单校验
rules: { rules: {
completedIncome: [{ required: true, message: '收入不能为空', trigger: 'blur' }], completedIncome: [
targetIncome: [{ required: true, message: '目标收入不能为空', trigger: 'blur' }], { required: true, message: "收入不能为空", trigger: "blur" },
completedProfit: [{ required: true, message: '利润不能为空', trigger: 'blur' }], ],
targetProfit: [{ required: true, message: '目标利润不能为空', trigger: 'blur' }], targetIncome: [
completedChargeQuantity: [{ required: true, message: '装药量不能为空', trigger: 'blur' }], { required: true, message: "目标收入不能为空", trigger: "blur" },
targetChargeQuantity: [{ required: true, message: '目标装药量不能为空', trigger: 'blur' }], ],
completedDeliveryQuantity: [{ required: true, message: '交付数量不能为空', trigger: 'blur' }], completedProfit: [
targetDeliveryQuantity: [{ required: true, message: '目标交付数量不能为空', trigger: 'blur' }], { required: true, message: "利润不能为空", trigger: "blur" },
year: [{ required: true, message: '请选择目标年份', trigger: 'change' }], ],
bigPic: [{ required: true, message: '请上传', trigger: 'change' }], targetProfit: [
}, { required: true, message: "目标利润不能为空", trigger: "blur" },
} ],
}, completedChargeQuantity: [
created() { { required: true, message: "装药量不能为空", trigger: "blur" },
this.getList() ],
}, targetChargeQuantity: [
methods: { { required: true, message: "目标装药量不能为空", trigger: "blur" },
/** 查询列表 */ ],
getList() { completedDeliveryQuantity: [
this.loading = true { required: true, message: "交付数量不能为空", trigger: "blur" },
centerOneList(this.queryParams).then(response => { ],
this.userList = response.rows targetDeliveryQuantity: [
this.total = response.total { required: true, message: "目标交付数量不能为空", trigger: "blur" },
this.loading = false ],
}) year: [
}, { required: true, message: "请选择目标年份", trigger: "change" },
// 取消按钮 ],
cancel() { bigPic: [{ required: true, message: "请上传", trigger: "change" }],
this.open = false },
this.reset() };
}, },
// 表单重置 created() {
reset() { this.getList();
this.form = { },
id: undefined, methods: {
bigPic: undefined, /** 查询列表 */
completedIncome: undefined, getList() {
targetIncome: undefined, this.loading = true;
completedProfit: undefined, centerOneList(this.queryParams).then((response) => {
targetProfit: undefined, this.userList = response.rows;
completedChargeQuantity: undefined, this.total = response.total;
targetChargeQuantity: undefined, this.loading = false;
completedDeliveryQuantity: undefined, });
targetDeliveryQuantity: undefined, },
year: undefined, // 取消按钮
} cancel() {
this.resetForm('form') this.open = false;
}, this.reset();
/** 新增按钮操作 */ },
handleAdd() { // 表单重置
this.reset() reset() {
this.open = true this.form = {
this.title = '添加' id: undefined,
}, bigPic: undefined,
/** 修改按钮操作 */ completedIncome: undefined,
handleUpdate(row) { targetIncome: undefined,
this.reset() completedProfit: undefined,
this.form = Object.assign({}, row) targetProfit: undefined,
this.open = true completedChargeQuantity: undefined,
this.title = '修改全年目标' targetChargeQuantity: undefined,
}, completedDeliveryQuantity: undefined,
/** 提交按钮 */ targetDeliveryQuantity: undefined,
submitForm: function () { year: undefined,
this.$refs['form'].validate(valid => { };
if (valid) { this.resetForm("form");
if (this.form.id != undefined) { },
updateAnnualTarget(this.form).then(response => { /** 新增按钮操作 */
this.$modal.msgSuccess('修改成功') handleAdd() {
this.open = false this.reset();
this.getList() this.open = true;
}) this.title = "添加";
} else { },
addUser(this.form).then(response => { /** 修改按钮操作 */
this.$modal.msgSuccess('新增成功') handleUpdate(row) {
this.open = false this.reset();
this.getList() this.form = Object.assign({}, row);
}) this.open = true;
} this.title = "修改全年目标";
} },
}) /** 提交按钮 */
}, submitForm() {
/** 删除按钮操作 */ this.$refs["form"].validate((valid) => {
handleDelete(row) { if (valid) {
const userIds = row.userId || this.ids if (this.form.id != undefined) {
this.$modal updateAnnualTarget(this.form).then((response) => {
.confirm('是否确认删除编号为"' + userIds + '"的数据项？') this.$modal.msgSuccess("修改成功");
.then(function () { this.open = false;
return delUser(userIds) this.getList();
}) });
.then(() => { } else {
this.getList() addAnnualTarget(this.form).then((response) => {
this.$modal.msgSuccess('删除成功') this.$modal.msgSuccess("新增成功");
}) this.open = false;
.catch(() => {}) this.getList();
}, });
}, }
} }
});
},
/** 删除按钮操作 */
handleDelete(row) {
const userIds = row.userId || this.ids;
this.$modal
.confirm('是否确认删除编号为"' + userIds + '"的数据项？')
.then(function () {
return delUser(userIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
},
};
</script> </script>

151
src/views/chartList/page1/indexApi.js
View File

@ -1,134 +1,143 @@
import request from '@/utils/request' import request from "@/utils/request";
/** --------------- left1 --------------- */ /** --------------- left1 --------------- */
// 经营责任书列表 // 经营责任书列表
export function leftOneList(params) { export function leftOneList(params) {
return request({ return request({
url: '/hx/businessResponsibility/list', url: "/hx/businessResponsibility/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function importTemplate() { export function importTemplate() {
return request({ return request({
url: '/hx/businessResponsibility/importTemplate', url: "/hx/businessResponsibility/importTemplate",
}) });
} }
/** --------------- left2 --------------- */ /** --------------- left2 --------------- */
// 收入和利润列表 // 收入和利润列表
export function leftTwoList(params) { export function leftTwoList(params) {
return request({ return request({
url: '/hx/revenueProfit/list', url: "/hx/revenueProfit/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function leftTwoImportTemplate() { export function leftTwoImportTemplate() {
return request({ return request({
url: '/hx/revenueProfit/importTemplate', url: "/hx/revenueProfit/importTemplate",
}) });
} }
/** --------------- center1 --------------- */ /** --------------- center1 --------------- */
// 全年目标和大图列表 // 全年目标和大图列表
export function centerOneList(params) { export function centerOneList(params) {
return request({ return request({
url: '/hx/annualTarget/list', url: "/hx/annualTarget/list",
params, params,
}) });
} }
// 修改全年目标和大图 // 修改全年目标和大图
export function updateAnnualTarget(data) { export function updateAnnualTarget(data) {
return request({ return request({
url: '/hx/annualTarget', url: "/hx/annualTarget",
method: 'put', method: "put",
data, data,
}) });
} }
// 新增全年目标和大图
export function addAnnualTarget(data) {
return request({
url: "/hx/annualTarget",
method: "post",
data,
});
}
/** --------------- center2 --------------- */ /** --------------- center2 --------------- */
// 今日动态列表 // 今日动态列表
export function centerTwoList(params) { export function centerTwoList(params) {
return request({ return request({
url: '/hx/todayDynamic/list', url: "/hx/todayDynamic/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function centerTwoImportTemplate() { export function centerTwoImportTemplate() {
return request({ return request({
url: '/hx/todayDynamic/importTemplate', url: "/hx/todayDynamic/importTemplate",
}) });
} }
/** --------------- center3 --------------- */ /** --------------- center3 --------------- */
// 本月动态列表 // 本月动态列表
export function centerThreeList(params) { export function centerThreeList(params) {
return request({ return request({
url: '/business/hxMonthDynamic/list', url: "/business/hxMonthDynamic/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function centerThreeImportTemplate() { export function centerThreeImportTemplate() {
return request({ return request({
url: '/business/hxMonthDynamic/importTemplate', url: "/business/hxMonthDynamic/importTemplate",
}) });
} }
/** --------------- right1 --------------- */ /** --------------- right1 --------------- */
// 生产责任令 // 生产责任令
export function rightOneList(params) { export function rightOneList(params) {
return request({ return request({
url: '/hx/productionResponsibility/list', url: "/hx/productionResponsibility/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function rightOneImportTemplate() { export function rightOneImportTemplate() {
return request({ return request({
url: '/hx/productionResponsibility/importTemplate', url: "/hx/productionResponsibility/importTemplate",
}) });
} }
/** --------------- right2 --------------- */ /** --------------- right2 --------------- */
// 交付产品完成概况 // 交付产品完成概况
export function rightTwoList(params) { export function rightTwoList(params) {
return request({ return request({
url: '/hx/productCompletion/list', url: "/hx/productCompletion/list",
params, params,
}) });
} }
// 导出模板 // 导出模板
export function rightTwoImportTemplate() { export function rightTwoImportTemplate() {
return request({ return request({
url: '/hx/productCompletion/importTemplate', url: "/hx/productCompletion/importTemplate",
}) });
} }
// 删除交付产品完成概况 // 删除交付产品完成概况
export function rightTwoDel(params) { export function rightTwoDel(params) {
return request({ return request({
url: '/hx/productCompletion', url: "/hx/productCompletion",
method: 'delete', method: "delete",
params, params,
}) });
} }
/** --------------- right3 --------------- */ /** --------------- right3 --------------- */
// 装药量列表 // 装药量列表
export function rightThreeList(params) { export function rightThreeList(params) {
return request({ return request({
url: '/hx/chargeQuantity/list', url: "/hx/chargeQuantity/list",
params, params,
}) });
} }
// 新增装药量 // 新增装药量
export function rightThreeAdd(data) { export function rightThreeAdd(data) {
return request({ return request({
url: '/hx/chargeQuantity', url: "/hx/chargeQuantity",
method: 'post', method: "post",
data, data,
}) });
} }
// 修改装药量 // 修改装药量
export function rightThreeUpdate(data) { export function rightThreeUpdate(data) {
return request({ return request({
url: '/hx/chargeQuantity', url: "/hx/chargeQuantity",
method: 'put', method: "put",
data, data,
}) });
} }

1
src/views/chartList/page1/right2.vue
View File

@ -118,6 +118,7 @@ export default {
}, },
/** 删除按钮操作 */ /** 删除按钮操作 */
handleDelete(row) { handleDelete(row) {
console.log(row);
this.$modal this.$modal
.confirm('是否确认删除编号为"' + row.id + '"的数据项？') .confirm('是否确认删除编号为"' + row.id + '"的数据项？')
.then(function () { .then(function () {