Egalware/cms_thermo_active
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

delete and new layout for add offset tool osai

Browse Source
This commit is contained in:
Alessandro Francia
2018-08-31 15:45:25 +02:00
parent 7235ced5ac
commit e7d7274ffc
10 changed files with 227 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Step/wwwroot/assets/styles/base/alarms.less
+2 -2
View File
@@ -537,7 +537,7 @@
display: flex;
flex-flow: row;
}
.attach{
.attach, .note{
.accordion{
margin-top: 24px;
.filename{
@@ -572,7 +572,7 @@
.filename.selected{
background-color: rgba(255, 255, 255, 0.8);
}
.allattach{
.allattach, .allnote{
display: flex;
height: 64px;
align-items: center;
Step/wwwroot/assets/styles/base/layout.less
+1
View File
@@ -31,6 +31,7 @@
@import "create-queue.less";
@import "program-management.less";
@import "job-editor.less";
@import "scada.less";
@background-color: rgb(216, 216, 216);
@handle-width: 48px;
Step/wwwroot/assets/styles/base/scada.less
+17
View File
@@ -0,0 +1,17 @@
// out: false, sourceMap: false, main: ../style.less
@import "colors.less";
.scada-container{
height: 100%;
width: 100%;
display: flex;
justify-content: center;
padding-top: 104px;
.scada-box{
width: 1808px;
height: 872px;
border-radius: 2px;
background-color: @color-background-white;
box-shadow: 0 3px 5px 0 @color-black-40;
}
}
Step/wwwroot/assets/styles/style.css
+46 -13
View File
@@ -3298,50 +3298,67 @@ footer .container button.big:before {
display: flex;
flex-flow: row;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion {
margin-top: 24px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename {
display: flex;
height: 64px;
align-items: center;
cursor: pointer;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename i {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename i,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename i {
margin: 0 20px 0 20px;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename span {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename span,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename span {
width: 100%;
font-size: 18px;
line-height: 1;
color: #4b4b4b;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename .right {
width: 100%;
display: flex;
justify-content: flex-end;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right button.btn-hidden {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right button.btn-hidden,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename .right button.btn-hidden {
visibility: hidden;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right button.btn-hidden i {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename .right button.btn-hidden i,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename .right button.btn-hidden i {
font-size: 26px;
visibility: visible;
margin: 0 12px;
cursor: pointer;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename.selected {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .filename.selected,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .filename.selected {
background-color: rgba(255, 255, 255, 0.8);
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allattach,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allnote,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allnote {
display: flex;
height: 64px;
align-items: center;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach button.btn-hidden {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach button.btn-hidden,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allattach button.btn-hidden,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allnote button.btn-hidden,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allnote button.btn-hidden {
visibility: hidden;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach button.btn-hidden span {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allattach button.btn-hidden span,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allattach button.btn-hidden span,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion .allnote button.btn-hidden span,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion .allnote button.btn-hidden span {
font-size: 18px;
line-height: 1;
visibility: visible;
@@ -3349,10 +3366,12 @@ footer .container button.big:before {
color: #4b4b4b;
cursor: pointer;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion header {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion header,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion header {
color: #002680;
}
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion header small {
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .attach .accordion header small,
.alarm-history-container .alarm-history-body .alarm-history-body-right .box-right .box-right-action .note .accordion header small {
border: 2px solid #002680;
color: #002680;
}
@@ -12868,6 +12887,20 @@ footer .container button.big:before {
width: 100%;
justify-content: flex-end;
}
.scada-container {
height: 100%;
width: 100%;
display: flex;
justify-content: center;
padding-top: 104px;
}
.scada-container .scada-box {
width: 1808px;
height: 872px;
border-radius: 2px;
background-color: #fff;
box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.4);
}
a,
a:visited,
a:hover,
Step/wwwroot/src/app.modules.js
+3
View File
@@ -67,6 +67,9 @@ export const AlarmHistory = () =>
export const Production = () =>
import ("./components/production.vue");
export const Scada = () =>
import ("./components/scada.vue");
export const CreateQueue = () =>
import ("./components/create-queue.vue");
Step/wwwroot/src/components/alarm-history.vue
+15
View File
@@ -138,6 +138,21 @@
</div>
<div class="note">
<accordion :title="'Note'" :counter="4">
<div class="filename">
<i class="fa fa-file-text-o" v-if="false"></i>
<i class="fa fa-file-image-o" v-if="false"></i>
<i class="fa fa-file-pdf-o" v-if="true"></i>
<span>NomeFile.pdf</span>
<div class="right">
<button class="btn-hidden"><i class="fa fa-file-o"></i></button>
<button class="btn-hidden" ><i class="fa fa-trash" ></i></button>
</div>
</div>
<div class="allnote">
<button class="btn-hidden">
<span>Mostra tutte le note</span>
</button>
</div>
<div class="item text-success">
<strong> Aggiungi una nota</strong> <button class="btn text-22"><i class="fa fa-plus"></i></button>
</div>
Step/wwwroot/src/components/scada.ts
View File
Step/wwwroot/src/components/scada.vue
+8
View File
@@ -0,0 +1,8 @@
<template>
<div class="scada-container">
<div class="scada-box">
</div>
</div>
</template>
<script src="./scada.ts" lang="ts"></script>
Step/wwwroot/src/components/tooling/tooling-equipment.ts
+106 -5
View File
@@ -28,6 +28,10 @@ export default class toolingEquipment extends Vue {
return (this.$store.state as AppModel).tooling.maxTools;
}
public get maxOffsets(): number {
return (this.$store.state as AppModel).tooling.maxOffsets;
}
public get maxEdgesPerTools(): number {
return (this.$store.state as AppModel).tooling.maxEdgesPerTools;
}
@@ -94,6 +98,12 @@ export default class toolingEquipment extends Vue {
public disableList: any = false;
public enableAddEquipment: any = false;
public enableAddEdge: any = false;
public enableAddOffsetToTool: boolean = false;
public offsetId: Array<number> = [];
public availablePos: Array<number> = [];
public offsetSelected: any = null;
public posSelected: any = null;
public maxToolsSiemens(){
if (this.tools.length < this.maxTools) {
@@ -209,6 +219,7 @@ export default class toolingEquipment extends Vue {
this.copySelectedTool = Object.assign({}, item);
this.enableParameters = true;
this.enableEquipment = false;
this.enableAddOffsetToTool = false;
this.selectedEquipment = null;
this.enableModify = false;
if(this.isSiemens){
@@ -281,9 +292,11 @@ export default class toolingEquipment extends Vue {
}
public selectTab(elem) {
debugger
if (elem == 'Parameters') {
this.enableParameters = true;
this.enableEquipment = false;
this.enableAddOffsetToTool = false;
this.selectedEquipment = null;
this.enableModify = false;
}
@@ -291,6 +304,7 @@ export default class toolingEquipment extends Vue {
this.fieldEdge(elem);
this.selectedEquipment = elem;
this.enableEquipment = true;
this.enableAddOffsetToTool = true;
this.enableParameters = false;
this.enableModify = true;
}
@@ -300,23 +314,33 @@ export default class toolingEquipment extends Vue {
this.selectedEquipment = elem;
this.enableEquipment = true;
this.enableParameters = false;
this.enableAddOffsetToTool = false;
this.enableModify = false;
}
else {
this.selectedEquipment = null;
this.enableParameters = true;
this.enableEquipment = false;
this.enableAddOffsetToTool = false;
this.enableModify = false;
}
}
public selectTabNc(elem) {
debugger
if (elem == 'Parameters') {
this.enableParameters = true;
this.enableEquipment = false;
this.selectedEquipment = null;
this.enableModify = false;
}
else if(elem.id < 0){
this.selectedEquipment = elem;
this.enableEquipment = false;
this.enableAddOffsetToTool = true;
this.enableParameters = false;
this.enableModify = true;
}
else if (elem.id >= 0) {
this.toolsConfiguration = (this.$store.state as AppModel).tooling.toolsConfiguration;
this.edgeConfiguration = (this.$store.state as AppModel).tooling.edgesConfiguration;
@@ -354,7 +378,36 @@ export default class toolingEquipment extends Vue {
}
}
this.enableAddOffsetToTool = false;
this.enableModify = false;
this.disableList = false;
this.$forceUpdate();
}
public cancelNc = function () {
// if (this.copySelectedTool) {
// this.selectedTool = this.copySelectedTool;
// toolingActions.updateTool(store, this.copySelectedTool);
// }
if (this.selectedTool.id == null || this.selectedTool.id == 0) {
this.selectedTool = null;
}
else {
for (let l in this.selectedTool.offsetData) {
if (this.selectedTool.offsetData[l] && this.selectedTool.offsetData[l].id <= 0) {
this.selectedTool.offsetData.splice(l, 1);
this.selectedEquipment = null;
this.enableEquipment = false;
this.enableParameters = true;
}
}
}
this.enableAddOffsetToTool = false;
this.enableModify = false;
this.disableList = false;
@@ -385,10 +438,53 @@ export default class toolingEquipment extends Vue {
}
public addOffset(tool){
ModalHelper.offsetAddModal.idTool = tool.id;
ModalHelper.offsetAddModal.offsetData = tool.offsetData;
ModalHelper.ShowModal(ModalAddOffsetTool);
this.selectedTool = null;
debugger
var num;
this.offsetId = [];
this.availablePos = [];
for(let k = 1; k <= this.maxOffsets; k++){
this.offsetId.push(k);
}
for(const key in tool.offsetData){
if(tool.offsetData[key] == null){
num = parseInt(key) + 1;
this.availablePos.push(num);
}
}
// this.enableAddOffsetToTool = true;
// this.enableEquipment = false;
// this.enableParameters = false;
// this.enableModify = true;
var obj = {};
obj["id"] = -1;
tool.offsetData.push(obj);
this.selectTabNc(obj);
// ModalHelper.offsetAddModal.idTool = tool.id;
// ModalHelper.offsetAddModal.offsetData = tool.offsetData;
// ModalHelper.ShowModal(ModalAddOffsetTool);
// this.selectedTool = null;
}
public addOffsetToTool(tool) {
debugger
let idOffset = this.offsetSelected;
let pos= this.posSelected;
awaiter(new ToolingService().AddOffsetToToolPosition(pos, tool.id,idOffset).then(response => {
this.selectedTool = response;
this.selectedTool.offsetData = [response.offset1, response.offset2, response.offset3];
// for(let k in response.offsetData){
// if(response.offsetData[k] && response.offsetData[k].id == idOffset){
// this.selectTabNc(response.offsetData[k]);
// }
// }
for (let l in tool.offsetData) {
if (tool.offsetData[l] && tool.offsetData[l].id < 0) {
tool.offsetData.splice(l, 1);
}
}
this.disableList = false;
this.enableEquipment = false;
this.enableParameters = true;
}))
}
async save(item) {
@@ -551,7 +647,12 @@ export default class toolingEquipment extends Vue {
else{
var position = tool.offsetData.indexOf(model) + 1;
awaiter(new ToolingService().DeleteOffsetFromTool(position, tool.id).then(response => {
this.selectedTool = null;
this.selectedTool = response;
this.selectedTool.offsetData = [response.offset1, response.offset2, response.offset3];
this.selectedEquipment = null;
this.enableEquipment = false;
this.enableParameters = true;
this.enableModify = false;
}));
}
}, null);
Step/wwwroot/src/components/tooling/tooling-equipment.vue
+29 -2
View File
@@ -52,7 +52,8 @@
</div>
<div class="tab-box-scroll scrollable" v-if="!isSiemens">
<button v-for="ed in selectedTool.offsetData" :key="ed.id" class="tab" v-if="ed && ed.id != null" :class="{'active': selectedEquipment == ed}" @click="selectTabNc(ed)">
<span v-if="ed.id>=0">{{'tooling_edgesdataequip_skill_tools' | localize("Tagliente")}} {{ed.id}}</span>
<span v-if="ed.id>=0">{{'tooling_offset_skill_tools' | localize("Offset")}} {{ed.id}}</span>
<span v-if="!ed.id || ed.id<=0">{{'tooling_offset_new' | localize("Nuovo Offset")}}</span>
</button>
<div class="tab plus" :class="{'avoid-clicks': enableAddEdge}">
<button class="btn" @click="addOffset(selectedTool)"><i class="fa fa-plus"></i></button>
@@ -137,7 +138,7 @@
<!-- <div class="box-right-label-header" v-if="!selectedEquipment.id || selectedEquipment.id<0">{{'tooling_edgesdata_label_new' | localize("Creazione nuovo Tagliente")}}</div> -->
<div class="list-skill-equipment scrollable">
<div v-for="ed in selectedTool.offsetData" :key="ed.id" v-if="selectedEquipment == ed" class="list-skill-equipment-category" >
<div v-for="ce in categoriesEdge" :key="ce" class="skill-equipment-category" v-if="filterShowparamLife(ce)">
<div v-for="ce in categoriesEdge" :key="ce" class="skill-equipment-category">
<div class="skill-equipment-category">{{'tooling_equipment_list_category_' + ce | localize(ce)}}</div>
<input-box v-for="c in edgeConfiguration" :key="c.name"
v-if="c.name != '' && c.category == ce"
@@ -171,6 +172,32 @@
<!-- <button class="btn blue-reverse" v-if="enableModify && (!selectedEquipment.id || selectedEquipment.id<=0)" @click="buttonSave(selectedTool, selectedEquipment)">{{'tooling_equipment_button_add' | localize("Aggiungi")}}</button> -->
</div>
</div>
<div class="box-right-body" v-if="enableAddOffsetToTool && !isSiemens">
<div class="box-right-label-header">{{'tooling_addoffset_label' | localize("Scegliere posizione e id dell'Offset da aggiungere")}}</div>
<!-- <div class="box-right-label-header" v-if="!selectedEquipment.id || selectedEquipment.id<0">{{'tooling_edgesdata_label_new' | localize("Creazione nuovo Tagliente")}}</div> -->
<div class="list-skill-equipment scrollable">
<div class="list-skill-equipment-category" >
<div class="skill-equipment-category">
<input-box type="select" :title="'modal_add_offset_tool_position' | localize('Posizione')" v-model="posSelected">
<option v-for="(s,k) in availablePos" :key="k" :value="s">{{s}}</option>
</input-box>
<input-box type="select" :title="'modal_add_offset_tool_id' | localize('Id Offset')" v-model="offsetSelected">
<option v-for="(s, k) in offsetId" :key="k" :value="s">{{'modal_add_offset_tool_abbreviation' | localize('Offset %d',s)}}</option>
</input-box>
</div>
</div>
</div>
<div class="tooling-equipment-footer">
<button class="btn" v-if="!enableModify" @click="modify()">{{'tooling_equipment_button_modify' | localize("Modifica")}}</button>
<button class="btn" v-if="enableModify" @click="cancelNc()">{{'tooling_equipment_button_cancel' | localize("Annulla")}}</button>
<button class="btn blue-reverse" v-if="enableModify" @click="addOffsetToTool(selectedTool)">{{'tooling_equipment_button_add' | localize("Aggiungi")}}</button>
<!-- <button class="btn blue-reverse" v-if="enableModify && (!selectedEquipment.id || selectedEquipment.id<=0)" @click="buttonSave(selectedTool, selectedEquipment)">{{'tooling_equipment_button_add' | localize("Aggiungi")}}</button> -->
</div>
</div>
</div>
</div>