Fix Load Programs modal
This commit is contained in:
@@ -1336,6 +1336,58 @@
|
||||
justify-content: flex-end;
|
||||
border-top: solid 2px @color-whitethree;
|
||||
}
|
||||
|
||||
.box-description{
|
||||
box-sizing: border-box;
|
||||
padding-top: 10px;
|
||||
height: 120px;
|
||||
width: 100%;
|
||||
border-top: solid 2px #e7e7e7;
|
||||
}
|
||||
.box-image{
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-flow: column;
|
||||
min-height: 415px;
|
||||
width: 100%;
|
||||
margin-top: 16px;
|
||||
.box-image-container{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 329px;
|
||||
width: 100%;
|
||||
margin: 25px auto 23px auto;
|
||||
img{
|
||||
max-width: 577px;
|
||||
max-height: 329px;
|
||||
box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
}
|
||||
.linenumber{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
div{
|
||||
width: 32px;
|
||||
height: 18px;
|
||||
button{
|
||||
margin: auto 4px;
|
||||
border: none;
|
||||
padding: 0;
|
||||
background: none;
|
||||
font-size: 18px;
|
||||
line-height: 1;
|
||||
color: @color-greyish-brown;
|
||||
}
|
||||
.target{
|
||||
color: @color-clear-blue;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.@{modal}.modal-job-add-parameter {
|
||||
|
||||
@@ -1417,6 +1417,64 @@
|
||||
justify-content: flex-end;
|
||||
border-top: solid 2px #e7e7e7;
|
||||
}
|
||||
.modal.modal-load-program .box-description,
|
||||
.modal.modal-add-element-queue .box-description {
|
||||
box-sizing: border-box;
|
||||
padding-top: 10px;
|
||||
height: 120px;
|
||||
width: 100%;
|
||||
border-top: solid 2px #e7e7e7;
|
||||
}
|
||||
.modal.modal-load-program .box-image,
|
||||
.modal.modal-add-element-queue .box-image {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
flex-flow: column;
|
||||
min-height: 415px;
|
||||
width: 100%;
|
||||
margin-top: 16px;
|
||||
}
|
||||
.modal.modal-load-program .box-image .box-image-container,
|
||||
.modal.modal-add-element-queue .box-image .box-image-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
min-height: 329px;
|
||||
width: 100%;
|
||||
margin: 25px auto 23px auto;
|
||||
}
|
||||
.modal.modal-load-program .box-image .box-image-container img,
|
||||
.modal.modal-add-element-queue .box-image .box-image-container img {
|
||||
max-width: 577px;
|
||||
max-height: 329px;
|
||||
box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.modal.modal-load-program .box-image .linenumber,
|
||||
.modal.modal-add-element-queue .box-image .linenumber {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.modal.modal-load-program .box-image .linenumber div,
|
||||
.modal.modal-add-element-queue .box-image .linenumber div {
|
||||
width: 32px;
|
||||
height: 18px;
|
||||
}
|
||||
.modal.modal-load-program .box-image .linenumber div button,
|
||||
.modal.modal-add-element-queue .box-image .linenumber div button {
|
||||
margin: auto 4px;
|
||||
border: none;
|
||||
padding: 0;
|
||||
background: none;
|
||||
font-size: 18px;
|
||||
line-height: 1;
|
||||
color: #4b4b4b;
|
||||
}
|
||||
.modal.modal-load-program .box-image .linenumber div .target,
|
||||
.modal.modal-add-element-queue .box-image .linenumber div .target {
|
||||
color: #1791ff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.modal.modal-job-add-parameter {
|
||||
width: 704px;
|
||||
height: 608px;
|
||||
@@ -13840,13 +13898,13 @@ body {
|
||||
height: calc(100vh - 80px);
|
||||
background-color: #d8d8d8;
|
||||
z-index: 100;
|
||||
transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
|
||||
transition: transform 0.5s ease-out;
|
||||
}
|
||||
#main-view .handle {
|
||||
display: none;
|
||||
}
|
||||
#main-view.liftedUp {
|
||||
transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 0.1s ease-out 1s;
|
||||
transition: transform 0.5s ease-out, box-shadow 0.1s ease-out 0.5s;
|
||||
box-shadow: 2px 3px 5px 0 rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
#main-view.turn-up,
|
||||
@@ -13860,7 +13918,7 @@ body {
|
||||
width: 100vw;
|
||||
box-shadow: none;
|
||||
z-index: 250;
|
||||
transition: transform 0.8s cubic-bezier(0.22, 0.61, 0.36, 1);
|
||||
transition: transform 0.5s ease-out;
|
||||
}
|
||||
#main-view-handler .handle {
|
||||
background-color: #d8d8d8;
|
||||
|
||||
@@ -60,6 +60,7 @@ export default class ModalLoadProgram extends Vue {
|
||||
currentFilterSecond: string = "";
|
||||
|
||||
navigationDepth: number = 0;
|
||||
selectedNumberImage: number = 0;
|
||||
|
||||
mounted() {
|
||||
if (typeof cmsClient != "undefined") {
|
||||
@@ -141,7 +142,8 @@ export default class ModalLoadProgram extends Vue {
|
||||
Name: i.name || i.Name,
|
||||
AbsolutePath: i.absolutePath || i.AbsolutePath,
|
||||
Path: i.path || i.Path,
|
||||
IsDirectory: (i.isDirectory != null && i.isDirectory) || (i.IsDirectory != null && i.IsDirectory)
|
||||
IsDirectory: (i.isDirectory != null && i.isDirectory) || (i.IsDirectory != null && i.IsDirectory),
|
||||
IsJob: i.isJob || i.IsJob
|
||||
};
|
||||
});
|
||||
}
|
||||
@@ -185,7 +187,7 @@ export default class ModalLoadProgram extends Vue {
|
||||
} as FileInfo;
|
||||
}
|
||||
|
||||
async fileInfo(str, fromdepth: number) {
|
||||
async fileInfo(str,isJob, fromdepth: number) {
|
||||
this.lastClickPath = str;
|
||||
if (fromdepth == 1)
|
||||
this.secondColumnData.splice(0, this.secondColumnData.length);
|
||||
@@ -194,15 +196,16 @@ export default class ModalLoadProgram extends Vue {
|
||||
this.selectedFile = this.toUpperCaseFileModel(
|
||||
JSON.parse(cmsClient.getProgramInfo(str))
|
||||
);
|
||||
|
||||
this.selectedFileMetadata = JSON.parse(cmsClient.readJobMetadata(str)).metadata;
|
||||
console.log(this.selectedFileMetadata);
|
||||
this.selectedFile.IsJob = isJob;
|
||||
if(isJob){
|
||||
this.selectedFileMetadata = JSON.parse(cmsClient.readJobMetadata(str)).metadata;
|
||||
this.selectedNumberImage = 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if (!this.isLocalNavigation)
|
||||
this.selectedFile = this.toUpperCaseFileModel(
|
||||
await awaiter(fileService.getFileInfo(str)));
|
||||
|
||||
}
|
||||
close() {
|
||||
Factory.Get(MessageService).deleteChannel("esc_pressed");
|
||||
@@ -252,5 +255,9 @@ export default class ModalLoadProgram extends Vue {
|
||||
|
||||
// var result = await ModalHelper.ShowModalAsync(, jobMetadata);
|
||||
|
||||
}
|
||||
|
||||
selectNumberImage(value) {
|
||||
this.selectedNumberImage = value;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
:selected="isInPath(val.AbsolutePath) || val.AbsolutePath == lastClickPath"
|
||||
:withArrow="val.IsDirectory == true"
|
||||
:iconType="val.IsDirectory? 'FOLDER':'FILE'"
|
||||
@click="val.IsDirectory ? navigateTo(val.Path, val.AbsolutePath, isLocalNavigation, 2,1): fileInfo(val.AbsolutePath,1)"></card-folder-path>
|
||||
@click="val.IsDirectory ? navigateTo(val.Path, val.AbsolutePath, isLocalNavigation, 2,1): fileInfo(val.AbsolutePath,val.IsJob,1)"></card-folder-path>
|
||||
</div>
|
||||
</div>
|
||||
<div class="third-column" v-if="navigationDepth <2"></div>
|
||||
@@ -68,7 +68,7 @@
|
||||
:selected="isInPath(val.AbsolutePath) || val.AbsolutePath == lastClickPath"
|
||||
:withArrow="val.IsDirectory == true"
|
||||
:iconType="val.IsDirectory? 'FOLDER':'FILE'"
|
||||
@click="val.IsDirectory? navigateTo(val.Path, val.AbsolutePath, isLocalNavigation, 2,2):fileInfo(val.AbsolutePath,2) "></card-folder-path>
|
||||
@click="val.IsDirectory? navigateTo(val.Path, val.AbsolutePath, isLocalNavigation, 2,2):fileInfo(val.AbsolutePath,val.IsJob,2) "></card-folder-path>
|
||||
<!-- <card-folder-path name="Cliente A" @click="selectItem()" :with-arrow="false"></card-folder-path>-->
|
||||
</div>
|
||||
</div>
|
||||
@@ -89,19 +89,37 @@
|
||||
<button class="btn" disabled><i class="fa fa-pencil-square-o"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="selected-item-body">
|
||||
<div class="selected-item-body" v-if="!selectedFile.IsJob">
|
||||
<div class="selected-item-body-image">
|
||||
<img v-if="selectedFileMetadata.generics && selectedFileMetadata.generics.images[0]" :src="selectedFileMetadata.generics.images[0].base64">
|
||||
<img v-if="selectedFile.PreviewBase64" :src="selectedFile.PreviewBase64">
|
||||
<div v-else class="noimage">
|
||||
{{'modal_load_program_lbl_img_not_found' | localize('Preview non disponibile')}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="selected-item-body-description scrollable">
|
||||
<div class="row" v-for="(item,index) in selectedFileMetadata" :key="'line' + index">
|
||||
<div class="row" v-for="(item,index) in selectedFile.Content" :key="'line' + index">
|
||||
<label>{{item}}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="selected-item-body" v-if="selectedFile.IsJob">
|
||||
<div class="box-image" v-if="selectedFileMetadata.generics.images.length > 0">
|
||||
<div class="box-image-container">
|
||||
<img :src="selectedFileMetadata.generics.images[selectedNumberImage].base64">
|
||||
</div>
|
||||
<div class="linenumber">
|
||||
<div v-for="(n,i) in selectedFileMetadata.generics.images" :key="i"><button :class="{'target': i == selectedNumberImage}" @click="selectNumberImage(i)">{{i+1}}</button></div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="selected-item-body-image">
|
||||
<div class="noimage">
|
||||
{{'modal_load_program_lbl_img_not_found' | localize('Preview non disponibile')}}
|
||||
</div>
|
||||
</div>
|
||||
<div class="box-description" v-if="selectedFileMetadata.generics.description">
|
||||
{{selectedFileMetadata.generics.description}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="selected-item" v-if="!selectedFile">
|
||||
<div class="notselecteditem">
|
||||
|
||||
Reference in New Issue
Block a user