Skip to content

E
electron-printer
Commit 0d4d8e09 by linjinhong
Options

测试提交

parent c145e81b
Showing with 154 additions and 125 deletions
config/env.json
{ {
"apiApiHost":"http://10.168.1.212:8060/api", "apiApiHost":"http://10.168.31.142:8060/api",
"fileApiUrl":"http://10.168.1.212:80/upload/factory", "fileApiUrl":"http://10.168.31.142:80/upload/factory",
"visionUrl":"https://console.jomalls.com" "visionUrl":"https://console.jomalls.com"
} }
src/views/design/main/index.vue
...@@ -846,9 +846,15 @@ export default { ...@@ -846,9 +846,15 @@ export default {
class="border-col" class="border-col"
style="align-items: stretch;flex-grow: 1" style="align-items: stretch;flex-grow: 1"
> >
<div class="img"> <el-carousel
<img class="full-width" src="#" alt="" /> height="150px"
</div> :autoplay="false"
indicator-position="none"
>
<el-carousel-item v-for="item in 4" :key="item">
<img class="full-width" src="#" alt="" />
</el-carousel-item>
</el-carousel>
</el-col> </el-col>
<div class="boxLine"></div> <div class="boxLine"></div>
<el-col <el-col
...@@ -880,12 +886,18 @@ export default { ...@@ -880,12 +886,18 @@ export default {
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row class="border-row">
<el-col :span="6" class="text-center">B面</el-col> <el-col :span="6" class="text-center">B面</el-col>
<el-col :span="9" class="border-col"> <el-col :span="9" class="border-col">
<div class="img"> <el-carousel
<img class="full-width" src="#" alt="" /> height="150px"
</div> :autoplay="false"
indicator-position="none"
>
<el-carousel-item v-for="item in 4" :key="item">
<img class="full-width" src="#" alt="" />
</el-carousel-item>
</el-carousel>
</el-col> </el-col>
<el-col :span="9" style="overflow: hidden;"> <el-col :span="9" style="overflow: hidden;">
<el-checkbox-group <el-checkbox-group
...@@ -1047,137 +1059,154 @@ export default { ...@@ -1047,137 +1059,154 @@ export default {
:style="{ 'background-color': !isView ? '#77797a' : '#fff' }" :style="{ 'background-color': !isView ? '#77797a' : '#fff' }"
> >
<div class="container"> <div class="container">
<div v-if="isView" id="img" style="background-color: #fff; "> <div style="width: 100%;height: 100%; ">
<div <div v-if="isView" id="img">
id="line"
style="left: 26%;top: 57%;background-color: transparent;overflow: hidden;cursor: none;"
>
<div <div
class="sucaitu vieWsucaitu" id="line"
:style="{ width: '100%', height: '100%' }" style="left: 26%;top: 57%;background-color: transparent;overflow: hidden;cursor: none;"
> >
<vue-drag-resize-rotate <div
:w="item.w / WHproportion" class="sucaitu vieWsucaitu"
class-name="my-drag-resize-rotate" :style="{ width: '100%', height: '100%' }"
:prevent-deactivation="false"
:h="item.h / WHproportion"
:x="item.x / WHproportion"
:z="item.zIndex / WHproportion"
:aspectRatio="false"
:isActive="false"
:y="item.y / WHproportion"
v-for="(item, index) in imgList"
:key="index"
:draggable="false"
:resizable="false"
:rotatable="false"
:angle="item.r / WHproportion"
style="pointer-events: auto;cursor: default"
> >
<div <vue-drag-resize-rotate
ref="sucaitu-img" :w="item.w / WHproportion"
:style="{ zIndex: item.zIndex }" class-name="my-drag-resize-rotate"
class="sucaitu-img img element" :prevent-deactivation="false"
style="cursor: default" :h="item.h / WHproportion"
:x="item.x / WHproportion"
:z="item.zIndex / WHproportion"
:aspectRatio="false"
:isActive="false"
:y="item.y / WHproportion"
v-for="(item, index) in imgList"
:key="index"
:draggable="false"
:resizable="false"
:rotatable="false"
:angle="item.r / WHproportion"
style="pointer-events: auto;cursor: default"
> >
<img <div
crossOrigin="anonymous" ref="sucaitu-img"
:src="item.url" :style="{ zIndex: item.zIndex }"
:id="item.fileName + '_' + index" class="sucaitu-img img element"
alt="" style="cursor: default"
style="width: 100%;height: 100%" >
class="sucaitu-img" <img
/> crossOrigin="anonymous"
</div> :src="item.url"
</vue-drag-resize-rotate> :id="item.fileName + '_' + index"
alt=""
style="width: 100%;height: 100%"
class="sucaitu-img"
/>
</div>
</vue-drag-resize-rotate>
</div>
<div
:class="{ 'no-border-grid': systemSetting.gridShow !== 1 }"
:style="{
width: 480 + 'px',
height: 540 + 'px',
}"
class="grid"
style="border-style:dashed"
></div>
</div> </div>
<div <div style="width: 1040px;height: 100%;"></div>
:class="{ 'no-border-grid': systemSetting.gridShow !== 1 }" <!-- <img class="template-img" draggable="false" :src="img" alt="" /> -->
:style="{
width: 480 + 'px',
height: 540 + 'px',
}"
class="grid"
style="border-style:dashed"
></div>
</div> </div>
<img class="template-img" draggable="false" :src="img" alt="" /> <div
</div> v-else
<div v-else id="line" class="boxShaow"> style="width: 100%;height: 100%;background-color:#77797a "
<!-- <div >
<div id="line" class="boxShaow">
<!-- <div
class="sucaitu" class="sucaitu"
:style="{ width: gridWH.w + 'px', height: gridWH.h + 'px' }" :style="{ width: gridWH.w + 'px', height: gridWH.h + 'px' }"
> --> > -->
<div class="sucaitu" :style="{ width: '100%', height: '100%' }"> <div class="sucaitu" :style="{ width: '100%', height: '100%' }">
<vue-drag-resize-rotate <vue-drag-resize-rotate
:w="item.w" :w="item.w"
class-name="my-drag-resize-rotate" class-name="my-drag-resize-rotate"
:prevent-deactivation="false" :prevent-deactivation="false"
:h="item.h" :h="item.h"
:x="item.x" :x="item.x"
:z="item.zIndex" :z="item.zIndex"
:aspectRatio="true" :aspectRatio="true"
:isActive="index === selectIndex" :isActive="index === selectIndex"
:y="item.y" :y="item.y"
v-for="(item, index) in imgList" v-for="(item, index) in imgList"
:key="index" :key="index"
:draggable="true" :draggable="true"
:resizable="true" :resizable="true"
:rotatable="true" :rotatable="true"
@dragstop="(a) => dragStop(a, item)" @dragstop="(a) => dragStop(a, item)"
@resizestop="(a) => resizeStop(a, item)" @resizestop="(a) => resizeStop(a, item)"
@rotatestop="(a) => rotating(a, item)" @rotatestop="(a) => rotating(a, item)"
:angle="item.r" :angle="item.r"
> >
<div
ref="sucaitu-img"
:class="{ active: index === selectIndex }"
:style="{ zIndex: item.zIndex }"
class="sucaitu-img img element"
>
<img
crossOrigin="anonymous"
:src="item.url"
:id="item.fileName + '_' + index"
alt=""
style="width: 100%;height: 100%"
class="sucaitu-img"
/>
<i
@click="delImg(index)"
v-if="index === selectIndex"
class=" close el-icon-close"
></i>
<div
v-if="index === selectIndex"
class="control-point control-rotator"
></div>
</div>
</vue-drag-resize-rotate>
</div>
<div <div
ref="sucaitu-img" :class="{ 'no-border-grid': systemSetting.gridShow !== 1 }"
:class="{ active: index === selectIndex }" :style="{
:style="{ zIndex: item.zIndex }" width: gridWH.w + 'px',
class="sucaitu-img img element" height: gridWH.h + 'px',
}"
class="grid"
> >
<img
crossOrigin="anonymous"
:src="item.url"
:id="item.fileName + '_' + index"
alt=""
style="width: 100%;height: 100%"
class="sucaitu-img"
/>
<i
@click="delImg(index)"
v-if="index === selectIndex"
class=" close el-icon-close"
></i>
<div <div
v-if="index === selectIndex" :style="{ height: gridSpacing.h, lineHeight: gridSpacing.h }"
class="control-point control-rotator" class="grid-row"
></div> v-for="it in 100"
:key="it"
>
<div
:style="{ width: gridSpacing.w, height: gridSpacing.h }"
class="grid-col"
v-for="it in 100"
:key="it"
></div>
</div>
</div> </div>
</vue-drag-resize-rotate>
</div>
<div
:class="{ 'no-border-grid': systemSetting.gridShow !== 1 }"
:style="{
width: gridWH.w + 'px',
height: gridWH.h + 'px',
}"
class="grid"
>
<div
:style="{ height: gridSpacing.h, lineHeight: gridSpacing.h }"
class="grid-row"
v-for="it in 100"
:key="it"
>
<div
:style="{ width: gridSpacing.w, height: gridSpacing.h }"
class="grid-col"
v-for="it in 100"
:key="it"
></div>
</div> </div>
</div> </div>
</div> </div>
<!-- <div style="width: 100%;height: 100%;background-color:#77797a "></div> -->
<img
class="template-img"
draggable="false"
:src="img"
alt=""
style="position: absolute;width: 1040px;left: 4%"
:style="{ 'z-index': isView ? '0' : '-1' }"
/>
</div> </div>
</div> </div>
<print-dialog <print-dialog
...@@ -1483,7 +1512,7 @@ img { ...@@ -1483,7 +1512,7 @@ img {
} }
.border-row { .border-row {
border-top: 1px solid #ececec; border-top: 1px solid #ececec;
border-bottom: 1px solid #ececec; // border-bottom: 1px solid #ececec;
display: flex; display: flex;
width: 100%; width: 100%;
height: 100%; height: 100%;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment