55 lines
1.1 KiB
Vue
55 lines
1.1 KiB
Vue
|
<template>
|
||
|
|
<el-dialog
|
||
|
|
v-model="state.visible"
|
||
|
|
draggable
|
||
|
|
title="溯源码"
|
||
|
|
width="40%"
|
||
|
|
:close-on-click-modal="false"
|
||
|
|
:close-on-press-escape="false"
|
||
|
|
@close="onClose"
|
||
|
|
>
|
||
|
|
<div class="code-panel">
|
||
|
|
<div class="code-panel-picture">
|
||
|
|
<el-image style="width: 200px; height: 200px" :src="row.orCodeUrl" fit="cover" lazy />
|
||
|
|
</div>
|
||
|
|
<el-button type="primary" @click="downloadFile(row.orCodeUrl, `${row.productName}-溯源码.png`, 'image')"> 下载溯源码</el-button>
|
||
|
|
</div>
|
||
|
|
</el-dialog>
|
||
|
|
</template>
|
||
|
|
<script setup name="code-dialog">
|
||
|
|
import { reactive } from 'vue';
|
||
|
|
import { downloadFile } from '@/utils';
|
||
|
|
const props = defineProps({
|
||
|
|
row: {
|
||
|
|
type: Object,
|
||
|
|
default: () => {},
|
||
|
|
},
|
||
|
|
});
|
||
|
|
const emit = defineEmits(['on-close']);
|
||
|
|
|
||
|
|
const state = reactive({
|
||
|
|
visible: false,
|
||
|
|
});
|
||
|
|
|
||
|
|
const onClose = () => {
|
||
|
|
state.visible = false;
|
||
|
|
};
|
||
|
|
|
||
|
|
defineExpose({
|
||
|
|
show: () => {
|
||
|
|
state.visible = true;
|
||
|
|
},
|
||
|
|
hide: () => {
|
||
|
|
onClose();
|
||
|
|
},
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.code {
|
||
|
|
&-panel {
|
||
|
|
padding-bottom: 40px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|