| | |
| | | :visible.sync="islook" |
| | | width="758px" |
| | | class="add-event-dialog" |
| | | top="21vh" |
| | | :show-close="false" |
| | | append-to-body |
| | | > |
| | |
| | | > |
| | | <template> |
| | | <div class="title-auto-box"> |
| | | <div class="title-box-t margin_bottom_20"> |
| | | <div :class="processObj.isUpdate?'title-box-t margin_bottom_20':'title-box-t title-box-t-two'"> |
| | | <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 class="item-l-t">{{ processObj.procedure }}</div> |
| | | <div class="item-l-b"> |
| | | <span v-for="(item,index) in processObj.paramsMap" :key="index"> |
| | | {{ index }} : {{ item }}; |
| | | </span> |
| | | </div> |
| | | </div> |
| | | <div class="title-box-b"> |
| | | <div class="item-r">工艺编号:{{ processObj.number }}</div> |
| | | </div> |
| | | <div class="title-box-b" v-if="processObj.isUpdate"> |
| | | <div class="item-b-t">更新设置</div> |
| | | <template v-if="isUpdate == 1"> |
| | | <div class="item-b-m"> |
| | | <div class="item-b-b-l"><span class="el-icon-refresh"></span></div> |
| | | <div class="item-b-b-l"> |
| | | <span class="el-icon-refresh refresh-icon" style="float: right;"></span> |
| | | </div> |
| | | <div class="item-b-b-r"> |
| | | <span>已检查到新版本:H2131221</span> |
| | | <div class="item-b-btn"> |
| | | <span>已检查到新版本:{{ processObj.newNumber }}</span> |
| | | <div class="item-b-btn" @click="updateProcess"> |
| | | 更新工艺 |
| | | </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 class="item-two-t">{{ processObj.procedure }}</div> |
| | | <div class="item-two-b"> |
| | | <span v-for="(item,index) in processObj.newParamsMap" :key="index"> |
| | | {{ index }} : {{ item }}; |
| | | </span> |
| | | </div> |
| | | </div> |
| | | <div class="item-two-r"> |
| | | 新版本:{{ processObj.number }} |
| | | 新版本:{{ processObj.newNumber }} |
| | | </div> |
| | | </div> |
| | | </template> |
| | | <template v-if="isUpdate == 2"> |
| | | <div class="refresh-box"> |
| | | <template v-if="isLoading"> |
| | | <span class="transform el-icon-refresh refresh-icon"></span> |
| | | <div class="refresh-line">更新中,请稍后...</div> |
| | | </template> |
| | | <template v-else> |
| | | <span class="el-icon-top refresh-top-icon"></span> |
| | | <div class="refresh-line">已是最新版本</div> |
| | | </template> |
| | | </div> |
| | | </template> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | </div> |
| | | </div> |
| | | <div slot="footer" class="dialog-footer tac" style="overflow: hidden"> |
| | | <div |
| | | slot="footer" |
| | | class="dialog-footer tac" |
| | | style="overflow: hidden" |
| | | ></div> |
| | | </div> |
| | | |
| | | </div> |
| | | |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | startTask, |
| | | sendProcessParams, |
| | | } from "@/api/home/index"; // 产线 |
| | | import { updateProcessParams} from "@/api/home/index"; // 产线 |
| | | export default { |
| | | components: {}, |
| | | props: { |
| | |
| | | return {}; |
| | | }, |
| | | }, |
| | | listData: { |
| | | type: [Array,Object], |
| | | default: () => { |
| | | return {}; |
| | | }, |
| | | }, |
| | | }, |
| | | data() { |
| | | return { |
| | | islook: false, |
| | | isLoading:false, |
| | | isUpdate: 1, |
| | | }; |
| | | }, |
| | | mounted() { |
| | | this.getInfo(); |
| | | }, |
| | | watch: { |
| | | islook(){ |
| | | }, |
| | | }, |
| | | methods: { |
| | | processDetailsClick(item){ |
| | | |
| | | updateProcess() { |
| | | this.isUpdate = 2; |
| | | if (this.isLoading) { |
| | | return true; |
| | | } |
| | | this.isLoading=true; |
| | | updateProcessParams({procedureId:this.listData.Procedure.ID}).then(res=>{ |
| | | if(res.code==200){ |
| | | this.isLoading=false; |
| | | this.$message.success('更新成功!') |
| | | this.$emit('renew') |
| | | }else{ |
| | | this.isLoading=false; |
| | | this.isUpdate=1 |
| | | } |
| | | }) |
| | | setTimeout(()=>{ |
| | | this.isLoading=false; |
| | | },50000) |
| | | }, |
| | | closeClick() { |
| | | this.shutdown(); |
| | | }, |
| | | getInfo() { |
| | | // 1 未生产 2生产中 3生产完成 |
| | | if ( |
| | | Object.keys(this.processObj).length > 0 |
| | | ) { |
| | | if (Object.keys(this.processObj).length > 0) { |
| | | this.isUpdate = 1; |
| | | this.isLoading = false; |
| | | this.islook = true; |
| | | } else { |
| | | this.islook = false; |
| | |
| | | bottom: 45px; |
| | | width:100%; |
| | | text-align:center; |
| | | |
| | | } |
| | | |
| | | } |
| | | .margin_right_20px{ |
| | | margin-right:20px; |
| | |
| | | .el-form { |
| | | overflow: hidden; |
| | | } |
| | | .refresh-icon { |
| | | width: 50px; |
| | | height: 50px; |
| | | background: #fff; |
| | | border-radius: 50%; |
| | | color: blue; |
| | | font-size: 31px; |
| | | line-height: 50px; |
| | | text-align: center; |
| | | display: inline-block; |
| | | font-weight: 700; |
| | | margin-right: 20px; |
| | | } |
| | | .refresh-top-icon { |
| | | width: 50px; |
| | | height: 50px; |
| | | border:4px solid #b0b0b0; |
| | | border-radius: 50%; |
| | | color: #b0b0b0; |
| | | font-size: 31px; |
| | | line-height: 50px; |
| | | text-align: center; |
| | | display: inline-block; |
| | | font-weight: 700; |
| | | margin-right: 20px; |
| | | } |
| | | .transform{ |
| | | -webkit-animation: spin 1s linear infinite; |
| | | -ms-amimation:spin 1s linear infinite; |
| | | -moz-amimation:spin 1s linear infinite; |
| | | -o-amimation:spin 1s linear infinite; |
| | | } |
| | | @keyframes spin { |
| | | 0%,15%{ |
| | | transform:rotate(0); |
| | | } |
| | | 100%{ |
| | | transform:rotate(360deg); |
| | | } |
| | | } |
| | | .title-auto-box { |
| | | height: calc(100% - 0px); |
| | | height: calc(100% - 20px); |
| | | overflow: auto; |
| | | width:calc(100% - 140px); |
| | | margin: 0 auto; |
| | | padding-top:20px; |
| | | .title-box-t-two{ |
| | | height:calc(100% - 55px)!important; |
| | | } |
| | | .title-box-t{ |
| | | overflow:hidden; |
| | | width:calc(100% - 80px); |
| | | background:#0E246A; |
| | | background: #0e246a; |
| | | min-height:100px; |
| | | height:auto; |
| | | color:#fff; |
| | | padding:15px 30px; |
| | | border-radius: 6px; |
| | | margin-bottom:20px; |
| | | position: relative; |
| | | .item-auto-box{ |
| | | overflow:auto; |
| | | } |
| | | .item-l{ |
| | | width:calc(100% - 140px); |
| | | width: 100%; |
| | | height:100%; |
| | | float:left; |
| | | font-size:17px; |
| | | .item-l-t{ |
| | | width: calc(100% - 180px); |
| | | color:#4efefa; |
| | | margin-bottom:20px; |
| | | margin-bottom: 10px; |
| | | } |
| | | .item-l-b{ |
| | | width: 100%; |
| | | height: calc(100% - 40px); |
| | | font-size:16px; |
| | | } |
| | | } |
| | | .item-r{ |
| | | width:120px; |
| | | padding:10px 10px; |
| | | width: 180px; |
| | | padding: 8px 5px; |
| | | border-radius:10px; |
| | | background:#4343f5; |
| | | float:left; |
| | | background: #06066a; |
| | | position: absolute; |
| | | right: 10px; |
| | | top: 10px; |
| | | text-align:center; |
| | | } |
| | | } |
| | | .title-box-b{ |
| | | overflow:hidden; |
| | | width:calc(100% - 80px); |
| | | background:#0E246A; |
| | | background: #0e246a; |
| | | min-height:250px; |
| | | height:auto; |
| | | color:#fff; |
| | |
| | | .item-b-t{ |
| | | font-size:18px; |
| | | margin-bottom:10px; |
| | | color:#eee; |
| | | } |
| | | .refresh-box{ |
| | | width:240px; |
| | | margin:0 auto; |
| | | .refresh-icon,.refresh-top-icon{ |
| | | margin: 0 auto; |
| | | margin-left:95px; |
| | | } |
| | | .refresh-line{ |
| | | width:100%; |
| | | height:40px; |
| | | border-top:5px solid #fff; |
| | | line-height:40px; |
| | | text-align:center; |
| | | font-size:18px; |
| | | color:#999; |
| | | margin-top:15px; |
| | | } |
| | | } |
| | | .item-b-m{ |
| | | width:100%; |
| | |
| | | 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); |
| | |
| | | span{ |
| | | display:inline-block; |
| | | width:100%; |
| | | |
| | | } |
| | | .item-b-btn{ |
| | | width:90px; |
| | |
| | | border-radius:10px; |
| | | background:#4343f5; |
| | | float:left; |
| | | cursor: pointer; |
| | | text-align:center; |
| | | margin-top:10px; |
| | | } |
| | |
| | | margin:10px auto 0; |
| | | border:1px dotted #fff; |
| | | height:calc(100% - 40px); |
| | | min-height: 120px; |
| | | overflow:hidden; |
| | | color:#fff; |
| | | padding:10px 10px 10px 30px; |
| | | position: relative; |
| | | .item-two-l{ |
| | | width:calc(100% - 140px); |
| | | width: 100%; |
| | | height:100%; |
| | | float:left; |
| | | font-size:14px; |
| | | .item-two-t{ |
| | | width: calc(100% - 180px); |
| | | margin-bottom:10px; |
| | | } |
| | | .item-two-b{ |
| | | width: 100%; |
| | | height: calc(100% - 40px); |
| | | font-size:14px; |
| | | } |
| | | } |
| | | .item-two-r{ |
| | | width:120px; |
| | | width: 180px; |
| | | padding:10px 10px; |
| | | border-radius:10px; |
| | | float:left; |
| | | position: absolute; |
| | | right: 5px; |
| | | top: 0px; |
| | | text-align:right; |
| | | } |
| | | } |
| | |
| | | width:60px; |
| | | float:right; |
| | | height: 50px; |
| | | line-height: 5vw; |
| | | margin-top:-8px; |
| | | cursor:pointer; |
| | | img{ |
| | | display:inline-block; |