bug fixed
This commit is contained in:
@ -106,11 +106,12 @@ export default {
|
||||
start() {
|
||||
// 每隔一段时间，页码+1，判断是否到最后一页，是则将页码重设为1
|
||||
this.time = setInterval(() => {
|
||||
this.currentPage1 = this.currentPage1 + 1;
|
||||
this.handleCurrentChange(this.currentPage1);
|
||||
if (this.currentPage1 >= this.total / this.pageSize) {
|
||||
this.currentPage1 = 0;
|
||||
this.currentPage1 = 1;
|
||||
} else {
|
||||
this.currentPage1 = this.currentPage1 + 1;
|
||||
}
|
||||
this.handleCurrentChange(this.currentPage1);
|
||||
}, 5000);
|
||||
},
|
||||
end() {
|
||||
@ -130,15 +131,70 @@ export default {
|
||||
url: "/hx/cockpitOverview/businessResponsibility",
|
||||
method: "get",
|
||||
}).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;
|
||||
// console.log(res.data);
|
||||
|
||||
// TODO: 分页
|
||||
this.total = this.res.list.length;
|
||||
for (let i = 0; i < this.res.list.length; i++) {
|
||||
const item = this.res.list[i];
|
||||
this.titData.push(item.indicator_name);
|
||||
this.valData.push({
|
||||
value: item.cate,
|
||||
// TODO:
|
||||
// value: item.rate,
|
||||
value: item.completedTasks,
|
||||
name: item.indicator_name,
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
|
||||
@ -94,7 +94,8 @@ export default {
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{a} <br/>{b}: {c} ({d}%)",
|
||||
// formatter: "{a} <br/>{b}: {c} ({d}%)",
|
||||
formatter: "{a} <br/>{b}: {c}",
|
||||
},
|
||||
color: this.colorList,
|
||||
legend: {
|
||||
|
||||
@ -25,10 +25,11 @@
|
||||
background: rgba(0, 255, 255, 0.3);
|
||||
"
|
||||
>
|
||||
<!-- <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="3">序号</el-col>
|
||||
<el-col style="text-align: center" :span="4">月份</el-col>
|
||||
<el-col style="text-align: center" :span="6">责任令</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-col>
|
||||
<vue-seamless-scroll
|
||||
@ -37,27 +38,31 @@
|
||||
class="warp-scroll"
|
||||
:class-option="{
|
||||
singleHeight: 43,
|
||||
limitMoveNum: 4,
|
||||
}"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
index + 1
|
||||
}}</el-col>
|
||||
<el-col style="text-align: center" :span="4">{{
|
||||
item.month
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:span="7"
|
||||
:span="6"
|
||||
:title="item.responsibilityContent"
|
||||
>{{ item.responsibilityContent }}</el-col
|
||||
>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:span="7"
|
||||
:span="6"
|
||||
:title="item.deptName"
|
||||
>{{ item.deptName }}</el-col
|
||||
>
|
||||
<el-col style="text-align: center" :span="7">
|
||||
<el-col style="text-align: center" :span="5">
|
||||
<section class="box">
|
||||
<span
|
||||
v-if="item.completionStatus == '已完成'"
|
||||
@ -124,7 +129,7 @@
|
||||
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> -->
|
||||
@ -141,11 +146,11 @@
|
||||
style="height: 168px"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.projectName"
|
||||
|
||||
@ -35,7 +35,7 @@
|
||||
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="7">时间</el-col>
|
||||
@ -50,11 +50,11 @@
|
||||
}"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.planName"
|
||||
|
||||
@ -67,7 +67,7 @@
|
||||
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="7">时间</el-col>
|
||||
@ -84,11 +84,11 @@
|
||||
style="height: 168px"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.projectName"
|
||||
|
||||
@ -68,7 +68,7 @@
|
||||
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="3">数量</el-col>
|
||||
<el-col style="text-align: center" :span="5">金额</el-col>
|
||||
@ -83,11 +83,11 @@
|
||||
}"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.contractName"
|
||||
|
||||
@ -49,8 +49,8 @@
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; height: 100%" v-else>
|
||||
<div style="height: 100%; width: 75%" ref="chart2"></div>
|
||||
<div
|
||||
<div style="height: 100%; width: 100%" ref="chart2"></div>
|
||||
<!-- <div
|
||||
style="
|
||||
height: 100%;
|
||||
width: 25%;
|
||||
@ -66,7 +66,7 @@
|
||||
</div>
|
||||
<progressBar :percentage="80" style="margin: 10px 0 20px" />
|
||||
<i class="num">80%</i>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</container2>
|
||||
<container2 title="信息公示" style="margin-top: 10px">
|
||||
@ -87,7 +87,7 @@
|
||||
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="7">团队</el-col>
|
||||
@ -104,11 +104,11 @@
|
||||
style="height: 168px"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.projectName"
|
||||
@ -158,7 +158,7 @@
|
||||
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>
|
||||
@ -174,11 +174,11 @@
|
||||
style="height: 168px"
|
||||
>
|
||||
<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-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col style="text-align: center" :span="7">{{
|
||||
item.deptName
|
||||
}}</el-col>
|
||||
@ -308,6 +308,11 @@ export default {
|
||||
let { rate, list } = res.data;
|
||||
if (rate) {
|
||||
this.rate = rate;
|
||||
} else {
|
||||
this.rate = {
|
||||
comprehensiveRate: 0,
|
||||
performanceRate: 0,
|
||||
};
|
||||
}
|
||||
this.chart = echarts.init(this.$refs.chart);
|
||||
this.chart.setOption({
|
||||
@ -461,7 +466,21 @@ export default {
|
||||
this.chart2 = echarts.init(this.$refs.chart2);
|
||||
this.setOptions2();
|
||||
},
|
||||
setOptions2() {
|
||||
async setOptions2() {
|
||||
let params = { type: 1 };
|
||||
// if (month) {
|
||||
// params["month"] = month;
|
||||
// }
|
||||
const res = await this.request({
|
||||
url: "/hx/operating/getComprehensivePlanPic",
|
||||
method: "get",
|
||||
params: params,
|
||||
});
|
||||
if (200 == res.code) {
|
||||
let { rate, list } = res.data;
|
||||
// if (rate) {
|
||||
// this.rate = rate;
|
||||
// }
|
||||
this.chart2.setOption({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
@ -490,15 +509,7 @@ export default {
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
data: [
|
||||
"部门5",
|
||||
"部门二",
|
||||
"部门三",
|
||||
"部门四",
|
||||
"部门五",
|
||||
"部门六",
|
||||
"部门七",
|
||||
],
|
||||
data: list.map((e) => e.deptName),
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
@ -509,6 +520,7 @@ export default {
|
||||
yAxis: [
|
||||
{
|
||||
name: "个",
|
||||
max: "dataMax",
|
||||
splitLine: {
|
||||
show: true,
|
||||
// 改变轴线颜色
|
||||
@ -559,7 +571,7 @@ export default {
|
||||
color: "#F64F58",
|
||||
},
|
||||
barWidth: 30,
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
data: list.map((el) => el.performancePlanCompleted),
|
||||
},
|
||||
{
|
||||
name: "综合",
|
||||
@ -572,19 +584,45 @@ export default {
|
||||
color: "#F6D97E",
|
||||
},
|
||||
barWidth: 30,
|
||||
data: [150, 232, 201, 154, 190, 330, 410],
|
||||
data: list.map((el) => el.comprehensivePlanCompleted),
|
||||
},
|
||||
{
|
||||
name: "完成率",
|
||||
type: "scatter",
|
||||
name: "综合完成率",
|
||||
// type: "scatter",
|
||||
type: "line",
|
||||
symbol: "rect",
|
||||
symbolSize: [30, 4],
|
||||
symbolOffset: [0, 0],
|
||||
position: [0, 0],
|
||||
itemStyle: {
|
||||
color: "#7EA7FC",
|
||||
color: "#F6D97E",
|
||||
},
|
||||
data: [600, 650, 700, 750, 800, 750, 700],
|
||||
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: '',
|
||||
@ -608,6 +646,7 @@ export default {
|
||||
// },
|
||||
],
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
@ -42,7 +42,7 @@
|
||||
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="12">案例名称</el-col>
|
||||
</el-row>
|
||||
@ -56,11 +56,11 @@
|
||||
}"
|
||||
>
|
||||
<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-col style="text-align: center" :span="4">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="4">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col style="text-align: center" :span="8">{{
|
||||
item.className
|
||||
}}</el-col>
|
||||
|
||||
@ -93,102 +93,103 @@
|
||||
</div>
|
||||
</div>
|
||||
<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-popover>
|
||||
</container3>
|
||||
</template>
|
||||
<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 {
|
||||
components: {
|
||||
container3, //#endregion,
|
||||
vueSeamlessScroll,
|
||||
vueSeamlessScroll
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pic: "",
|
||||
pic: '',
|
||||
listData: [],
|
||||
listData2: [],
|
||||
flvPlayer: null,
|
||||
};
|
||||
flvPlayer: null
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getList() {
|
||||
this.request({
|
||||
url: "/hx/scientificProduction/getHxWorkHomePic",
|
||||
url: '/hx/scientificProduction/getHxWorkHomePic'
|
||||
}).then(({ data }) => {
|
||||
// data.map((item) => {
|
||||
// item.avAddress =
|
||||
// "http://192.168.0.151:81/stream/live/classic_cases_video.flv";
|
||||
// });
|
||||
this.listData = data;
|
||||
});
|
||||
this.listData = data
|
||||
})
|
||||
},
|
||||
handleShow(index) {
|
||||
this.hadleHide();
|
||||
this.listData2 = this.listData[index]["userList"];
|
||||
this.hadleHide()
|
||||
this.listData2 = this.listData[index]['userList']
|
||||
setTimeout(() => {
|
||||
if (flvjs.isSupported()) {
|
||||
this.flvPlayer = flvjs.createPlayer(
|
||||
{
|
||||
type: "flv", // 媒体类型 flv 或 mp4
|
||||
type: 'flv', // 媒体类型 flv 或 mp4
|
||||
isLive: true, // 是否为直播流
|
||||
fluid: true,
|
||||
// hasAudio: true, // 是否开启声音
|
||||
stashInitialSize: 128, // 减少首桢显示等待时长
|
||||
url: this.listData[index]["avAddress"],
|
||||
url: this.listData[index]['avAddress']
|
||||
},
|
||||
{
|
||||
enableStashBuffer: false,
|
||||
fixAudioTimestampGap: false,
|
||||
isLive: true,
|
||||
isLive: true
|
||||
}
|
||||
);
|
||||
let all = document.querySelectorAll("#videoElement");
|
||||
let videoElement = all[all.length - 1];
|
||||
this.flvPlayer.attachMediaElement(videoElement);
|
||||
this.flvPlayer.load();
|
||||
this.flvPlayer.play();
|
||||
)
|
||||
let all = document.querySelectorAll('#videoElement')
|
||||
let videoElement = all[all.length - 1]
|
||||
this.flvPlayer.attachMediaElement(videoElement)
|
||||
this.flvPlayer.load()
|
||||
this.flvPlayer.play()
|
||||
}
|
||||
}, 0);
|
||||
}, 0)
|
||||
},
|
||||
hadleHide() {
|
||||
if (this.flvPlayer) {
|
||||
this.flvPlayer.pause();
|
||||
this.flvPlayer.unload();
|
||||
this.flvPlayer.detachMediaElement();
|
||||
this.flvPlayer.destroy();
|
||||
this.flvPlayer = null;
|
||||
this.flvPlayer.pause()
|
||||
this.flvPlayer.unload()
|
||||
this.flvPlayer.detachMediaElement()
|
||||
this.flvPlayer.destroy()
|
||||
this.flvPlayer = null
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.flvPlayer) {
|
||||
this.flvPlayer.pause();
|
||||
this.flvPlayer.unload();
|
||||
this.flvPlayer.detachMediaElement();
|
||||
this.flvPlayer.destroy();
|
||||
this.flvPlayer = null;
|
||||
this.flvPlayer.pause()
|
||||
this.flvPlayer.unload()
|
||||
this.flvPlayer.detachMediaElement()
|
||||
this.flvPlayer.destroy()
|
||||
this.flvPlayer = null
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getList()
|
||||
this.request({
|
||||
url: "/hx/bigPic/getByType",
|
||||
method: "get",
|
||||
params: { type: 2 },
|
||||
url: '/hx/bigPic/getByType',
|
||||
method: 'get',
|
||||
params: { type: 2 }
|
||||
}).then((res) => {
|
||||
if (200 == res.code) {
|
||||
this.pic = res.data.pic;
|
||||
this.pic = res.data.pic
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.el-popover {
|
||||
@ -200,6 +201,7 @@ export default {
|
||||
.icon_img {
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.el-popover {
|
||||
.box {
|
||||
width: 177px;
|
||||
@ -207,11 +209,13 @@ export default {
|
||||
border-width: 0px 20px 30px 0px;
|
||||
border-style: none solid solid;
|
||||
border-color: transparent transparent rgba(10, 90, 132, 1);
|
||||
|
||||
.tit {
|
||||
height: 30px;
|
||||
padding-left: 16px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
span {
|
||||
margin-left: 8px;
|
||||
color: #fff;
|
||||
@ -219,13 +223,16 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cont {
|
||||
background-color: #0d1049;
|
||||
padding: 8px 13px 11px 16px;
|
||||
|
||||
video {
|
||||
width: 100%;
|
||||
height: 143px;
|
||||
}
|
||||
|
||||
.user_box {
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
@ -239,24 +246,30 @@ export default {
|
||||
rgba(6, 116, 151, 0.91) 60%,
|
||||
#00ffff 146%
|
||||
);
|
||||
|
||||
span:nth-child(1) {
|
||||
float: left;
|
||||
}
|
||||
|
||||
span:nth-child(2) {
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.warp-scroll {
|
||||
// height: 100px;
|
||||
margin: 0 auto;
|
||||
margin-top: 25px;
|
||||
overflow: hidden;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0;
|
||||
margin: 0 auto;
|
||||
|
||||
&.ul-item {
|
||||
display: flex;
|
||||
|
||||
.li-item {
|
||||
width: 42px;
|
||||
// height: 120px;
|
||||
@ -265,6 +278,7 @@ export default {
|
||||
// background-color: #999;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
|
||||
.one_hidden {
|
||||
word-break: keep-all;
|
||||
white-space: nowrap;
|
||||
|
||||
BIN
src/views/bigScreen/scientific/tab1/icon1.png
Normal file
BIN
src/views/bigScreen/scientific/tab1/icon1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
@ -10,7 +10,7 @@
|
||||
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="3">现有库存</el-col>
|
||||
<el-col style="text-align: center" :span="6"
|
||||
@ -27,11 +27,11 @@
|
||||
:class-option="{ singleHeight: 42 }"
|
||||
>
|
||||
<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-col style="text-align: center" :span="4">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="4">{{
|
||||
idx + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.materialName"
|
||||
|
||||
@ -41,34 +41,34 @@
|
||||
</container1>
|
||||
<container1 style="margin-right: 14px" title="单台产品信息">
|
||||
<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>
|
||||
</container1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import container1 from "./components/container1/index.vue";
|
||||
import progressBar from "@/views/bigScreen/components/progress/index.vue";
|
||||
import bigScreenTabs from "../../components/bigScreenTabs/index.vue";
|
||||
import vueSeamlessScroll from "vue-seamless-scroll";
|
||||
import colorList from "@/utils/colorPalette";
|
||||
import container1 from './components/container1/index.vue'
|
||||
import progressBar from '@/views/bigScreen/components/progress/index.vue'
|
||||
import bigScreenTabs from '../../components/bigScreenTabs/index.vue'
|
||||
import vueSeamlessScroll from 'vue-seamless-scroll'
|
||||
import colorList from '@/utils/colorPalette'
|
||||
import {
|
||||
blueColorList,
|
||||
greenColorList,
|
||||
yelloColorList,
|
||||
redColorList,
|
||||
} from "@/utils/gradualColor";
|
||||
redColorList
|
||||
} 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 {
|
||||
components: {
|
||||
container1, //#endregion,
|
||||
progressBar,
|
||||
bigScreenTabs,
|
||||
vueSeamlessScroll,
|
||||
vueSeamlessScroll
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -80,211 +80,212 @@ export default {
|
||||
chart3: null,
|
||||
listData: [1, 2, 3, 4, 5, 6, 7, 8],
|
||||
customColor: colorList,
|
||||
prodMonthlyPlan: "", //
|
||||
};
|
||||
prodMonthlyPlan: '' //
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.initChart();
|
||||
this.initChart2(this.prodMonthlyPlan);
|
||||
this.initChart3();
|
||||
});
|
||||
this.initChart()
|
||||
this.initChart2(this.prodMonthlyPlan)
|
||||
this.initChart3()
|
||||
})
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
beforeDestroy() {},
|
||||
methods: {
|
||||
getData() {
|
||||
this.request({
|
||||
url: "/hx/scientificProduction/getProductPic",
|
||||
url: '/hx/scientificProduction/getProductPic'
|
||||
}).then(({ data }) => {
|
||||
this.dataInfo = data;
|
||||
});
|
||||
this.dataInfo = data
|
||||
})
|
||||
},
|
||||
|
||||
initChart() {
|
||||
this.request({
|
||||
url: "/hx/scientificProduction/getModelYearPlanPic",
|
||||
url: '/hx/scientificProduction/getModelYearPlanPic'
|
||||
}).then(({ data }) => {
|
||||
this.chart = echarts.init(this.$refs.chart);
|
||||
this.setOptions(data);
|
||||
});
|
||||
this.chart = echarts.init(this.$refs.chart)
|
||||
this.setOptions(data)
|
||||
})
|
||||
},
|
||||
setOptions(resData) {
|
||||
let titList = [];
|
||||
let realCharge = []; // 实际装药量
|
||||
let realDeliver = []; // 实际支付
|
||||
let chargeRate = []; // 装药量率
|
||||
let deliverRate = []; // 支付率
|
||||
let titList = []
|
||||
let realCharge = [] // 实际装药量
|
||||
let realDeliver = [] // 实际支付
|
||||
let chargeRate = [] // 装药量率
|
||||
let deliverRate = [] // 支付率
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i];
|
||||
titList.push(item.productModel);
|
||||
realCharge.push(item.realCharge);
|
||||
realDeliver.push(item.realDeliver);
|
||||
chargeRate.push(item.chargeRate);
|
||||
deliverRate.push(item.deliverRate);
|
||||
const item = resData[i]
|
||||
titList.push(item.productModel)
|
||||
realCharge.push(item.realCharge)
|
||||
realDeliver.push(item.realDeliver)
|
||||
chargeRate.push(item.chargeRate)
|
||||
deliverRate.push(item.deliverRate)
|
||||
}
|
||||
this.chart.setOption({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: "shadow",
|
||||
type: 'shadow'
|
||||
},
|
||||
formatter: "{b0}<br /> {a0}:{c0}%<br />{a1}: {c1}%",
|
||||
formatter: '{b0}<br /> {a0}:{c0}%<br />{a1}: {c1}%'
|
||||
},
|
||||
legend: {
|
||||
textStyle: {
|
||||
color: "#fff", //legend字体颜色
|
||||
},
|
||||
color: '#fff' //legend字体颜色
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
top: 30,
|
||||
left: "3%",
|
||||
right: "4%",
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: 20,
|
||||
containLabel: true,
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
show: false,
|
||||
show: false
|
||||
// type: 'value',
|
||||
// splitLine: {
|
||||
// show: false, //不显示网格线
|
||||
// },
|
||||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
type: 'category',
|
||||
boundaryGap: true,
|
||||
splitLine: {
|
||||
show: false, // 不显示网格线
|
||||
show: false // 不显示网格线
|
||||
},
|
||||
axisTick: {
|
||||
show: false, // y轴刻度线
|
||||
show: false // y轴刻度线
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
color: 'rgb(255, 255, 255)'
|
||||
}
|
||||
},
|
||||
data: titList
|
||||
},
|
||||
data: titList,
|
||||
},
|
||||
color: ["#55C5A2", "#55C5A2"],
|
||||
color: ['#55C5A2', '#55C5A2'],
|
||||
series: [
|
||||
{
|
||||
roundCap: true, // 没效果
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: "rgba(180, 180, 180, 0.2)",
|
||||
color: 'rgba(180, 180, 180, 0.2)'
|
||||
},
|
||||
name: "装药",
|
||||
type: "bar",
|
||||
stack: "total",
|
||||
name: '装药',
|
||||
type: 'bar',
|
||||
stack: 'total',
|
||||
// label: {
|
||||
// show: true,
|
||||
// },
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
barWidth: 12,
|
||||
data: chargeRate,
|
||||
color: "#F6D97E",
|
||||
color: '#F6D97E'
|
||||
},
|
||||
{
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: "rgba(180, 180, 180, 0.2)",
|
||||
color: 'rgba(180, 180, 180, 0.2)'
|
||||
},
|
||||
name: "交付",
|
||||
type: "bar",
|
||||
stack: "total",
|
||||
name: '交付',
|
||||
type: 'bar',
|
||||
stack: 'total',
|
||||
// label: {
|
||||
// show: true,
|
||||
// },
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
barWidth: 12,
|
||||
data: deliverRate,
|
||||
color: "#55C5A2",
|
||||
},
|
||||
],
|
||||
});
|
||||
color: '#55C5A2'
|
||||
}
|
||||
]
|
||||
})
|
||||
},
|
||||
|
||||
initChart2(month) {
|
||||
this.request({
|
||||
url: "/hx/scientificProduction/getProductionPlanPic?month=" + month,
|
||||
url: '/hx/scientificProduction/getProductionPlanPic?month=' + month
|
||||
}).then(({ data }) => {
|
||||
this.chart2 = echarts.init(this.$refs.chart2);
|
||||
this.setOptions2(data);
|
||||
});
|
||||
this.chart2 = echarts.init(this.$refs.chart2)
|
||||
this.setOptions2(data)
|
||||
})
|
||||
// 测试数据
|
||||
const data2 = {
|
||||
allMonth: ["2021-01", "2021-02"],
|
||||
allMonth: ['2021-01', '2021-02'],
|
||||
list: [
|
||||
{
|
||||
"2021-01": [
|
||||
'2021-01': [
|
||||
{
|
||||
id: 1,
|
||||
month: "2021-01",
|
||||
productModel: "型号1",
|
||||
adiabat: "10",
|
||||
charge: "11",
|
||||
assembly: "12",
|
||||
deliver: "13",
|
||||
month: '2021-01',
|
||||
productModel: '型号1',
|
||||
adiabat: '10',
|
||||
charge: '11',
|
||||
assembly: '12',
|
||||
deliver: '13'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
month: "2021-01",
|
||||
productModel: "型号2",
|
||||
adiabat: "16",
|
||||
charge: "17",
|
||||
assembly: "18",
|
||||
deliver: "19",
|
||||
},
|
||||
],
|
||||
month: '2021-01',
|
||||
productModel: '型号2',
|
||||
adiabat: '16',
|
||||
charge: '17',
|
||||
assembly: '18',
|
||||
deliver: '19'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"2021-02": [
|
||||
'2021-02': [
|
||||
{
|
||||
id: 10,
|
||||
month: "2021-02",
|
||||
productModel: "型号1",
|
||||
adiabat: "20",
|
||||
charge: "21",
|
||||
assembly: "22",
|
||||
deliver: "23",
|
||||
month: '2021-02',
|
||||
productModel: '型号1',
|
||||
adiabat: '20',
|
||||
charge: '21',
|
||||
assembly: '22',
|
||||
deliver: '23'
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
month: "2021-02",
|
||||
productModel: "型号2",
|
||||
adiabat: "26",
|
||||
charge: "27",
|
||||
assembly: "28",
|
||||
deliver: "29",
|
||||
},
|
||||
month: '2021-02',
|
||||
productModel: '型号2',
|
||||
adiabat: '26',
|
||||
charge: '27',
|
||||
assembly: '28',
|
||||
deliver: '29'
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
},
|
||||
],
|
||||
allModel: ["型号1", "型号2"],
|
||||
};
|
||||
allModel: ['型号1', '型号2']
|
||||
}
|
||||
},
|
||||
setOptions2(resData) {
|
||||
const xAixsList = resData.map((el) => el.productModel); // 横坐标列表
|
||||
const xAixsList = resData.map((el) => el.productModel) // 横坐标列表
|
||||
|
||||
const adiabatList = []; // 绝热
|
||||
adiabatList.push(resData.map((el) => el.realAdiabat)); // 实际
|
||||
adiabatList.push(resData.map((el) => el.forecastAdiabat)); // 预测
|
||||
const adiabatList = [] // 绝热
|
||||
adiabatList.push(resData.map((el) => el.realAdiabat)) // 实际
|
||||
adiabatList.push(resData.map((el) => el.forecastAdiabat)) // 预测
|
||||
|
||||
const deliverList = [];
|
||||
deliverList.push(resData.map((el) => el.realDeliver)); // 交付数量列表
|
||||
deliverList.push(resData.map((el) => el.forecastDeliver)); // 交付数量列表
|
||||
const deliverList = []
|
||||
deliverList.push(resData.map((el) => el.realDeliver)) // 交付数量列表
|
||||
deliverList.push(resData.map((el) => el.forecastDeliver)) // 交付数量列表
|
||||
|
||||
const chargeList = [];
|
||||
chargeList.push(resData.map((el) => el.realCharge)); //装药数量列表
|
||||
chargeList.push(resData.map((el) => el.forecastCharge)); //装药数量列表
|
||||
const assemblyList = [];
|
||||
assemblyList.push(resData.map((el) => el.realAssembly)); // 总装数列表
|
||||
assemblyList.push(resData.map((el) => el.forecastAssembly)); // 总装数列表
|
||||
const chargeList = []
|
||||
chargeList.push(resData.map((el) => el.realCharge)) //装药数量列表
|
||||
chargeList.push(resData.map((el) => el.forecastCharge)) //装药数量列表
|
||||
const assemblyList = []
|
||||
assemblyList.push(resData.map((el) => el.realAssembly)) // 总装数列表
|
||||
assemblyList.push(resData.map((el) => el.forecastAssembly)) // 总装数列表
|
||||
// // console.log(adiabatList);
|
||||
// // return;
|
||||
// let adiabat = []; // 绝热数量
|
||||
@ -335,38 +336,38 @@ export default {
|
||||
this.chart2.setOption({
|
||||
tooltip: {
|
||||
formatter: (params, ticket, callback) => {
|
||||
const type = ["实际", "预测"];
|
||||
const type = ['实际', '预测']
|
||||
// // console.log(type[params.dataIndex]);
|
||||
// console.log(params.seriesIndex % 2);
|
||||
|
||||
let seriesName = params.seriesName;
|
||||
let newSeriesName = seriesName.split(",");
|
||||
let name = params.name;
|
||||
let num = params.value;
|
||||
let seriesName = params.seriesName
|
||||
let newSeriesName = seriesName.split(',')
|
||||
let name = params.name
|
||||
let num = params.value
|
||||
return `
|
||||
<div>
|
||||
<div>${name}</div>
|
||||
|
||||
<div>${type[params.seriesIndex % 2]} ${num}</div>
|
||||
</div>
|
||||
`;
|
||||
},
|
||||
`
|
||||
}
|
||||
// <div><span style="display:inline-block;margin-right:5px;width:10px;height:10px;background-color:${
|
||||
// params.color
|
||||
// };"></span> ${newSeriesName[0]} ${num}</div>
|
||||
},
|
||||
legend: {
|
||||
data: ["绝热", "装药", "总装", "交付"],
|
||||
data: ['绝热', '装药', '总装', '交付'],
|
||||
textStyle: {
|
||||
color: "#fff", //legend字体颜色
|
||||
},
|
||||
color: '#fff' //legend字体颜色
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: 0,
|
||||
right: 10,
|
||||
top: 10,
|
||||
bottom: 50,
|
||||
containLabel: true,
|
||||
containLabel: true
|
||||
},
|
||||
// dataZoom: {
|
||||
// type: 'slider',
|
||||
@ -391,96 +392,96 @@ export default {
|
||||
// ],
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
type: 'category',
|
||||
data: xAixsList,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
},
|
||||
},
|
||||
},
|
||||
color: 'rgb(255, 255, 255)'
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
name: "",
|
||||
name: '',
|
||||
splitLine: {
|
||||
show: true,
|
||||
// 改变轴线颜色
|
||||
lineStyle: {
|
||||
// 使用深浅的间隔色
|
||||
color: ["rgba(255, 255, 255,.5)"],
|
||||
},
|
||||
color: ['rgba(255, 255, 255,.5)']
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
formatter: "{value}",
|
||||
formatter: '{value}'
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
},
|
||||
},
|
||||
color: 'rgb(255, 255, 255)'
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
},
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
...adiabatList.map((el, index) => {
|
||||
return {
|
||||
name: "绝热",
|
||||
type: "bar",
|
||||
stack: "adiabat",
|
||||
name: '绝热',
|
||||
type: 'bar',
|
||||
stack: 'adiabat',
|
||||
data: el,
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
itemStyle: {
|
||||
color: blueColorList[index],
|
||||
},
|
||||
};
|
||||
color: blueColorList[index]
|
||||
}
|
||||
}
|
||||
}),
|
||||
...chargeList.map((el, index) => {
|
||||
return {
|
||||
name: "装药",
|
||||
type: "bar",
|
||||
name: '装药',
|
||||
type: 'bar',
|
||||
data: el,
|
||||
stack: "charge",
|
||||
stack: 'charge',
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
itemStyle: {
|
||||
color: yelloColorList[index],
|
||||
},
|
||||
};
|
||||
color: yelloColorList[index]
|
||||
}
|
||||
}
|
||||
}),
|
||||
...assemblyList.map((el, index) => {
|
||||
return {
|
||||
name: "总装",
|
||||
type: "bar",
|
||||
name: '总装',
|
||||
type: 'bar',
|
||||
data: el,
|
||||
stack: "assembly",
|
||||
stack: 'assembly',
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
itemStyle: {
|
||||
color: redColorList[index],
|
||||
},
|
||||
};
|
||||
color: redColorList[index]
|
||||
}
|
||||
}
|
||||
}),
|
||||
...deliverList.map((el, index) => {
|
||||
return {
|
||||
name: "交付",
|
||||
type: "bar",
|
||||
name: '交付',
|
||||
type: 'bar',
|
||||
data: el,
|
||||
stack: "deliver",
|
||||
stack: 'deliver',
|
||||
emphasis: {
|
||||
focus: "series",
|
||||
focus: 'series'
|
||||
},
|
||||
itemStyle: {
|
||||
color: greenColorList[index],
|
||||
},
|
||||
};
|
||||
}),
|
||||
color: greenColorList[index]
|
||||
}
|
||||
}
|
||||
})
|
||||
// {
|
||||
// name: "装药",
|
||||
// type: "bar",
|
||||
@ -670,129 +671,129 @@ export default {
|
||||
// color: blueColorList[3],
|
||||
// },
|
||||
// },
|
||||
],
|
||||
});
|
||||
]
|
||||
})
|
||||
},
|
||||
|
||||
initChart3() {
|
||||
this.request({
|
||||
url: "/hx/scientificProduction/getModelProductionStatisticPic",
|
||||
url: '/hx/scientificProduction/getModelProductionStatisticPic'
|
||||
}).then(({ data }) => {
|
||||
this.chart3 = echarts.init(this.$refs.chart3);
|
||||
this.setOptions3(data);
|
||||
});
|
||||
this.chart3 = echarts.init(this.$refs.chart3)
|
||||
this.setOptions3(data)
|
||||
})
|
||||
},
|
||||
setOptions3(resData) {
|
||||
// // console.log(resData)
|
||||
|
||||
let models = [];
|
||||
let adiabat = [];
|
||||
let charge = [];
|
||||
let deliver = [];
|
||||
let assembly = [];
|
||||
let review = [];
|
||||
let settlement = [];
|
||||
let productionNumber = [];
|
||||
let models = []
|
||||
let adiabat = []
|
||||
let charge = []
|
||||
let deliver = []
|
||||
let assembly = []
|
||||
let review = []
|
||||
let settlement = []
|
||||
let productionNumber = []
|
||||
|
||||
for (let i = 0; i < resData.length; i++) {
|
||||
const item = resData[i];
|
||||
models.push(item.model);
|
||||
adiabat.push(item.realAdiabat);
|
||||
charge.push(item.realCharge);
|
||||
deliver.push(item.realDeliver);
|
||||
assembly.push(item.realAssembly);
|
||||
review.push(item.review);
|
||||
settlement.push(item.settlement);
|
||||
productionNumber.push(item.productionNumber);
|
||||
const item = resData[i]
|
||||
models.push(item.model)
|
||||
adiabat.push(item.realAdiabat)
|
||||
charge.push(item.realCharge)
|
||||
deliver.push(item.realDeliver)
|
||||
assembly.push(item.realAssembly)
|
||||
review.push(item.review)
|
||||
settlement.push(item.settlement)
|
||||
productionNumber.push(item.productionNumber)
|
||||
}
|
||||
|
||||
this.chart3.setOption({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: "shadow",
|
||||
},
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
textStyle: {
|
||||
color: "#fff", //legend字体颜色
|
||||
},
|
||||
color: '#fff' //legend字体颜色
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
containLabel: true,
|
||||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: "value",
|
||||
type: 'value',
|
||||
boundaryGap: [0, 0.01],
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
},
|
||||
},
|
||||
color: 'rgb(255, 255, 255)'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
type: 'category',
|
||||
data: models,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "rgb(255, 255, 255)",
|
||||
},
|
||||
},
|
||||
color: 'rgb(255, 255, 255)'
|
||||
}
|
||||
}
|
||||
},
|
||||
color: colorList,
|
||||
series: [
|
||||
{
|
||||
name: "绝热数",
|
||||
type: "bar",
|
||||
data: adiabat,
|
||||
name: '绝热数',
|
||||
type: 'bar',
|
||||
data: adiabat
|
||||
},
|
||||
{
|
||||
name: "装药数",
|
||||
type: "bar",
|
||||
data: charge,
|
||||
name: '装药数',
|
||||
type: 'bar',
|
||||
data: charge
|
||||
},
|
||||
{
|
||||
name: "总装数",
|
||||
type: "bar",
|
||||
data: assembly,
|
||||
name: '总装数',
|
||||
type: 'bar',
|
||||
data: assembly
|
||||
},
|
||||
{
|
||||
name: "交付数(地试数)",
|
||||
type: "bar",
|
||||
data: deliver,
|
||||
name: '交付数(地试数)',
|
||||
type: 'bar',
|
||||
data: deliver
|
||||
},
|
||||
{
|
||||
name: "评审数",
|
||||
type: "bar",
|
||||
data: review,
|
||||
name: '评审数',
|
||||
type: 'bar',
|
||||
data: review
|
||||
},
|
||||
{
|
||||
name: "结算数",
|
||||
type: "bar",
|
||||
data: settlement,
|
||||
name: '结算数',
|
||||
type: 'bar',
|
||||
data: settlement
|
||||
},
|
||||
{
|
||||
name: "生产数",
|
||||
type: "bar",
|
||||
data: productionNumber,
|
||||
},
|
||||
],
|
||||
});
|
||||
},
|
||||
name: '生产数',
|
||||
type: 'bar',
|
||||
data: productionNumber
|
||||
}
|
||||
]
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const month = new Date().getMonth() + 1;
|
||||
const month = new Date().getMonth() + 1
|
||||
if (month < 10) {
|
||||
this.prodMonthlyPlan = `${new Date().getFullYear()}-0${month}`;
|
||||
this.prodMonthlyPlan = `${new Date().getFullYear()}-0${month}`
|
||||
} else {
|
||||
this.prodMonthlyPlan = `${new Date().getFullYear()}-${month}`;
|
||||
this.prodMonthlyPlan = `${new Date().getFullYear()}-${month}`
|
||||
}
|
||||
this.getData()
|
||||
}
|
||||
}
|
||||
this.getData();
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -808,10 +809,12 @@ export default {
|
||||
vertical-align: middle;
|
||||
color: #fff;
|
||||
background-color: transparent;
|
||||
|
||||
.el-range-input,
|
||||
.el-range-separator {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.el-range-editor.is-active {
|
||||
border-color: #fff !important;
|
||||
}
|
||||
|
||||
@ -20,11 +20,13 @@
|
||||
class="con_right"
|
||||
: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=""/>
|
||||
<span style="margin-left: 2px">Ⅰ级：{{ v.pointName }}</span>
|
||||
</div>
|
||||
<div class="com_img" @click="handleItem(v)">
|
||||
<div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
|
||||
@mouseleave="activedPointIndex=-1"
|
||||
>
|
||||
<img src="./img/left1/icon1.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
@ -33,11 +35,13 @@
|
||||
class="con_right con_two"
|
||||
: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=""/>
|
||||
<span style="margin-left: 2px">Ⅱ级：{{ v.pointName }}</span>
|
||||
</div>
|
||||
<div class="com_img" @click="handleItem(v)">
|
||||
<div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
|
||||
@mouseleave="activedPointIndex=-1"
|
||||
>
|
||||
<img src="./img/left1/icon2.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
@ -46,11 +50,13 @@
|
||||
class="con_right con_three"
|
||||
: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=""/>
|
||||
<span style="margin-left: 2px">Ⅲ级：{{ v.pointName }}</span>
|
||||
</div>
|
||||
<div class="com_img" @click="handleItem(v)">
|
||||
<div class="com_img" @click="handleItem(v)" @mouseover.stop="activedPointIndex=index"
|
||||
@mouseleave="activedPointIndex=-1"
|
||||
>
|
||||
<img src="./img/left1/icon3.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
@ -84,8 +90,8 @@
|
||||
</div>
|
||||
<div class="box">
|
||||
<i
|
||||
>{{ getItem(pointLevelCount, "Ⅰ级").COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, "一级").COUNTNUMBER
|
||||
>{{ getItem(pointLevelCount, 'Ⅰ级').COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, '一级').COUNTNUMBER
|
||||
}}</i
|
||||
><span class="num2">个</span>
|
||||
</div>
|
||||
@ -96,8 +102,8 @@
|
||||
</div>
|
||||
<div class="box">
|
||||
<i
|
||||
>{{ getItem(pointLevelCount, "Ⅱ级").COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, "二级").COUNTNUMBER
|
||||
>{{ getItem(pointLevelCount, 'Ⅱ级').COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, '二级').COUNTNUMBER
|
||||
}}</i
|
||||
><span class="num2">个</span>
|
||||
</div>
|
||||
@ -108,8 +114,8 @@
|
||||
</div>
|
||||
<div class="box">
|
||||
<i
|
||||
>{{ getItem(pointLevelCount, "Ⅲ级").COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, "三级").COUNTNUMBER
|
||||
>{{ getItem(pointLevelCount, 'Ⅲ级').COUNTNUMBER }}/{{
|
||||
getItem(sourceLevelCount, '三级').COUNTNUMBER
|
||||
}}</i
|
||||
><span class="num2">个</span>
|
||||
</div>
|
||||
@ -117,7 +123,7 @@
|
||||
<div class="data-item">
|
||||
<div><span style="font-weight: bold">四级重大危险源</span></div>
|
||||
<div class="box">
|
||||
<i>{{ getItem(sourceLevelCount, "四级").COUNTNUMBER }}</i
|
||||
<i>{{ getItem(sourceLevelCount, '四级').COUNTNUMBER }}</i
|
||||
><span class="num2">个</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -127,73 +133,76 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import container100 from "../components/container3/index.vue";
|
||||
import rocketTit from "../components/rocketTit/index.vue";
|
||||
import progressBar from "./../components/progress/index.vue";
|
||||
import container100 from '../components/container3/index.vue'
|
||||
import rocketTit from '../components/rocketTit/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 {
|
||||
mixins: [resize],
|
||||
name: "left1",
|
||||
name: 'left1',
|
||||
components: {
|
||||
container100,
|
||||
rocketTit,
|
||||
progressBar,
|
||||
progressBar
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pic: "",
|
||||
pic: '',
|
||||
activedPointIndex: -1,
|
||||
pointLevelCount: [
|
||||
{
|
||||
name: "Ⅰ级",
|
||||
COUNTNUMBER: 0,
|
||||
name: 'Ⅰ级',
|
||||
COUNTNUMBER: 0
|
||||
},
|
||||
{
|
||||
name: "Ⅱ级",
|
||||
COUNTNUMBER: 0,
|
||||
name: 'Ⅱ级',
|
||||
COUNTNUMBER: 0
|
||||
},
|
||||
{
|
||||
name: "Ⅲ级",
|
||||
COUNTNUMBER: 0,
|
||||
},
|
||||
name: 'Ⅲ级',
|
||||
COUNTNUMBER: 0
|
||||
}
|
||||
],
|
||||
sourceLevelCount: [
|
||||
{
|
||||
name: "二级",
|
||||
COUNTNUMBER: 0,
|
||||
name: '二级',
|
||||
COUNTNUMBER: 0
|
||||
},
|
||||
{
|
||||
name: "三级",
|
||||
COUNTNUMBER: 0,
|
||||
name: '三级',
|
||||
COUNTNUMBER: 0
|
||||
},
|
||||
{
|
||||
name: "四级",
|
||||
COUNTNUMBER: 0,
|
||||
name: '四级',
|
||||
COUNTNUMBER: 0
|
||||
},
|
||||
{
|
||||
name: "一级",
|
||||
COUNTNUMBER: 0,
|
||||
},
|
||||
name: '一级',
|
||||
COUNTNUMBER: 0
|
||||
}
|
||||
],
|
||||
points: [],
|
||||
};
|
||||
points: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.getData();
|
||||
this.getData()
|
||||
// this.initChart3()
|
||||
});
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
handleItem(item) {
|
||||
this.$bus.emit("getTarget", item);
|
||||
this.$bus.emit('getTarget', item)
|
||||
},
|
||||
getItem(list, name) {
|
||||
return list.find((item) => {
|
||||
return item.name === name;
|
||||
});
|
||||
return item.name === name
|
||||
})
|
||||
// for (let index = 0; index < list.length; index++) {
|
||||
// const item = list[index];
|
||||
// console.log(item.name + "---" + name + "---" + (name == item.name));
|
||||
@ -205,51 +214,53 @@ export default {
|
||||
},
|
||||
getData() {
|
||||
this.request({
|
||||
url: "/hx/securityManagement/dangerousMap",
|
||||
method: "get",
|
||||
url: '/hx/securityManagement/dangerousMap',
|
||||
method: 'get'
|
||||
}).then((res) => {
|
||||
if (200 == res.code) {
|
||||
// console.log(res.data);
|
||||
|
||||
if (res.data.pointLevelCount) {
|
||||
this.pointLevelCount = res.data.pointLevelCount;
|
||||
this.pointLevelCount = res.data.pointLevelCount
|
||||
}
|
||||
if (res.data.sourceLevelCount) {
|
||||
this.sourceLevelCount = res.data.sourceLevelCount;
|
||||
this.sourceLevelCount = res.data.sourceLevelCount
|
||||
}
|
||||
if (res.data.points) {
|
||||
this.points = res.data.points;
|
||||
this.points = res.data.points
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
this.request({
|
||||
url: "/hx/bigPic/getByType",
|
||||
method: "get",
|
||||
params: { type: 1 },
|
||||
url: '/hx/bigPic/getByType',
|
||||
method: 'get',
|
||||
params: { type: 1 }
|
||||
}).then((res) => {
|
||||
if (200 == res.code) {
|
||||
this.pic = res.data.pic;
|
||||
this.pic = res.data.pic
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
//销毁监听事件
|
||||
this.$bus.off("getTarget");
|
||||
},
|
||||
};
|
||||
this.$bus.off('getTarget')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.tit {
|
||||
padding: 16px 24px;
|
||||
}
|
||||
|
||||
.img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.data {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@ -257,6 +268,7 @@ export default {
|
||||
background: rgba(2, 18, 63, 0.33);
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
|
||||
.data-item {
|
||||
// flex: 1;
|
||||
margin-left: 15px;
|
||||
@ -264,10 +276,12 @@ export default {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
|
||||
> div {
|
||||
margin: 5px 0;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
|
||||
img {
|
||||
// width: 10px;
|
||||
// height: 10px;
|
||||
@ -275,15 +289,18 @@ export default {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
font-size: 26px;
|
||||
font-family: Roboto-BlackItalic, Roboto;
|
||||
font-weight: 600;
|
||||
color: #55c5a2;
|
||||
}
|
||||
|
||||
.num {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.num2 {
|
||||
font-size: 16px;
|
||||
margin-left: 5px;
|
||||
@ -294,10 +311,12 @@ export default {
|
||||
|
||||
.container3 {
|
||||
position: relative;
|
||||
|
||||
.con_right {
|
||||
&:hover {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
width: 138px;
|
||||
position: absolute;
|
||||
top: 41%;
|
||||
@ -308,41 +327,53 @@ export default {
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
.con_title {
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: absolute;
|
||||
top: -100%;
|
||||
z-index: 99999;
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.con_title_bg1 {
|
||||
background: url("./img/left1/1.png") no-repeat;
|
||||
}
|
||||
|
||||
.con_title_bg2 {
|
||||
background: url("./img/left1/2.png") no-repeat;
|
||||
}
|
||||
|
||||
.con_title_bg3 {
|
||||
background: url("./img/left1/3.png") no-repeat;
|
||||
}
|
||||
|
||||
.com_img {
|
||||
margin-top: 5px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.con_two {
|
||||
top: 37%;
|
||||
left: 13%;
|
||||
}
|
||||
|
||||
.con_three {
|
||||
top: 70%;
|
||||
right: 16%;
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
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="12"
|
||||
>作业内容(周危险)</el-col
|
||||
@ -35,7 +35,9 @@
|
||||
<ul class="item">
|
||||
<li v-for="(item, index) in scrollList1" :key="index">
|
||||
<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
|
||||
style="text-align: center"
|
||||
:title="item.deptName"
|
||||
@ -63,7 +65,7 @@
|
||||
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="12"
|
||||
>作业内容(月重点)</el-col
|
||||
@ -81,9 +83,9 @@
|
||||
<ul class="item">
|
||||
<li v-for="(item, index) in scrollList2" :key="index">
|
||||
<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
|
||||
style="text-align: center"
|
||||
:title="item.deptName"
|
||||
|
||||
@ -66,7 +66,7 @@
|
||||
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>
|
||||
@ -83,9 +83,9 @@
|
||||
<ul class="item">
|
||||
<li v-for="(item, index) in points" :key="index">
|
||||
<el-row>
|
||||
<!-- <el-col style="text-align: center" :span="3">{{
|
||||
item.id
|
||||
}}</el-col> -->
|
||||
<el-col style="text-align: center" :span="3">{{
|
||||
index + 1
|
||||
}}</el-col>
|
||||
<el-col
|
||||
style="text-align: center"
|
||||
:title="item.pointName"
|
||||
|
||||
@ -3,29 +3,93 @@
|
||||
<el-row :gutter="20">
|
||||
<!--用户数据-->
|
||||
<el-col :span="24" :xs="24">
|
||||
<!-- <el-row :gutter="10" class="mb8">
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button
|
||||
>
|
||||
</el-col>
|
||||
</el-row> -->
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="userList">
|
||||
<el-table-column label="序号" align="center" type="index" width="80"/>
|
||||
<el-table-column label="图片" align="center" prop="bigPic" width="100">
|
||||
<el-table-column
|
||||
label="序号"
|
||||
align="center"
|
||||
type="index"
|
||||
width="80"
|
||||
/>
|
||||
<el-table-column
|
||||
label="图片"
|
||||
align="center"
|
||||
prop="bigPic"
|
||||
width="100"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-image style="width: 100px; height: 100px" :src="scope.row.bigPic" fit="cover"></el-image>
|
||||
<el-image
|
||||
style="width: 100px; height: 100px"
|
||||
:src="scope.row.bigPic"
|
||||
fit="cover"
|
||||
></el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="年份" align="center" prop="year" width="100" />
|
||||
<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">
|
||||
<el-table-column
|
||||
label="年份"
|
||||
align="center"
|
||||
prop="year"
|
||||
width="100"
|
||||
/>
|
||||
<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"
|
||||
@ -59,19 +123,26 @@
|
||||
</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-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="收入" prop="completedIncome">
|
||||
<el-input v-model="form.completedIncome" placeholder="请输入收入" maxlength="30">
|
||||
<el-input
|
||||
v-model="form.completedIncome"
|
||||
placeholder="请输入收入"
|
||||
maxlength="30"
|
||||
>
|
||||
<template slot="append">万</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="目标收入" prop="targetIncome">
|
||||
<el-input v-model="form.targetIncome" placeholder="请输入目标收入">
|
||||
<el-input
|
||||
v-model="form.targetIncome"
|
||||
placeholder="请输入目标收入"
|
||||
>
|
||||
<template slot="append">万</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -87,7 +158,10 @@
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="目标利润" prop="targetProfit">
|
||||
<el-input v-model="form.targetProfit" placeholder="请输入目标利润">
|
||||
<el-input
|
||||
v-model="form.targetProfit"
|
||||
placeholder="请输入目标利润"
|
||||
>
|
||||
<template slot="append">万</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -96,14 +170,20 @@
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="装药量" prop="completedChargeQuantity">
|
||||
<el-input v-model="form.completedChargeQuantity" placeholder="请输入装药量">
|
||||
<el-input
|
||||
v-model="form.completedChargeQuantity"
|
||||
placeholder="请输入装药量"
|
||||
>
|
||||
<template slot="append">万件</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="目标装药量" prop="targetChargeQuantity">
|
||||
<el-input v-model="form.targetChargeQuantity" placeholder="请输入目标装药量">
|
||||
<el-input
|
||||
v-model="form.targetChargeQuantity"
|
||||
placeholder="请输入目标装药量"
|
||||
>
|
||||
<template slot="append">万件</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -112,14 +192,20 @@
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="交付数量" prop="completedDeliveryQuantity">
|
||||
<el-input v-model="form.completedDeliveryQuantity" placeholder="请输入交付数量">
|
||||
<el-input
|
||||
v-model="form.completedDeliveryQuantity"
|
||||
placeholder="请输入交付数量"
|
||||
>
|
||||
<template slot="append">万件</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="目标交付数量" prop="targetDeliveryQuantity">
|
||||
<el-input v-model="form.targetDeliveryQuantity" placeholder="请输入目标交付数量">
|
||||
<el-input
|
||||
v-model="form.targetDeliveryQuantity"
|
||||
placeholder="请输入目标交付数量"
|
||||
>
|
||||
<template slot="append">万件</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
@ -128,13 +214,22 @@
|
||||
<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
|
||||
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" />
|
||||
<ImageUpload
|
||||
v-model="form.bigPic"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -148,8 +243,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { centerOneList, updateAnnualTarget } from './indexApi'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import { addAnnualTarget, centerOneList, updateAnnualTarget } from "./indexApi";
|
||||
import { getToken } from "@/utils/auth";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
@ -161,7 +256,7 @@ export default {
|
||||
// 用户表格数据
|
||||
userList: null,
|
||||
// 弹出层标题
|
||||
title: '',
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 表单参数
|
||||
@ -173,36 +268,54 @@ export default {
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
completedIncome: [{ required: true, message: '收入不能为空', trigger: 'blur' }],
|
||||
targetIncome: [{ required: true, message: '目标收入不能为空', trigger: 'blur' }],
|
||||
completedProfit: [{ required: true, message: '利润不能为空', trigger: 'blur' }],
|
||||
targetProfit: [{ required: true, message: '目标利润不能为空', trigger: 'blur' }],
|
||||
completedChargeQuantity: [{ required: true, message: '装药量不能为空', trigger: 'blur' }],
|
||||
targetChargeQuantity: [{ required: true, message: '目标装药量不能为空', trigger: 'blur' }],
|
||||
completedDeliveryQuantity: [{ required: true, message: '交付数量不能为空', trigger: 'blur' }],
|
||||
targetDeliveryQuantity: [{ required: true, message: '目标交付数量不能为空', trigger: 'blur' }],
|
||||
year: [{ required: true, message: '请选择目标年份', trigger: 'change' }],
|
||||
bigPic: [{ required: true, message: '请上传', trigger: 'change' }],
|
||||
completedIncome: [
|
||||
{ required: true, message: "收入不能为空", trigger: "blur" },
|
||||
],
|
||||
targetIncome: [
|
||||
{ required: true, message: "目标收入不能为空", trigger: "blur" },
|
||||
],
|
||||
completedProfit: [
|
||||
{ required: true, message: "利润不能为空", trigger: "blur" },
|
||||
],
|
||||
targetProfit: [
|
||||
{ required: true, message: "目标利润不能为空", trigger: "blur" },
|
||||
],
|
||||
completedChargeQuantity: [
|
||||
{ required: true, message: "装药量不能为空", trigger: "blur" },
|
||||
],
|
||||
targetChargeQuantity: [
|
||||
{ required: true, message: "目标装药量不能为空", trigger: "blur" },
|
||||
],
|
||||
completedDeliveryQuantity: [
|
||||
{ required: true, message: "交付数量不能为空", trigger: "blur" },
|
||||
],
|
||||
targetDeliveryQuantity: [
|
||||
{ required: true, message: "目标交付数量不能为空", trigger: "blur" },
|
||||
],
|
||||
year: [
|
||||
{ required: true, message: "请选择目标年份", trigger: "change" },
|
||||
],
|
||||
bigPic: [{ required: true, message: "请上传", trigger: "change" }],
|
||||
},
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
centerOneList(this.queryParams).then(response => {
|
||||
this.userList = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
})
|
||||
this.loading = true;
|
||||
centerOneList(this.queryParams).then((response) => {
|
||||
this.userList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false
|
||||
this.reset()
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
@ -218,56 +331,56 @@ export default {
|
||||
completedDeliveryQuantity: undefined,
|
||||
targetDeliveryQuantity: undefined,
|
||||
year: undefined,
|
||||
}
|
||||
this.resetForm('form')
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset()
|
||||
this.open = true
|
||||
this.title = '添加'
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset()
|
||||
this.form = Object.assign({}, row)
|
||||
this.open = true
|
||||
this.title = '修改全年目标'
|
||||
this.reset();
|
||||
this.form = Object.assign({}, row);
|
||||
this.open = true;
|
||||
this.title = "修改全年目标";
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function () {
|
||||
this.$refs['form'].validate(valid => {
|
||||
submitForm() {
|
||||
this.$refs["form"].validate((valid) => {
|
||||
if (valid) {
|
||||
if (this.form.id != undefined) {
|
||||
updateAnnualTarget(this.form).then(response => {
|
||||
this.$modal.msgSuccess('修改成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
updateAnnualTarget(this.form).then((response) => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
} else {
|
||||
addUser(this.form).then(response => {
|
||||
this.$modal.msgSuccess('新增成功')
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
addAnnualTarget(this.form).then((response) => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const userIds = row.userId || this.ids
|
||||
const userIds = row.userId || this.ids;
|
||||
this.$modal
|
||||
.confirm('是否确认删除编号为"' + userIds + '"的数据项？')
|
||||
.then(function () {
|
||||
return delUser(userIds)
|
||||
return delUser(userIds);
|
||||
})
|
||||
.then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch(() => {});
|
||||
},
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -1,134 +1,143 @@
|
||||
import request from '@/utils/request'
|
||||
import request from "@/utils/request";
|
||||
|
||||
/** --------------- left1 --------------- */
|
||||
// 经营责任书列表
|
||||
export function leftOneList(params) {
|
||||
return request({
|
||||
url: '/hx/businessResponsibility/list',
|
||||
url: "/hx/businessResponsibility/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function importTemplate() {
|
||||
return request({
|
||||
url: '/hx/businessResponsibility/importTemplate',
|
||||
})
|
||||
url: "/hx/businessResponsibility/importTemplate",
|
||||
});
|
||||
}
|
||||
/** --------------- left2 --------------- */
|
||||
// 收入和利润列表
|
||||
export function leftTwoList(params) {
|
||||
return request({
|
||||
url: '/hx/revenueProfit/list',
|
||||
url: "/hx/revenueProfit/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function leftTwoImportTemplate() {
|
||||
return request({
|
||||
url: '/hx/revenueProfit/importTemplate',
|
||||
})
|
||||
url: "/hx/revenueProfit/importTemplate",
|
||||
});
|
||||
}
|
||||
/** --------------- center1 --------------- */
|
||||
// 全年目标和大图列表
|
||||
export function centerOneList(params) {
|
||||
return request({
|
||||
url: '/hx/annualTarget/list',
|
||||
url: "/hx/annualTarget/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 修改全年目标和大图
|
||||
export function updateAnnualTarget(data) {
|
||||
return request({
|
||||
url: '/hx/annualTarget',
|
||||
method: 'put',
|
||||
url: "/hx/annualTarget",
|
||||
method: "put",
|
||||
data,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 新增全年目标和大图
|
||||
export function addAnnualTarget(data) {
|
||||
return request({
|
||||
url: "/hx/annualTarget",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
}
|
||||
|
||||
/** --------------- center2 --------------- */
|
||||
// 今日动态列表
|
||||
export function centerTwoList(params) {
|
||||
return request({
|
||||
url: '/hx/todayDynamic/list',
|
||||
url: "/hx/todayDynamic/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function centerTwoImportTemplate() {
|
||||
return request({
|
||||
url: '/hx/todayDynamic/importTemplate',
|
||||
})
|
||||
url: "/hx/todayDynamic/importTemplate",
|
||||
});
|
||||
}
|
||||
/** --------------- center3 --------------- */
|
||||
// 本月动态列表
|
||||
export function centerThreeList(params) {
|
||||
return request({
|
||||
url: '/business/hxMonthDynamic/list',
|
||||
url: "/business/hxMonthDynamic/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function centerThreeImportTemplate() {
|
||||
return request({
|
||||
url: '/business/hxMonthDynamic/importTemplate',
|
||||
})
|
||||
url: "/business/hxMonthDynamic/importTemplate",
|
||||
});
|
||||
}
|
||||
/** --------------- right1 --------------- */
|
||||
// 生产责任令
|
||||
export function rightOneList(params) {
|
||||
return request({
|
||||
url: '/hx/productionResponsibility/list',
|
||||
url: "/hx/productionResponsibility/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function rightOneImportTemplate() {
|
||||
return request({
|
||||
url: '/hx/productionResponsibility/importTemplate',
|
||||
})
|
||||
url: "/hx/productionResponsibility/importTemplate",
|
||||
});
|
||||
}
|
||||
/** --------------- right2 --------------- */
|
||||
// 交付产品完成概况
|
||||
export function rightTwoList(params) {
|
||||
return request({
|
||||
url: '/hx/productCompletion/list',
|
||||
url: "/hx/productCompletion/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 导出模板
|
||||
export function rightTwoImportTemplate() {
|
||||
return request({
|
||||
url: '/hx/productCompletion/importTemplate',
|
||||
})
|
||||
url: "/hx/productCompletion/importTemplate",
|
||||
});
|
||||
}
|
||||
// 删除交付产品完成概况
|
||||
export function rightTwoDel(params) {
|
||||
return request({
|
||||
url: '/hx/productCompletion',
|
||||
method: 'delete',
|
||||
url: "/hx/productCompletion",
|
||||
method: "delete",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
/** --------------- right3 --------------- */
|
||||
// 装药量列表
|
||||
export function rightThreeList(params) {
|
||||
return request({
|
||||
url: '/hx/chargeQuantity/list',
|
||||
url: "/hx/chargeQuantity/list",
|
||||
params,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 新增装药量
|
||||
export function rightThreeAdd(data) {
|
||||
return request({
|
||||
url: '/hx/chargeQuantity',
|
||||
method: 'post',
|
||||
url: "/hx/chargeQuantity",
|
||||
method: "post",
|
||||
data,
|
||||
})
|
||||
});
|
||||
}
|
||||
// 修改装药量
|
||||
export function rightThreeUpdate(data) {
|
||||
return request({
|
||||
url: '/hx/chargeQuantity',
|
||||
method: 'put',
|
||||
url: "/hx/chargeQuantity",
|
||||
method: "put",
|
||||
data,
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
@ -118,6 +118,7 @@ export default {
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
console.log(row);
|
||||
this.$modal
|
||||
.confirm('是否确认删除编号为"' + row.id + '"的数据项？')
|
||||
.then(function () {
|
||||
|
||||
Reference in New Issue
Block a user