!19 生产大屏

生产大屏
This commit is contained in:
打豆豆 2024-02-21 05:57:04 +00:00 committed by Gitee
commit a0b316cd68
No known key found for this signature in database
GPG Key ID: 173E9B9CA92EEF8F
9 changed files with 1237 additions and 35 deletions

BIN
src/assets/images/scjk.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 568 KiB

View File

@ -74,7 +74,7 @@
<el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/> <el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/>
<el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/> <el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/>
<el-table-column label="单位" align="center" prop="unitOfMeasure" /> <el-table-column label="单位" align="center" prop="unitOfMeasure" />
<el-table-column label="工单数量" align="center" prop="quantity" /> <el-table-column label="计划数量" align="center" prop="quantity" />
<el-table-column label="客户编码" align="center" prop="clientCode" /> <el-table-column label="客户编码" align="center" prop="clientCode" />
<el-table-column label="客户名称" align="center" prop="clientName" :show-overflow-tooltip="true"/> <el-table-column label="客户名称" align="center" prop="clientName" :show-overflow-tooltip="true"/>
<el-table-column label="需求日期" align="center" prop="requestDate" width="180"> <el-table-column label="需求日期" align="center" prop="requestDate" width="180">

View File

@ -61,6 +61,19 @@ export const constantRoutes = [
component: () => import("@/views/error/401"), component: () => import("@/views/error/401"),
hidden: true, hidden: true,
}, },
// {
// path: "",
// component: Layout,
// redirect: "index",
// children: [
// {
// path: "index",
// component: () => import("@/views/index"),
// name: "Index",
// meta: { title: "首页", icon: "dashboard", affix: true },
// },
// ],
// },
{ {
path: "", path: "",
component: Layout, component: Layout,
@ -68,9 +81,9 @@ export const constantRoutes = [
children: [ children: [
{ {
path: "index", path: "index",
component: () => import("@/views/index"), component: () => import("@/views/mes/pro/production/index"),
name: "Index", name: "Index",
meta: { title: "首页", icon: "dashboard", affix: true }, // meta: { title: "首页", icon: "dashboard", affix: true },
}, },
], ],
}, },
@ -180,7 +193,7 @@ export const dynamicRoutes = [
path: "/mes/pro/schedule", path: "/mes/pro/schedule",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['mes:pro:protask:edit'], permissions: ["mes:pro:protask:edit"],
children: [ children: [
{ {
path: "ganttedit", path: "ganttedit",
@ -211,43 +224,43 @@ export const dynamicRoutes = [
permissions: ["tool:gen:edit"], permissions: ["tool:gen:edit"],
children: [ children: [
{ {
path: 'index/:tableId(\\d+)', path: "index/:tableId(\\d+)",
component: () => import('@/views/tool/gen/editTable'), component: () => import("@/views/tool/gen/editTable"),
name: 'GenEdit', name: "GenEdit",
meta: { title: '修改生成配置', activeMenu: '/tool/gen' } meta: { title: "修改生成配置", activeMenu: "/tool/gen" },
} },
] ],
}, },
{ {
path: '/mes/qc/pendinginspect/add', path: "/mes/qc/pendinginspect/add",
component: Layout, component: Layout,
hidden: true, hidden: true,
permissions: ['mes:qc:pending'], permissions: ["mes:qc:pending"],
children: [ children: [
{ {
path: 'iqc', path: "iqc",
component: () => import('@/views/mes/qc/pendinginspect/iqc'), component: () => import("@/views/mes/qc/pendinginspect/iqc"),
name: 'iqcadd', name: "iqcadd",
props: true, props: true,
meta: {title: '来料检验', activeMenu: '/mes/qc/pendinginspect/iqc'} meta: { title: "来料检验", activeMenu: "/mes/qc/pendinginspect/iqc" },
}, },
{ {
path: 'pqc', path: "pqc",
component: () => import('@/views/mes/qc/pendinginspect/pqc'), component: () => import("@/views/mes/qc/pendinginspect/pqc"),
name: 'pqcadd', name: "pqcadd",
props: true, props: true,
meta: {title: '过程检验', activeMenu: '/mes/qc/pendinginspect/pqc'} meta: { title: "过程检验", activeMenu: "/mes/qc/pendinginspect/pqc" },
}, },
{ {
path: 'oqc', path: "oqc",
component: () => import('@/views/mes/qc/oqc/index'), component: () => import("@/views/mes/qc/oqc/index"),
name: 'oqcadd', name: "oqcadd",
props: true, props: true,
meta: {title: '出厂检验', activeMenu: '/mes/qc/pendinginspect/oqc'} meta: { title: "出厂检验", activeMenu: "/mes/qc/pendinginspect/oqc" },
} },
] ],
} },
] ];
// 防止连续点击多次路由报错 // 防止连续点击多次路由报错
let routerPush = Router.prototype.push; let routerPush = Router.prototype.push;
@ -262,6 +275,6 @@ export default new Router({
}); });
export function resetRouter() { export function resetRouter() {
const newRouter = createRouter() const newRouter = createRouter();
Router.matcher = newRouter.matcher // 重制 router Router.matcher = newRouter.matcher; // 重制 router
} }

View File

@ -0,0 +1,288 @@
<template>
<div class="app-container">
<!-- ECharts 准备一个定义了宽高的 DOM -->
<div id="completeData" style="width: 100%; height: 360px"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
components: { echarts, Treeselect },
props: ["message"], //
data() {
return {
echartData: [],
};
},
watch: {
message: {
immediate: true,
handler(val) {
// console.log(val,'=============');
this.echartData = val;
// val.forEach((item) => {
// this.getDataNum.push(Number(item.ytdUvNew))
// this.getDataTime.push(moment(item.dt).format('YYYY-MM-DD'))
// })
this.$nextTick(() => {
//
this.drawLine();
});
},
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// domecharts
var myChart = echarts.init(document.getElementById("completeData"));
var option = {
tooltip: {
//
trigger: "axis",
formatter: "{b}<br />{a0}: {c0}<br />{a1}: {c1}",
axisPointer: {
type: "shadow",
label: {
backgroundColor: "#6a7985",
},
},
textStyle: {
color: "#fff",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
grid: {
left: "5%",
right: "4%",
bottom: "6%",
top: 60,
padding: "0 0 10 0",
containLabel: true,
},
legend: {
//
right: 10,
top: 20,
itemGap: 16,
itemWidth: 18,
itemHeight: 10,
data: [
{
name: "实际完成工单数",
//icon:'image://../wwwroot/js/url2.png', //
},
{
name: "计划工单数",
},
],
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
xAxis: [
{
type: "category",
boundaryGap: true, //
data: [
"2023-08",
"2023-09",
"2023-10",
"2023-11",
"2023-12",
"2023-13",
"2023-14",
"2023-15",
"2023-16",
"2023-17",
],
axisLabel: {
//
interval: 0, // 1
margin: 15,
textStyle: {
color: "#078ceb",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
axisTick: {
//
show: false,
},
axisLine: {
//线
lineStyle: {
color: "#fff",
opacity: 0.2,
},
},
splitLine: {
// grid 线
show: false,
},
},
],
yAxis: [
{
type: "value",
splitNumber: 5,
axisLabel: {
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
splitLine: {
show: true,
lineStyle: {
color: ["#fff"],
opacity: 0.06,
},
},
},
],
series: [
{
name: "实际完成工单数",
type: "bar",
data: [4.9, 7.3, 9.2, 5.6, 7.7, 5.6, 4.2, 3.6, 6, 6.4],
barWidth: 10,
barGap: 0, //
label: {
//
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
},
itemStyle: {
//
normal: {
barBorderRadius: [5, 5, 0, 0],
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 1,
color: "rgba(127, 128, 225, 0.7)",
},
{
offset: 0.9,
color: "rgba(72, 73, 181, 0.7)",
},
{
offset: 0.31,
color: "rgba(0, 208, 208, 0.7)",
},
{
offset: 0.15,
color: "rgba(0, 208, 208, 0.7)",
},
{
offset: 0,
color: "rgba(104, 253, 255, 0.7)",
},
],
false
),
},
},
},
{
name: "计划工单数",
type: "bar",
data: [2.9, 5, 4.4, 2.7, 5.7, 4.6, 1.2, 2.7, 4.8, 6.0],
barWidth: 10,
barGap: 0.2, //
label: {
//
normal: {
show: true,
position: "top",
textStyle: {
color: "#a8aab0",
fontStyle: "normal",
fontFamily: "微软雅黑",
fontSize: 12,
},
},
},
itemStyle: {
//
normal: {
barBorderRadius: [5, 5, 0, 0],
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 1,
color: "rgba(127, 128, 225, 0.7)",
},
{
offset: 0.9,
color: "rgba(72, 73, 181, 0.7)",
},
{
offset: 0.25,
color: "rgba(226, 99, 74, 0.7)",
},
{
offset: 0,
color: "rgba(253, 200, 106, 0.7)",
},
],
false
),
},
},
},
],
};
// 使
myChart.setOption(option);
},
},
};
</script>
<style lang="scss" scoped>
.app-container {
padding: 0px !important;
min-height: calc(0vh - 0px) !important;
}
</style>

View File

@ -0,0 +1,190 @@
<template>
<div class="app-container">
<!-- ECharts 准备一个定义了宽高的 DOM -->
<div id="defectiveData" style="width: 100%; height: 310px"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
components: { echarts, Treeselect },
props: ["message"], //
data() {
return {
echartData: [],
};
},
watch: {
message: {
immediate: true,
handler(val) {
// console.log(val,'=============');
this.echartData = val;
// val.forEach((item) => {
// this.getDataNum.push(Number(item.ytdUvNew))
// this.getDataTime.push(moment(item.dt).format('YYYY-MM-DD'))
// })
this.$nextTick(() => {
//
this.drawLine();
});
},
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// domecharts
var myChart = echarts.init(document.getElementById("defectiveData"));
var scale = 1;
var echartData = [
{
value: 50,
name: "材料不良",
},
{
value: 100,
name: "工序不良",
},
{
value: 300,
name: "尺寸不良",
},
{
value: 50,
name: "其他不良",
},
];
var rich = {
yellow: {
color: "#fff",
fontSize: 14 * scale,
padding: [5, 4],
align: "center",
},
total: {
color: "#49dff0",
fontSize: 24 * scale,
align: "center",
},
white: {
color: "#fff",
align: "center",
fontSize: 14 * scale,
padding: [5, 0],
},
blue: {
color: "#49dff0",
fontSize: 12 * scale,
align: "center",
},
hr: {
borderColor: "#0b5263",
width: "100%",
borderWidth: 1,
height: 0,
},
};
var option = {
title: {
text: "不良品总数",
left: "center",
top: "53%",
padding: [20, 0],
textStyle: {
color: "#fff",
fontSize: 16 * scale,
align: "center",
},
},
legend: {
selectedMode: false,
formatter: function (name) {
var total = 0; //
var averagePercent; //
echartData.forEach(function (value, index, array) {
total += value.value;
});
return "{total|" + total + "}";
},
data: [echartData[0].name],
// data: [''],
// itemGap: 50,
left: "center",
top: "center",
icon: "none",
align: "center",
textStyle: {
color: "#fff",
fontSize: 16 * scale,
rich: rich,
},
},
series: [
{
name: "不良品总数",
type: "pie",
radius: ["42%", "50%"],
hoverAnimation: false,
color: [
"#c487ee",
"#deb140",
"#49dff0",
"#034079",
"#6f81da",
"#00ffb4",
],
label: {
normal: {
formatter: function (params, ticket, callback) {
var total = 0; //
var percent = 0; //
echartData.forEach(function (value, index, array) {
total += value.value;
});
percent = ((params.value / total) * 100).toFixed(1);
return (
"{white|" +
params.value +
"}\n{hr|}\n{yellow|" +
params.name +
"}\n"
);
},
rich: rich,
},
},
labelLine: {
normal: {
length: 55 * scale,
length2: 0,
lineStyle: {
color: "#0b5263",
},
},
},
data: echartData,
},
],
};
// 使
myChart.setOption(option);
},
},
};
</script>
<style lang="scss" scoped>
.app-container {
padding: 0px !important;
min-height: calc(0vh - 0px) !important;
}
</style>

View File

@ -0,0 +1,171 @@
<template>
<div class="app-container">
<!-- ECharts 准备一个定义了宽高的 DOM -->
<div id="ticketData" style="width: 100%; height: 360px"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
components: { echarts, Treeselect },
props: ["message"], //
data() {
return {
echartData: [],
};
},
watch: {
message: {
immediate: true,
handler(val) {
// console.log(val,'=============');
this.echartData = val;
// val.forEach((item) => {
// this.getDataNum.push(Number(item.ytdUvNew))
// this.getDataTime.push(moment(item.dt).format('YYYY-MM-DD'))
// })
this.$nextTick(() => {
//
this.drawLine();
});
},
},
},
mounted() {
this.drawLine();
},
methods: {
drawLine() {
// domecharts
var myChart = echarts.init(document.getElementById("ticketData"));
var option = {
tooltip: {
trigger: "axis",
axisPointer: {
// Use axis to trigger tooltip
type: "shadow", // 'shadow' as default; can also be 'line' or 'shadow'
},
},
legend: {
// data: ["", ""],
top: "5%",
right: "5%",
icon: "rect",
textStyle: {
color: "#fff",
},
},
grid: {
top: "20%",
left: "5%",
right: "5%",
bottom: "10%",
containLabel: true,
},
xAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "rgba(255,255,255,0.8)",
},
},
splitLine: {
lineStyle: {
color: "rgba(255,255,255,0.3)", // 线
},
},
},
yAxis: {
type: "category",
// data: ["", "", "", "", ""],
axisLabel: {
color: "rgba(255,255,255,0.8)",
},
},
series: [
{
name: "计划数量",
type: "bar",
stack: "total",
label: {
show: true,
},
emphasis: {
focus: "series",
},
// data: [121, 828, 144, 368, 390],
barWidth: 12,
itemStyle: {
label: {
show: true,
},
labelLine: {
show: false,
},
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: "rgba(7,165,255,0.2)" },
{ offset: 1, color: "rgba(7,165,255,1)" },
]),
borderColor: "rgba(7,165,255,0.7)",
shadowBlur: 16,
shadowColor: "rgba(7,165,255,1)",
},
},
{
name: "产出数量",
type: "bar",
stack: "total",
label: {
show: true,
},
emphasis: {
focus: "series",
},
// data: [271, 132, 413, 210, 521],
barWidth: 12,
itemStyle: {
label: {
show: true,
},
labelLine: {
show: false,
},
color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
{ offset: 0, color: "rgba(41,244,236,0)" },
{ offset: 1, color: "rgba(41,244,236,1)" },
]),
borderColor: "#a2f9f7",
shadowBlur: 16,
shadowColor: "#a2f9f7",
},
},
],
dataset: {
source: [
{ status: "今飞智造2.1订单", value1: 33, value2: 93 },
{ status: "今飞餐达1.15订单", value1: 53, value2: 32 },
{ status: "今飞智造1.1订单", value1: 78, value2: 65 },
{ status: "今飞智适12.15打单", value1: 12, value2: 35 },
{ status: "今飞智适12.1订单", value1: 90, value2: 52 },
],
},
};
// 使
myChart.setOption(option);
},
},
};
</script>
<style lang="scss" scoped>
.app-container {
padding: 0px !important;
min-height: calc(0vh - 0px) !important;
}
</style>

View File

@ -0,0 +1,540 @@
<template>
<div class="shopping-classify">
<div class="right-menu" id="container">
<!-- -->
<div style="height: 10%">
<el-row type="flex" justify="space-between" style="height: 100%">
<el-col :span="10">
<div
class="grid-content bg-purple"
style="display: flex; flex-direction: row-reverse"
>
<!-- <svg-icon
:icon-class="isFullscreen ? 'exit-fullscreen' : 'fullscreen'"
style="
width: 20px;
height: 20px;
color: #f4deb0;
margin: 0% -70% 1% 0%;
"
@click="buttoncli"
/> -->
<img
@click="buttoncli"
style="height: 40px; margin: 5% 4.3% 0% 0%"
src="../../../../assets/images/return.png"
/></div
></el-col>
<el-col
:span="5"
style="
display: flex;
flex-direction: column;
justify-content: space-evenly;
align-items: center;
"
><div style="color: #fff; font-size: 30px; font-weight: 700">
{{ this.title }}
</div>
<div
style="color: rgb(9 207 255); font-size: 21px; margin-bottom: 4%"
>
2024.02.27 14:11:00
</div>
</el-col>
<el-col :span="10"
><div class="grid-content bg-purple" style="display: flex">
<img
style="height: 40px; margin: 5% 0% 0% 4%"
src="../../../../assets/images/biaotixiugai.png"
@click="handleChange"
/>
</div>
</el-col>
</el-row>
</div>
<!-- 第一部分 -->
<div style="height: 15%">
<div>
<el-row>
<el-col
:span="24"
style="color: #fff; font-size: 30px; font-weight: 700"
>
<div
style="
display: flex;
justify-content: center;
margin-top: -10px;
margin-bottom: 20px;
"
>
<el-radio-group v-model="radio4" size="mini">
<el-radio-button :label="1">今日</el-radio-button>
<el-radio-button :label="2">昨日</el-radio-button>
<el-radio-button :label="3">本周</el-radio-button>
<el-radio-button :label="4">本月</el-radio-button>
</el-radio-group>
</div></el-col
>
</el-row>
</div>
<div>
<el-row
:gutter="24"
style="color: #fff; font-size: 30px; font-weight: 700"
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 27%"
>
21
</div></el-col
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 35%"
>
30
</div></el-col
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 37%"
>
50%
</div></el-col
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 44%"
>
121
</div></el-col
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 47%"
>
1651
</div></el-col
>
<el-col :span="4"
><div
class="grid-content bg-purple"
style="margin: 10% 10% 10% 60%"
>
1%
</div></el-col
>
</el-row>
</div>
</div>
<!-- 第二部分 -->
<div style="height: 75%">
<div style="height: 50%; display: flex">
<div style="width: 80%">
<ticket :message="this.ticketData" />
</div>
<div style="width: 24%; margin-top: 50px">
<defective :message="this.defectiveData" />
</div>
</div>
<div style="height: 50%; display: flex">
<div style="width: 45%">
<complete :message="this.completeData" />
</div>
<div style="width: 55%; margin-top: 50px">
<el-row :gutter="32" style="padding: 16px 16px 0">
<!-- <el-card> -->
<el-table
:data="workorderList"
row-key="workorderId"
default-expand-all
:tree-props="{
children: 'children',
hasChildren: 'hasChildren',
}"
>
<el-table-column
label="工单号"
width="150"
align="center"
prop="sourceCode"
/>
<el-table-column
label="工单名称"
align="center"
width="150"
prop="clientName"
:show-overflow-tooltip="true"
/>
<el-table-column
label="产品名称"
width="150"
align="center"
prop="productCode"
/>
<el-table-column
label="产出数量"
width="150px"
align="center"
prop="productName"
:show-overflow-tooltip="true"
/>
<el-table-column label="进度" align="center" width="275px">
<template slot-scope="scope">
<el-progress
:text-inside="true"
:stroke-width="20"
:percentage="
parseFloat(
(
(scope.row.quantityProduced / scope.row.quantity) *
100
).toFixed(2)
)
"
></el-progress>
</template>
</el-table-column>
<el-table-column
label="实际开始时间"
align="center"
prop="requestDate"
width="180"
>
<template slot-scope="scope">
<span>{{
parseTime(scope.row.requestDate, "{y}-{m}-{d}")
}}</span>
</template>
</el-table-column>
</el-table>
<!-- </el-card> -->
</el-row>
</div>
</div>
</div>
<!--标题修改-->
<el-dialog :visible.sync="titleVisible" append-to-body width="30%">
<el-form ref="installForm" :model="installForm" label-width="80px">
<el-form-item label="标题修改">
<el-input
maxlength="11"
show-word-limit
v-model="installForm.name"
></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="titleVisible = false">取消</el-button>
<el-button type="primary" @click="sumitInstall">确认</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import { listWorkorder } from "@/api/mes/pro/workorder";
// import * as statisServer from "@/api/statistics";
// import { getInfo } from "@/api/user";
import screenfull from "screenfull";
import defective from "./components/defective.vue";
import complete from "./components/complete.vue";
import ticket from "./components/ticket.vue";
export default {
components: { defective, complete, ticket },
data() {
return {
screenfull: false,
title: "生产监控分析",
titleVisible: false,
installForm: { name: "" },
taskForm: {
total_num: 0, // /
completed_num: 0,
incompleted_num: 0,
},
lineChartData: {},
totalarr: 0, //
month: "", //
Contracts: "",
barquantity: [],
completeData: [],
ticketData: [],
defectiveData: [],
workorderList: [],
signarr: [],
detection: [],
reports: "",
issue: "1",
accumulation: true,
thisYear: false,
isFullscreen: false,
radio4: 1,
};
},
created() {
//
window.addEventListener("resize", this.onresize);
this.getList();
this.findTasks();
this.findContactList();
this.findSampleClass();
this.findvalid();
this.findSortContNumList();
this.NumberReports();
this.factorNumber();
},
// beforeDestroy() {
// //
// window.removeEventListener("resize", this.onresize);
// },
methods: {
//
onresize(event) {
// windowIE
let winFlag = window.innerHeight === window.screen.height;
// window -- IE
let isFull = window.fullScreen || document.webkitIsFullScreen;
if (isFull === undefined) {
this.isFullscreen = winFlag;
} else {
this.isFullscreen = winFlag || isFull;
}
// console.log(winFlag); // true false
},
buttoncli() {
const element = document.getElementById("container");
if (!screenfull) {
this.$message({
message: "浏览器不能全屏,安装其他版本试试",
type: "warning",
});
return false;
}
screenfull.toggle(element);
this.findSampleClass();
this.findSortContNumList();
this.factorNumber();
},
buttoncliArr() {
const element = document.getElementById("container");
if (!screenfull) {
this.$message({
message: "浏览器不能全屏,安装其他版本试试",
type: "warning",
});
return false;
}
screenfull.toggle(element);
},
getList() {
// listWorkorder(this.queryParams).then((response) => {
// this.workorderList = response.data;
// });
},
//
findTasks() {
// statisServer.findCompleteTask({ type: 1 }).then(res => {
// if (res.code === 200) {
// const taskForm = res.result.find(i => i.name === "");
// this.taskForm.total_num = taskForm.totalCnt;
// this.taskForm.completed_num = Number(
// taskForm.totalCnt - taskForm.completeCnt
// ).toFixed(0);
// this.taskForm.incompleted_num = taskForm.completeCnt;
// }
// });
},
//
findContactList() {
// statisServer.findValidContractsForPass11Month().then(res => {
// if (res.code === 200) {
// this.lineChartData = res.result || [];
// //
// this.lineChartData.contactNum.forEach(item => {
// this.totalarr += item;
// });
// //
// this.month = this.lineChartData.contactNum.pop();
// }
// });
},
//
findSampleClass() {
// statisServer.findStoredSampleClassificationCnt({ limit: 6 }).then(res => {
// if (res.code === 200) {
// var arr = [];
// var barData = res.result.xNameData;
// var barquantity = res.result.xValData;
// //
// barData.forEach((item, i) => {
// arr.push({
// name: item,
// value: barquantity[i]
// });
// });
// this.barquantity = arr;
// }
// });
},
findvalid() {
// statisServer.findValidContracts({ type: 0 }).then(res => {
// if (res.code === 200) {
// this.Contracts = res.result.cusSum;
// }
// });
},
//
findSortContNumList() {
// statisServer.findSortContNum({ type: 1, limit: 5 }).then(res => {
// if (res.code === 200) {
// var arr = [];
// var barData = res.result.xNameData;
// var barquantity = res.result.xValData;
// //
// barData.forEach((item, i) => {
// arr.push({
// code: item,
// fundPost: barquantity[i]
// });
// });
// arr.sort((a, b) => {
// return b.fundPost - a.fundPost;
// }); //
// this.signarr = arr.slice(0, 10);
// }
// });
},
//
NumberReports() {
// statisServer.getReport({ type: this.issue }).then(res => {
// if (res.code === 200) {
// this.reports = res.result;
// }
// });
},
//
factorNumber() {
// statisServer.detectorFactor().then(res => {
// if (res.code === 200) {
// var arr = res.result;
// arr.sort((a, b) => {
// return b.value - a.value;
// }); //
// this.detection = arr.slice(0, 10);
// }
// });
},
handleChange() {
this.titleVisible = true;
},
//
sumitInstall() {
// statisServer.updateName(this.installForm).then(res => {
// if (res.code === 200) {
// this.$notify({
// title: "",
// message: res.message,
// type: "success"
// });
// this.titleVisible = false;
// this.getList();
// }
// });
},
accumulationClick() {
this.issue = 2;
this.accumulation = false;
this.thisYear = true;
this.NumberReports();
},
thisYearClick() {
this.issue = 1;
this.accumulation = true;
this.thisYear = false;
this.NumberReports();
},
},
};
</script>
<style lang="scss" scoped>
#container {
display: flex;
flex-direction: column;
width: 100%;
height: 100vh;
background: url("../../../../assets/images/scjk.png") center center no-repeat;
background-size: 100% 100%;
}
.row-bg-1 {
height: 70px;
color: #fff;
text-align: center;
}
.row-bg-3 {
height: 100%;
text-align: center;
color: #fff;
font-size: 20px;
font-weight: 700;
}
.row-bg-4 {
color: #8bdbe6;
font-size: 25px;
margin-top: 27%;
font-weight: 500;
}
.row-bg-5 {
height: 365px;
text-align: center;
color: #fff;
font-size: 20px;
font-weight: 700;
}
::v-deep .el-table {
background-color: transparent; /* 背景透明 */
}
::v-deep .el-table th {
color: #979bb4; /* 字体颜色 */
font-size: 16px;
background-color: transparent; /* 背景透明 */
border: 0;
height: 30px;
line-height: 30px;
}
::v-deep .el-table tr,
.el-table td {
color: #e5dada;
font-size: 12px;
background-color: transparent; /* 背景透明 */
border: 0;
height: 30px;
line-height: 30px;
}
/* 上面两个背景色透明才能让table的背景透明少一个都不行 */
</style>

View File

@ -109,7 +109,7 @@
<el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/> <el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/>
<el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/> <el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/>
<el-table-column label="单位" align="center" prop="unitOfMeasure" /> <el-table-column label="单位" align="center" prop="unitOfMeasure" />
<el-table-column label="工单数量" align="center" prop="quantity" /> <el-table-column label="计划数量" align="center" prop="quantity" />
<el-table-column label="调整数量" align="center" prop="quantityChanged" /> <el-table-column label="调整数量" align="center" prop="quantityChanged" />
<el-table-column label="已生产数量" align="center" width="100px" prop="quantityProduced" /> <el-table-column label="已生产数量" align="center" width="100px" prop="quantityProduced" />
<el-table-column label="客户编码" align="center" prop="clientCode" /> <el-table-column label="客户编码" align="center" prop="clientCode" />
@ -218,7 +218,7 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="工单数量" prop="quantity"> <el-form-item label="计划数量" prop="quantity">
<el-input v-model="form.quantity" readonly="readonly" /> <el-input v-model="form.quantity" readonly="readonly" />
</el-form-item> </el-form-item>
</el-col> </el-col>

View File

@ -160,7 +160,7 @@
<el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/> <el-table-column label="产品名称" width="200" align="center" prop="productName" :show-overflow-tooltip="true"/>
<el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/> <el-table-column label="规格型号" align="center" prop="productSpc" :show-overflow-tooltip="true"/>
<el-table-column label="单位" align="center" prop="unitOfMeasure" /> <el-table-column label="单位" align="center" prop="unitOfMeasure" />
<el-table-column label="工单数量" align="center" prop="quantity" /> <el-table-column label="计划数量" align="center" prop="quantity" />
<el-table-column label="调整数量" align="center" prop="quantityChanged" /> <el-table-column label="调整数量" align="center" prop="quantityChanged" />
<el-table-column label="已生产数量" align="center" width="100px" prop="quantityProduced" /> <el-table-column label="已生产数量" align="center" width="100px" prop="quantityProduced" />
<el-table-column label="批次号" align="center" width="100px" prop="batchCode" /> <el-table-column label="批次号" align="center" width="100px" prop="batchCode" />
@ -323,8 +323,8 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="8"> <el-col :span="8">
<el-form-item label="工单数量" prop="quantity"> <el-form-item label="计划数量" prop="quantity">
<el-input-number :min="1" v-model="form.quantity" placeholder="请输入生产数量" /> <el-input-number :min="1" v-model="form.quantity" placeholder="请输入计划数量" />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">