初始上传
This commit is contained in:
127
addon/cashier/source/os/components/ns-promotion-popup/index.js
Executable file
127
addon/cashier/source/os/components/ns-promotion-popup/index.js
Executable file
@@ -0,0 +1,127 @@
|
||||
import {getAddonIsExist,getPromotionQrcode} from '@/api/promotion.js';
|
||||
export default {
|
||||
name: 'nsPromotionPopup',
|
||||
props: {
|
||||
pageName: {
|
||||
type: String,
|
||||
default: 'COUPON_DETAIL'
|
||||
},
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
qrParams:{
|
||||
page_name:'',
|
||||
option:'',
|
||||
app_type:'h5'
|
||||
},
|
||||
APPType:'h5',
|
||||
appTypeArray: [{
|
||||
text: 'H5',
|
||||
value: 'h5'
|
||||
}],
|
||||
qrData:{}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.qrParams.page_name = this.pageName
|
||||
this.getAddonIsExistFn()
|
||||
},
|
||||
methods:{
|
||||
getAddonIsExistFn(){
|
||||
getAddonIsExist().then(res=>{
|
||||
if(res.data.weapp){
|
||||
this.appTypeArray.push({text:'微信小程序',value:'weapp'})
|
||||
}
|
||||
if(res.data.aliapp){
|
||||
this.appTypeArray.push({text:'支付宝小程序',value:'aliapp'})
|
||||
}
|
||||
})
|
||||
},
|
||||
getPromotionQrcodeFn(){
|
||||
getPromotionQrcode(this.qrParams).then(res=>{
|
||||
this.qrData = Object.assign(this.qrData,res.data)
|
||||
this.$forceUpdate();
|
||||
})
|
||||
},
|
||||
open(option){
|
||||
this.qrParams.option = JSON.stringify(option)
|
||||
this.$refs.promotionPop.open()
|
||||
this.qrData={}
|
||||
this.appTypeArray.forEach((el)=>{
|
||||
this.qrParams.app_type = el.value
|
||||
this.getPromotionQrcodeFn()
|
||||
})
|
||||
|
||||
},
|
||||
//复制链接
|
||||
copyTextToClipboard(text) {
|
||||
uni.setClipboardData({
|
||||
data: text,
|
||||
success: function () {
|
||||
// 可以添加用户友好的提示，例如使用uni.showToast提示复制成功
|
||||
uni.showToast({
|
||||
title: '复制成功',
|
||||
icon: 'success',
|
||||
duration: 2000
|
||||
});
|
||||
},
|
||||
fail: function () {
|
||||
console.log('复制失败');
|
||||
// 可以添加错误处理或用户友好的提示
|
||||
}
|
||||
});
|
||||
},
|
||||
//下载二维码
|
||||
download(url){
|
||||
var oA = document.createElement("a");
|
||||
oA.innerHTML = '123'
|
||||
oA.download = ''; // 设置下载的文件名，默认是'下载'
|
||||
oA.target = "_blank"
|
||||
oA.href = url; //临时路径再保存到本地
|
||||
document.body.appendChild(oA);
|
||||
oA.click();
|
||||
oA.remove(); // 下载之后把创建的元素删除
|
||||
|
||||
}
|
||||
// download(url){
|
||||
// //下载文档
|
||||
// uni.downloadFile({
|
||||
// url: url,//下载地址接口返回
|
||||
// success: (data) => {
|
||||
// if (data.statusCode === 200) {
|
||||
// //文件保存到本地
|
||||
// uni.saveFile({
|
||||
// tempFilePath: data.tempFilePath, //临时路径
|
||||
// success: function(res) {
|
||||
// uni.showToast({
|
||||
// icon: 'none',
|
||||
// mask: true,
|
||||
// title: '文件已保存：' + res.savedFilePath, //保存路径
|
||||
// duration: 3000,
|
||||
// });
|
||||
// setTimeout(() => {
|
||||
// //打开文档查看
|
||||
// uni.openDocument({
|
||||
// filePath: res.savedFilePath,
|
||||
// success: function(res) {
|
||||
// // console.log('打开文档成功');
|
||||
// }
|
||||
// });
|
||||
// }, 3000)
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// console.log(err);
|
||||
// uni.showToast({
|
||||
// icon: 'none',
|
||||
// mask: true,
|
||||
// title: '失败请重新下载',
|
||||
// });
|
||||
// },
|
||||
// });
|
||||
// }
|
||||
}
|
||||
}
|
||||
76
addon/cashier/source/os/components/ns-promotion-popup/index.scss
Executable file
76
addon/cashier/source/os/components/ns-promotion-popup/index.scss
Executable file
@@ -0,0 +1,76 @@
|
||||
.promotion-pop{
|
||||
width: 7rem;
|
||||
background-color: #fff;
|
||||
border-radius: 0.06rem;
|
||||
.header{
|
||||
padding: 0.15rem 0.2rem;
|
||||
font-size: 0.14rem;
|
||||
border-bottom: 0.01rem solid #e6e6e6;
|
||||
|
||||
}
|
||||
.body{
|
||||
width: 100%;
|
||||
padding: 0.2rem 0.3rem;
|
||||
box-sizing: border-box;
|
||||
.alter{
|
||||
height: 0.48rem;
|
||||
line-height: 0.48rem;
|
||||
font-size: 0.14rem;
|
||||
padding: 0 0.2rem;
|
||||
color: #666;
|
||||
background-color: var(--primary-color-light-9);
|
||||
margin-bottom: 0.2rem;
|
||||
}
|
||||
.content{
|
||||
.qrCode{
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
background-color: #f8f8f8;
|
||||
color: #333;
|
||||
font-size: 0.14rem;
|
||||
image{
|
||||
width:1.6rem;
|
||||
height:1.6rem;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
margin-left: 0.2rem;
|
||||
.form-item{
|
||||
margin-bottom: 0.1rem;
|
||||
}
|
||||
.link {
|
||||
|
||||
.form-inline{
|
||||
margin-top: 0.1rem;
|
||||
}
|
||||
}
|
||||
input{
|
||||
width: 2rem;
|
||||
height: 0.3rem;
|
||||
border: 0.01rem solid #e6e6e6;
|
||||
padding: 0 0.12rem;
|
||||
font-size: 0.14rem;
|
||||
border-radius: 0.02rem;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.btn{
|
||||
background-color: var(--primary-color);
|
||||
color: #fff;
|
||||
margin-left: .1rem;
|
||||
font-size: 0.14rem;
|
||||
height: 0.3rem;
|
||||
line-height: 0.3rem;
|
||||
&::after{
|
||||
border: 0;
|
||||
}
|
||||
}
|
||||
.download{
|
||||
color: var(--primary-color);
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
60
addon/cashier/source/os/components/ns-promotion-popup/ns-promotion-popup.vue
Executable file
60
addon/cashier/source/os/components/ns-promotion-popup/ns-promotion-popup.vue
Executable file
@@ -0,0 +1,60 @@
|
||||
<template>
|
||||
<unipopup ref="promotionPop" type="center">
|
||||
<view class="promotion-pop">
|
||||
<view class="header flex justify-between">
|
||||
<view class="title">推广</view>
|
||||
<view class="pop-header-close" @click="$refs.promotionPop.close()">
|
||||
<text class="iconguanbi1 iconfont"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="body">
|
||||
<view class="alter">活动可分享至多个渠道推广，增加曝光率，提升分享打开率。</view>
|
||||
<view class="flex content">
|
||||
<view class="qrCode flex items-center justify-center">
|
||||
<image v-if="qrData[APPType]&&qrData[APPType].path" :src="$util.img(qrData[APPType].path)"/>
|
||||
<text v-else>小程序配置错误</text>
|
||||
</view>
|
||||
<view class="flex-1 right">
|
||||
<view class="form-box">
|
||||
<view class="form-content">
|
||||
<view class="form-item flex">
|
||||
<view class="form-label">充值方式：</view>
|
||||
<view class="form-inline">
|
||||
<uni-data-checkbox v-model="APPType" :localdata="appTypeArray" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item link" v-if="APPType == 'h5'&&qrData[APPType]&&qrData[APPType].url">
|
||||
<view class="form-label">
|
||||
推广链接：
|
||||
</view>
|
||||
<view class="form-inline flex items-center">
|
||||
<input type="text" disabled v-model="qrData[APPType].url" @keydown.enter="search('enter')" />
|
||||
<button type="default" class="btn" @click="copyTextToClipboard(qrData[APPType].url)">复制</button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="form-item" v-if="qrData[APPType]&&qrData[APPType].path">
|
||||
<text class="download" @click="download($util.img(qrData[APPType].path))">下载二维码</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</unipopup>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import unipopup from '@/components/uni-popup/uni-popup.vue';
|
||||
import index from './index.js';
|
||||
export default {
|
||||
components: {
|
||||
unipopup,
|
||||
},
|
||||
mixins: [index]
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './index.scss';
|
||||
</style>
|
||||
Reference in New Issue
Block a user