95 lines
2.4 KiB
Vue
95 lines
2.4 KiB
Vue
<template>
|
|
<div class="addDetailsModal" ref="addDetailsModal"></div>
|
|
<a-modal
|
|
class="addDetails_modal generalModel"
|
|
v-model:visible="addDetails"
|
|
:footer="null"
|
|
:get-container="() => $refs.addDetailsModal"
|
|
width="78%"
|
|
:maskClosable="false"
|
|
:centered="true"
|
|
:closable="false"
|
|
:destroyOnClose="true"
|
|
wrapClassName="#app"
|
|
:keyboard="false"
|
|
>
|
|
<div class="generalModel_btn">
|
|
<div class="generalModel_closeIcon" @click.stop="cancelDsign()">
|
|
<svg width="46" height="46" viewBox="0 0 46 46" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="23" cy="23" r="23" fill="white" fill-opacity="0.3"/>
|
|
<rect x="32.5063" y="12" width="3" height="29" rx="1.5" transform="rotate(45 32.5063 12)" fill="white"/>
|
|
<rect x="34.6274" y="32.5059" width="3" height="29" rx="1.5" transform="rotate(135 34.6274 32.5059)" fill="white"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="addDetails_center">
|
|
<div class="modal_title_text">
|
|
<div>{{ $t('addDetails.AddDetails') }}</div>
|
|
<div class="modal_title_text_intro"></div>
|
|
</div>
|
|
<generalMiniCanvas :imgUrl="imgUrl" @submitBase64Data="submitBase64Data"></generalMiniCanvas>
|
|
</div>
|
|
<div></div>
|
|
</a-modal>
|
|
</template>
|
|
<script>
|
|
import { defineComponent, ref, reactive, watch, onMounted, nextTick, toRefs } from "vue";
|
|
import generalMiniCanvas from "../modules/generalMiniCanvas.vue";
|
|
export default defineComponent({
|
|
components: {
|
|
generalMiniCanvas,
|
|
},
|
|
emits: ['setSloganData'],
|
|
setup(props,{emit}) {
|
|
let addDetail = reactive({
|
|
imgUrl:''
|
|
});
|
|
let addDetails = ref(false);
|
|
let init = (data,index)=>{
|
|
addDetails.value = true
|
|
addDetail.imgUrl = data.path
|
|
}
|
|
let submitBase64Data = (data)=>{
|
|
emit('setSloganData',data)
|
|
cancelDsign()
|
|
}
|
|
let cancelDsign = ()=>{
|
|
addDetails.value = false
|
|
}
|
|
return {
|
|
...toRefs(addDetail),
|
|
addDetails,
|
|
init,
|
|
submitBase64Data,
|
|
cancelDsign,
|
|
};
|
|
},
|
|
data() {
|
|
return {
|
|
};
|
|
},
|
|
mounted() {},
|
|
methods: {
|
|
|
|
},
|
|
});
|
|
</script>
|
|
<style lang="less" scoped>
|
|
.addDetails_modal {
|
|
.closeIcon {
|
|
z-index: 2;
|
|
}
|
|
.addDetails_center{
|
|
position: relative;
|
|
height: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin: 0 auto;
|
|
}
|
|
.exportCanvasBox_submit{
|
|
// margin-top: 2.4rem;
|
|
// text-align: center;
|
|
}
|
|
}
|
|
</style> |