152 lines
4.4 KiB
Vue
152 lines
4.4 KiB
Vue
<template>
|
||
<view class="shareList">
|
||
<view class="shareCard" v-for="share in shareList" :key="share.id">
|
||
<image src="/static/close.png" mode="aspectFit" class="closeIcon" @click="() => handleRemoveShareRecord(share)"></image>
|
||
<text class="shareName">{{ share.name }}</text>
|
||
<view class="shareCodeContent">
|
||
<l-qrcode :value="composeLink(share.share_code)" :size="94" :marginSize="1" bgColor="#fff" />
|
||
</view>
|
||
<view class="shareLinkWrapper">
|
||
<view class="shareLink">
|
||
{{ composeLink(share.share_code) }}
|
||
<CopyIcon :value="composeLink(share.share_code)" :size="16" />
|
||
</view>
|
||
<view class="shareLink">
|
||
{{ $t('form.shareCode.label') }}：{{ share.share_code }}
|
||
<CopyIcon :value="share.share_code" :size="16" />
|
||
</view>
|
||
</view>
|
||
<view class="btnWrapper">
|
||
<button class="primaryButton downloadMore" @click="() => downloadMoreSize(share.share_code)">{{ $t('partner.promotionLink.downloadMoreSize') }}</button>
|
||
<button v-if="share.img_url" class="secondaryButton downloadMore" @click="() => downloadMaterial(share.img_url)">下载推广设计素材</button>
|
||
</view>
|
||
</view>
|
||
<view class="addShareLink">
|
||
<image @click="() => createShareLink()" src="/static/user/add.png" mode="aspectFit" style="width: 47px; height: 47px"></image>
|
||
<text>{{ $t('partner.promotionLink.addLink') }}</text>
|
||
</view>
|
||
<view class="materialCard" v-for="sysShare in sysShareList" :key="sysShare.id">
|
||
<image :src="sysShare.img_url?.split(',')?.[0]" mode="aspectFit" class="sysShareImg"></image>
|
||
<view class="materialCardBottom">
|
||
<text @click="() => createShareLink(sysShare)">{{ $t('partner.promotionLink.getLink') }}</text>
|
||
<div class="divider"></div>
|
||
<text @click="() => downloadMaterial(sysShare.img_url)">{{ $t('partner.promotionLink.downloadMaterials') }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { getShareRecord, getSysShareList, removeShareRecord } from '@/services/partner/promotionLink.ts';
|
||
export default {
|
||
name: 'PromotionLink',
|
||
props: {
|
||
visible: {
|
||
type: Boolean,
|
||
required: true,
|
||
default: false
|
||
}
|
||
},
|
||
data() {
|
||
return {
|
||
currentShareCode: undefined,
|
||
shareList: [],
|
||
sysShareList: [],
|
||
image: undefined
|
||
};
|
||
},
|
||
methods: {
|
||
composeLink(shareCode) {
|
||
// #ifdef H5
|
||
return `${window.location.origin ?? 'https://user.htfx.co'}/api/promotion/${shareCode}`;
|
||
// #endif
|
||
|
||
// #ifndef H5
|
||
return `https://user.htfx.co/api/promotion/${shareCode}`;
|
||
// #endif
|
||
},
|
||
async getShareRecordData() {
|
||
const res = await getShareRecord();
|
||
if (res && res.code === 0) {
|
||
this.shareList = res.data;
|
||
}
|
||
},
|
||
async getSysShareListData() {
|
||
const res = await getSysShareList();
|
||
if (res && res.code === 0) {
|
||
this.sysShareList = res.data;
|
||
}
|
||
},
|
||
showDetailDialog() {
|
||
this.$refs.alertDialog.open();
|
||
},
|
||
closeDetailDialog() {
|
||
this.$refs.alertDialog.close();
|
||
},
|
||
createShareLink(sysShare) {
|
||
if (sysShare) {
|
||
uni.navigateTo({
|
||
url: `/pages/partner/createShareLink/index?sysId=${sysShare.id}&imgUrls=${sysShare.img_url}`
|
||
});
|
||
} else {
|
||
uni.navigateTo({
|
||
url: '/pages/partner/createShareLink/index'
|
||
});
|
||
}
|
||
},
|
||
handleRemoveShareRecord(share) {
|
||
uni.showModal({
|
||
content: this.$t('shareLink.confirmRemove'),
|
||
confirmColor: '#4DC0E5',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
const resp = await removeShareRecord({ id: share.id });
|
||
if (resp.code == 0) {
|
||
this.$nextTick(() => {
|
||
this.$cusModal.showModal({
|
||
type: 'message',
|
||
status: 'success',
|
||
contentText: this.$t('common.success.action')
|
||
});
|
||
})
|
||
this.getShareRecordData();
|
||
this.getSysShareListData();
|
||
} else {
|
||
this.$nextTick(() => {
|
||
this.$cusModal.showModal({
|
||
type: 'message',
|
||
status: 'warning',
|
||
contentText: resp.msg ?? this.$t('common.error.sysError')
|
||
});
|
||
})
|
||
}
|
||
}
|
||
}
|
||
});
|
||
},
|
||
downloadMoreSize(shareCode) {
|
||
uni.navigateTo({
|
||
url: `/pages/partner/downloadMoreSize/index?shareCode=${shareCode}`
|
||
});
|
||
},
|
||
downloadMaterial(imgUrl) {
|
||
uni.navigateTo({
|
||
url: `/pages/partner/downloadMaterial/index?imgUrl=${imgUrl}`
|
||
});
|
||
}
|
||
},
|
||
watch: {
|
||
visible(newValue, oldValue) {
|
||
if (newValue) {
|
||
this.getShareRecordData();
|
||
this.getSysShareListData();
|
||
}
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import './index.scss';
|
||
</style>
|