From 546e94e3e89a6d60395e9690cf3eb67698105ee8 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期四, 28 九月 2023 18:11:34 +0800
Subject: [PATCH] 工艺模型 详情的前端开发
---
src/components/ProcessModelDetails.vue | 523 +++++++++++++++++++++++++++++
src/components/ProcessModel.vue | 510 ++++++++++++++++++++++++++++
public/process-model.png | 0
src/views/visualization.vue | 22 +
public/process-tip.png | 0
public/tank-two.png | 0
6 files changed, 1,053 insertions(+), 2 deletions(-)
diff --git a/public/process-model.png b/public/process-model.png
new file mode 100644
index 0000000..8becfbb
--- /dev/null
+++ b/public/process-model.png
Binary files differ
diff --git a/public/process-tip.png b/public/process-tip.png
new file mode 100644
index 0000000..dae2876
--- /dev/null
+++ b/public/process-tip.png
Binary files differ
diff --git a/public/tank-two.png b/public/tank-two.png
new file mode 100644
index 0000000..7dc322a
--- /dev/null
+++ b/public/tank-two.png
Binary files differ
diff --git a/src/components/ProcessModel.vue b/src/components/ProcessModel.vue
new file mode 100644
index 0000000..e90339e
--- /dev/null
+++ b/src/components/ProcessModel.vue
@@ -0,0 +1,510 @@
+<template>
+ <!-- top="10vh" -->
+ <el-dialog
+ :close-on-click-modal="false"
+ :visible.sync="islook"
+ width="938px"
+ class="add-event-dialog"
+ :show-close="false"
+ >
+ <div class="tank-box">
+ <div slot="title" class="tac drawerHeader">
+ <span class="title-l">宸ヨ壓妯″瀷搴�</span>
+ <span class="title-r" @click="closeClick">
+ <img src="../../public/close.png" />
+ </span>
+ </div>
+ <div class="dialog-content-box">
+ <div
+ style="
+ margin: 0 auto;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ text-align: left;
+ "
+ >
+ <template>
+ <div class="title-auto-box">
+ <div class="title-box margin_bottom_20">
+ <div class="title-item" v-for="(item,index) in processList" :key="index">
+ <div class="item-l-bng">
+ <img src="../../public/process-model.png" />
+ </div>
+ <div class="item-r" @click="processDetailsClick(item)">
+ <div class="item-r-t font_weight">{{ item.name }}</div>
+ <div class="item-r-b">褰撳墠宸ヨ壓缂栧彿锛歿{ item.number }}</div>
+ </div>
+ <div class="tip-r">
+ <img src="../../public/process-tip.png" />
+ </div>
+ <div class="tip-current">褰撳墠浣跨敤</div>
+ <div class="btn">
+ <el-button
+ type="primary"
+ size="mini"
+ class="color_organge"
+ @click="finishClick(index, taskData)"
+ >
+ 鏇存柊宸ヨ壓</el-button
+ >
+ </div>
+ </div>
+ </div>
+ </div>
+ </template>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer tac" style="overflow: hidden">
+
+ <el-button
+ type="primary"
+ size="mini"
+ class="color_blue margin_right_20px"
+ @click="onSubmit()"
+ >
+ 涓婁竴椤�</el-button
+ >
+
+ <el-button
+ type="primary"
+ size="mini"
+ disabled
+ class="color_blue"
+ v-prevent-re-click="3000"
+ @click="onSubmit()"
+ >
+ 涓嬩竴椤�</el-button
+ >
+ </div>
+ <!-- <ErrorIssue ref="error" :messageError="messageError" @shutdown="shutdown"/> -->
+ <ProcessModelDetails
+ ref="processDetails"
+ :processObj="processObj"
+ />
+ </div>
+
+ </el-dialog>
+</template>
+
+<script>
+import {
+ startTask,
+ sendProcessParams,
+} from "@/api/home/index"; // 浜х嚎
+import ProcessModelDetails from "@/components/ProcessModelDetails";
+export default {
+ components: {ProcessModelDetails},
+ props: {
+ processList: {
+ type: [Array],
+ default: () => {
+ return [];
+ },
+ },
+ },
+ data() {
+ return {
+ islook: false,
+ isLoading:false,
+ processObj:{}
+ };
+ },
+ mounted() {
+ this.getInfo();
+ },
+ watch: {
+ islook(){
+ },
+ },
+ methods: {
+ processDetailsClick(item){
+ this.processObj=item;
+ this.$refs.processDetails.islook=true;
+ },
+ closeClick() {
+ this.shutdown();
+ },
+ getInfo() {
+ // 1 鏈敓浜� 2鐢熶骇涓� 3鐢熶骇瀹屾垚
+ // if (
+ // Object.keys(this.processList).length > 0
+ // ) {
+ // this.islook = true;
+ // } else {
+ // this.islook = false;
+ // }
+ },
+ onSubmit() {
+ if(this.isLoading){
+ return true;
+ }
+ this.isLoading=true;
+ // sendProcessParams({ procedureId: this.processList.Procedure.ID,position: Number(this.taskData.Position), }).then((res) => {
+ // if (res.code == 200) {
+ // this.resParams = res;
+ // this.isLoading=false;
+ // } else {
+ // this.isLoading=false;
+ // this.resParams = res;
+ // }
+ // });
+ setTimeout(()=>{
+ this.isLoading=false;
+ },30000)
+ },
+ shutdown() {
+ this.islook = false;
+ },
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.color_error{
+ color:red;
+}
+.color_success{
+ color:green;
+}
+.tank-box {
+ width: 938px;
+ height: 733px;
+ background: url("../../public/tank-two.png") no-repeat center center / cover;
+ position: relative;
+ .dialog-footer {
+ position: absolute;
+ bottom: 45px;
+ width:100%;
+ text-align:center;
+
+ }
+
+}
+.margin_right_20px{
+ margin-right:20px;
+}
+.margin-top-10px{
+ margin-top:10px;
+}
+.margin-top-40px{
+ margin-top:40px;
+}
+.color_organge {
+ background: #f76c0f;
+ color:#fff;
+ border:0!important;
+ font-size:14px;
+ padding:10px 15px!important;
+}
+.color_blue{
+ background:#4343f5!important;
+ border:0!important;
+ font-size:16px;
+ padding:10px 25px!important;
+}
+.color_4efefa {
+ color: #4efefa !important;
+}
+.color_fff {
+ color: #fff;
+}
+.font_size_20 {
+ font-size: 20px !important;
+}
+.font_weight{
+ font-weight: 700;
+}
+.margin_bottom_13 {
+ margin-bottom: 13px;
+}
+.title-box {
+ width: calc(100% - 140px);
+ height: auto;
+ overflow: hidden;
+ padding:0 70px;
+}
+.error-t {
+ width: 100px;
+ margin: 100px auto 40px;
+ font-size:98px;
+ span {
+ display: inline-block;
+ }
+}
+.error-m {
+ line-height: 35px;
+ font-size: 28px;
+ color: #fff;
+ margin-bottom: 20px;
+ text-align: center;
+}
+::v-deep .el-dialog {
+ background: transparent;
+}
+::v-deep .el-dialog__header {
+ padding: 0 !important;
+}
+::v-deep .el-dialog__body {
+ padding: 0 !important;
+}
+.btn-error{
+ bottom:80px!important;
+}
+
+::v-deep .el-tabs__content {
+ height: calc(100% - 55px);
+ overflow-y: auto;
+}
+.circel {
+ width: 100px;
+ height: 100px;
+ border-radius: 50%;
+ border: 2px solid rgba(12, 79, 218, 1);
+ position: relative;
+ float: left;
+ .circel-two {
+ width: 75px;
+ height: 75px;
+ position: absolute;
+ top: 11px;
+ left: 11px;
+ border-radius: 50%;
+ border: 2px solid rgba(12, 79, 218, 1);
+ }
+}
+.circel-text {
+ color: #fff;
+ margin-left: 20px;
+ .circel-text-t {
+ font-size: 18px;
+ line-height: 40px;
+ }
+ .circel-text-b {
+ font-weight: 700;
+ font-size: 14px;
+
+ span {
+ color: rgba(12, 79, 218, 1);
+ font-size: 38px;
+ margin-right: 10px;
+ }
+ }
+}
+.color_red {
+ width: 100%;
+ margin: 0 auto;
+ text-align: center;
+ font-size: 14px;
+ margin-bottom: 25px;
+}
+.form-item {
+ width: calc(50% - 20px);
+ float: left;
+ &:nth-child(odd) {
+ margin-right: 20px;
+ }
+}
+.form-item-two {
+ width: calc(50% - 20px);
+ float: left;
+ &:nth-of-type(odd) {
+ margin-right: 20px;
+ }
+}
+.form-item-three {
+ width: calc(100% - 20px);
+ float: left;
+}
+.form-item-check {
+ width: calc(33% - 40px);
+ float: left;
+ &:nth-of-type(odd) {
+ margin-right: 20px;
+ }
+}
+.title {
+ width: 100%;
+}
+.dialog-content-box {
+ height: calc(100% - 210px);
+ // overflow: hidden;
+ padding: 60px 0px 10px;
+ .el-form {
+ overflow: hidden;
+ }
+ .title-auto-box {
+ height: calc(100% - 0px);
+ overflow: auto;
+ width:calc(100% - 140px);
+ margin: 0 auto;
+ padding-top:20px;
+ .title-box{
+ padding:0 10px;
+ overflow:hidden;
+ width:calc(100% - 20px);
+ .title-item{
+ width:calc(50% - 35px);
+ height:70px;
+ padding:23px 10px 10px;
+ background:#31478f;
+ border-radius: 8px;
+ float:left;
+ overflow:hidden;
+ font-size:15px;
+ position:relative;
+ margin-bottom:30px;
+ &:nth-of-type(odd){
+ margin-right:30px;
+ }
+ .item-l-bng{
+ width:40px;
+ float:left;
+ margin-right:20px;
+ img{
+ width:100%;
+ }
+ }
+ .item-r{
+ width:calc(100% - 60px);
+ float:left;
+ line-height:25px;
+ color:#fff;
+ font-size:16px;
+ cursor:pointer;
+ .item-r-t{
+ font-size:16px;
+ }
+ .item-r-b{
+ font-size:14px;
+ }
+ }
+ .tip-r{
+ position:absolute;
+ top:5px;
+ right:15px;
+ width:20px;
+ img{
+ width:100%;
+ }
+ }
+ .tip-current{
+ background:green;
+ color:#fff;
+ position:absolute;
+ top:0px;
+ left:75px;
+ width:auto;
+ padding:2px 15px;
+ font-size:12px;
+ border-radius:0px 0px 6px 6px;
+ }
+ .btn{
+ width:100px;
+ position:absolute;
+ right:0px;
+ bottom:10px;
+ }
+ }
+ }
+ }
+ .gif-box{
+ width:230px;
+ margin:0 auto;
+ margin-bottom:5px;
+ .gif-right{
+ width:210px;
+ font-size:14px;
+ color:#fff;
+ line-height:28px;
+ span{
+ font-weight: 700;
+ font-size:18px;
+ }
+ }
+ }
+ .gif{
+ width:55px;
+ vertical-align: middle;
+ float:left;
+ margin-right:20px;
+ img{
+ width:100%;
+ }
+ .yuandian {
+ width: 55px;
+ height: 55px;
+ float:left;
+ // background: #15d815;
+ background:red;
+ border-radius: 50%;
+ // margin-top:-5px;
+ vertical-align: middle;
+ }
+ }
+ .progress-item {
+ width: 55%;
+ padding: 2px 8px;
+ height: 20px;
+ background: #fff;
+ border-radius: 30px;
+ margin: 0 auto;
+ border: 2px solid rgba(255, 255, 255, 0.5);
+ box-shadow: 1px 5px 5px rgba(255, 255, 255, 0.5);
+ span {
+ float: left;
+ font-weight: 700;
+ color: #333;
+ font-size: 15px;
+ }
+ }
+}
+.num-identify {
+ padding: 5px 8px;
+ background-color: rgba(255, 153, 0, 1);
+ border-radius: 6px;
+ font-size: 14px;
+ color: #fff;
+ font-weight: 600;
+}
+.drawerHeader {
+ width:99%;
+ margin:0 auto;
+ overflow:hidden;
+ .title-l{
+ width:25%;
+ float:left;
+ margin-left:30px;
+ font-size: 22px;
+ color: #fff;
+ height: 3.2vw;
+ line-height: 4.5vw;
+ }
+ .title-r{
+ width:60px;
+ float:right;
+ height: 50px;
+ line-height: 5vw;
+ cursor:pointer;
+ img{
+ display:inline-block;
+ width:100%;
+ }
+ }
+ .identify {
+ width: 80px;
+ height: 25px;
+ line-height: 25px;
+ text-align: center;
+ border: 1px solid rgba(255, 153, 0, 1);
+ border-radius: 6px;
+ font-size: 16px;
+ color: rgba(255, 153, 0, 1);
+ transform: rotate(15deg);
+ font-weight: 600;
+ margin-right: 100px;
+ margin-top: 12px;
+ float: right;
+ }
+}
+</style>
diff --git a/src/components/ProcessModelDetails.vue b/src/components/ProcessModelDetails.vue
new file mode 100644
index 0000000..e019e1e
--- /dev/null
+++ b/src/components/ProcessModelDetails.vue
@@ -0,0 +1,523 @@
+<template>
+ <!-- top="10vh" -->
+ <el-dialog
+ :close-on-click-modal="false"
+ :visible.sync="islook"
+ width="758px"
+ class="add-event-dialog"
+ :show-close="false"
+ append-to-body
+ >
+ <div class="tank-box">
+ <div slot="title" class="tac drawerHeader">
+ <span class="title-l">宸ヨ壓璇︽儏</span>
+ <span class="title-r" @click="closeClick">
+ <img src="../../public/close.png" />
+ </span>
+ </div>
+ <div class="dialog-content-box">
+ <div
+ style="
+ margin: 0 auto;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ text-align: left;
+ "
+ >
+ <template>
+ <div class="title-auto-box">
+ <div class="title-box-t margin_bottom_20">
+ <div class="item-l">
+ <div class="item-l-t">{{ processObj.name }}</div>
+ <div class="item-l-b">{{ processObj.name }}</div>
+ </div>
+ <div class="item-r">
+ 宸ヨ壓缂栧彿锛歿{ processObj.number }}
+ </div>
+ </div>
+ <div class="title-box-b">
+ <div class="item-b-t">鏇存柊璁剧疆</div>
+ <div class="item-b-m">
+ <div class="item-b-b-l"><span class="el-icon-refresh"></span></div>
+ <div class="item-b-b-r">
+ <span>宸叉鏌ュ埌鏂扮増鏈細H2131221</span>
+ <div class="item-b-btn">
+ 鏇存柊宸ヨ壓
+ </div>
+ </div>
+ </div>
+ <div class="item-b-b">
+ <div class="item-two-l">
+ <div class="item-two-t">{{ processObj.name }}</div>
+ <div class="item-two-b">{{ processObj.name }}</div>
+ </div>
+ <div class="item-two-r">
+ 鏂扮増鏈細{{ processObj.number }}
+ </div>
+ </div>
+ </div>
+ </div>
+ </template>
+ </div>
+ </div>
+ <div slot="footer" class="dialog-footer tac" style="overflow: hidden">
+ </div>
+
+ </div>
+
+ </el-dialog>
+</template>
+
+<script>
+import {
+ startTask,
+ sendProcessParams,
+} from "@/api/home/index"; // 浜х嚎
+export default {
+ components: {},
+ props: {
+ processObj: {
+ type: [Object],
+ default: () => {
+ return {};
+ },
+ },
+ },
+ data() {
+ return {
+ islook: false,
+ isLoading:false,
+ };
+ },
+ mounted() {
+ this.getInfo();
+ },
+ watch: {
+ islook(){
+ },
+ },
+ methods: {
+ processDetailsClick(item){
+
+ },
+ closeClick() {
+ this.shutdown();
+ },
+ getInfo() {
+ // 1 鏈敓浜� 2鐢熶骇涓� 3鐢熶骇瀹屾垚
+ if (
+ Object.keys(this.processObj).length > 0
+ ) {
+ this.islook = true;
+ } else {
+ this.islook = false;
+ }
+ },
+ shutdown() {
+ this.islook = false;
+ },
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.color_error{
+ color:red;
+}
+.color_success{
+ color:green;
+}
+.tank-box {
+ width:758px;
+ height:593px;
+ background: url("../../public/tank-two.png") no-repeat center center / cover;
+ position: relative;
+ .dialog-footer {
+ position: absolute;
+ bottom: 45px;
+ width:100%;
+ text-align:center;
+
+ }
+
+}
+.margin_right_20px{
+ margin-right:20px;
+}
+.margin-top-10px{
+ margin-top:10px;
+}
+.margin-top-40px{
+ margin-top:40px;
+}
+.color_organge {
+ background: #f76c0f;
+ color:#fff;
+ border:0!important;
+ font-size:14px;
+ padding:10px 15px!important;
+}
+.color_blue{
+ background:#4343f5!important;
+ border:0!important;
+ font-size:16px;
+ padding:10px 25px!important;
+}
+.color_4efefa {
+ color: #4efefa !important;
+}
+.color_fff {
+ color: #fff;
+}
+.font_size_20 {
+ font-size: 20px !important;
+}
+.font_weight{
+ font-weight: 700;
+}
+.margin_bottom_13 {
+ margin-bottom: 13px;
+}
+.title-box {
+ width: calc(100% - 140px);
+ height: auto;
+ overflow: hidden;
+ padding:0 70px;
+}
+.error-t {
+ width: 100px;
+ margin: 100px auto 40px;
+ font-size:98px;
+ span {
+ display: inline-block;
+ }
+}
+.error-m {
+ line-height: 35px;
+ font-size: 28px;
+ color: #fff;
+ margin-bottom: 20px;
+ text-align: center;
+}
+::v-deep .el-dialog {
+ background: transparent;
+}
+::v-deep .el-dialog__header {
+ padding: 0 !important;
+}
+::v-deep .el-dialog__body {
+ padding: 0 !important;
+}
+.btn-error{
+ bottom:80px!important;
+}
+
+::v-deep .el-tabs__content {
+ height: calc(100% - 55px);
+ overflow-y: auto;
+}
+.circel {
+ width: 100px;
+ height: 100px;
+ border-radius: 50%;
+ border: 2px solid rgba(12, 79, 218, 1);
+ position: relative;
+ float: left;
+ .circel-two {
+ width: 75px;
+ height: 75px;
+ position: absolute;
+ top: 11px;
+ left: 11px;
+ border-radius: 50%;
+ border: 2px solid rgba(12, 79, 218, 1);
+ }
+}
+.circel-text {
+ color: #fff;
+ margin-left: 20px;
+ .circel-text-t {
+ font-size: 18px;
+ line-height: 40px;
+ }
+ .circel-text-b {
+ font-weight: 700;
+ font-size: 14px;
+
+ span {
+ color: rgba(12, 79, 218, 1);
+ font-size: 38px;
+ margin-right: 10px;
+ }
+ }
+}
+.color_red {
+ width: 100%;
+ margin: 0 auto;
+ text-align: center;
+ font-size: 14px;
+ margin-bottom: 25px;
+}
+.form-item {
+ width: calc(50% - 20px);
+ float: left;
+ &:nth-child(odd) {
+ margin-right: 20px;
+ }
+}
+.form-item-two {
+ width: calc(50% - 20px);
+ float: left;
+ &:nth-of-type(odd) {
+ margin-right: 20px;
+ }
+}
+.form-item-three {
+ width: calc(100% - 20px);
+ float: left;
+}
+.form-item-check {
+ width: calc(33% - 40px);
+ float: left;
+ &:nth-of-type(odd) {
+ margin-right: 20px;
+ }
+}
+.title {
+ width: 100%;
+}
+.dialog-content-box {
+ height: calc(100% - 140px);
+ // overflow: hidden;
+ padding: 60px 0px 10px;
+ .el-form {
+ overflow: hidden;
+ }
+ .title-auto-box {
+ height: calc(100% - 0px);
+ overflow: auto;
+ width:calc(100% - 140px);
+ margin: 0 auto;
+ padding-top:20px;
+ .title-box-t{
+ overflow:hidden;
+ width:calc(100% - 80px);
+ background:#0E246A;
+ min-height:100px;
+ height:auto;
+ color:#fff;
+ padding:15px 30px;
+ border-radius: 6px;
+ margin-bottom:20px;
+ .item-auto-box{
+ overflow:auto;
+ }
+ .item-l{
+ width:calc(100% - 140px);
+ height:100%;
+ float:left;
+ font-size:17px;
+ .item-l-t{
+ color:#4efefa;
+ margin-bottom:20px;
+ }
+ .item-l-b{
+ font-size:16px;
+ }
+ }
+ .item-r{
+ width:120px;
+ padding:10px 10px;
+ border-radius:10px;
+ background:#4343f5;
+ float:left;
+ text-align:center;
+ }
+ }
+ .title-box-b{
+ overflow:hidden;
+ width:calc(100% - 80px);
+ background:#0E246A;
+ min-height:250px;
+ height:auto;
+ color:#fff;
+ padding:15px 30px;
+ border-radius: 6px;
+ .item-b-t{
+ font-size:18px;
+ margin-bottom:10px;
+ }
+ .item-b-m{
+ width:100%;
+ margin:0 auto;
+ overflow:hidden;
+ .item-b-b-l{
+ float:left;
+ width:calc(40% - 5px);
+ border-right:3px solid #fff;
+ span{
+ width:50px;
+ height:50px;
+ background:#fff;
+ border-radius: 50%;
+ color:blue;
+ font-size:30px;
+ line-height:50px;
+ text-align:center;
+ display:inline-block;
+ font-weight: 700;
+ float:right;
+ margin-right:20px;
+ }
+ }
+ .item-b-b-r{
+ width:calc(60% - 20px);
+ margin-left:20px;
+ float:left;
+ span{
+ display:inline-block;
+ width:100%;
+
+ }
+ .item-b-btn{
+ width:90px;
+ padding:8px 10px;
+ border-radius:10px;
+ background:#4343f5;
+ float:left;
+ text-align:center;
+ margin-top:10px;
+ }
+ }
+ }
+ .item-b-b{
+ width:calc(100% - 160px);
+ margin:10px auto 0;
+ border:1px dotted #fff;
+ height:calc(100% - 40px);
+ overflow:hidden;
+ color:#fff;
+ padding:10px 10px 10px 30px;
+ .item-two-l{
+ width:calc(100% - 140px);
+ height:100%;
+ float:left;
+ font-size:14px;
+ .item-two-t{
+ margin-bottom:10px;
+ }
+ .item-two-b{
+ font-size:14px;
+ }
+ }
+ .item-two-r{
+ width:120px;
+ padding:10px 10px;
+ border-radius:10px;
+ float:left;
+ text-align:right;
+ }
+ }
+ }
+ }
+ .gif-box{
+ width:230px;
+ margin:0 auto;
+ margin-bottom:5px;
+ .gif-right{
+ width:210px;
+ font-size:14px;
+ color:#fff;
+ line-height:28px;
+ span{
+ font-weight: 700;
+ font-size:18px;
+ }
+ }
+ }
+ .gif{
+ width:55px;
+ vertical-align: middle;
+ float:left;
+ margin-right:20px;
+ img{
+ width:100%;
+ }
+ .yuandian {
+ width: 55px;
+ height: 55px;
+ float:left;
+ // background: #15d815;
+ background:red;
+ border-radius: 50%;
+ // margin-top:-5px;
+ vertical-align: middle;
+ }
+ }
+ .progress-item {
+ width: 55%;
+ padding: 2px 8px;
+ height: 20px;
+ background: #fff;
+ border-radius: 30px;
+ margin: 0 auto;
+ border: 2px solid rgba(255, 255, 255, 0.5);
+ box-shadow: 1px 5px 5px rgba(255, 255, 255, 0.5);
+ span {
+ float: left;
+ font-weight: 700;
+ color: #333;
+ font-size: 15px;
+ }
+ }
+}
+.num-identify {
+ padding: 5px 8px;
+ background-color: rgba(255, 153, 0, 1);
+ border-radius: 6px;
+ font-size: 14px;
+ color: #fff;
+ font-weight: 600;
+}
+.drawerHeader {
+ width:99%;
+ margin:0 auto;
+ overflow:hidden;
+ .title-l{
+ width:25%;
+ float:left;
+ margin-left:30px;
+ font-size: 22px;
+ color: #fff;
+ height: 3.2vw;
+ line-height: 4.5vw;
+ }
+ .title-r{
+ width:60px;
+ float:right;
+ height: 50px;
+ line-height: 5vw;
+ cursor:pointer;
+ img{
+ display:inline-block;
+ width:100%;
+ }
+ }
+ .identify {
+ width: 80px;
+ height: 25px;
+ line-height: 25px;
+ text-align: center;
+ border: 1px solid rgba(255, 153, 0, 1);
+ border-radius: 6px;
+ font-size: 16px;
+ color: rgba(255, 153, 0, 1);
+ transform: rotate(15deg);
+ font-weight: 600;
+ margin-right: 100px;
+ margin-top: 12px;
+ float: right;
+ }
+}
+</style>
diff --git a/src/views/visualization.vue b/src/views/visualization.vue
index ea1c833..2da3f20 100644
--- a/src/views/visualization.vue
+++ b/src/views/visualization.vue
@@ -360,9 +360,9 @@
></p>
<div class="right-small-btn bottom-box-btn">
<el-button type="primary"> 鎵撳嵃</el-button>
- <el-button v-if="taskData.Procedure.Status==3" type="primary" class="huise"> 瀹屾垚</el-button>
+
<el-popover
- v-else
+ v-if="taskData.Procedure.Status!=3"
placement="top-end"
width="160"
class="button-finish"
@@ -385,6 +385,7 @@
</div>
<el-button type="primary" slot="reference"> 瀹屾垚</el-button>
</el-popover>
+ <el-button v-else type="primary" class="huise"> 瀹屾垚</el-button>
</div>
</div>
<i class="el-icon-arrow-right font-arrow-20 color_318583"></i>
@@ -603,6 +604,11 @@
@getSetProductNumber="reloadPage"
@isTip="isTip"
/>
+ <!-- 宸ヨ壓妯″瀷 -->
+ <ProcessModel
+ ref="processModel"
+ :processList="processList"
+ />
</div>
</template>
@@ -621,12 +627,14 @@
import Knowledge from "../components/Knowledge.vue";
import AddControl from "../components/AddControl.vue";
import AddIssue from "../components/AddIssue.vue";
+import ProcessModel from "../components/ProcessModel.vue";
export default {
components: {
Card,
Knowledge,
AddControl,
AddIssue,
+ ProcessModel,
},
data() {
return {
@@ -746,6 +754,16 @@
outputMaterials: [],
procedureList: [],
},
+ processList:[
+ {
+ name:'浜у搧1+宸ヨ壓2',
+ number:'v1.0'
+ },
+ {
+ name:'浜у搧1+宸ヨ壓2',
+ number:'v2.0'
+ }
+ ]
};
},
mounted() {
--
Gitblit v1.8.0