czg_team/cashier_wx
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增新版私域引流

Browse Source
This commit is contained in:
gyq
2025-12-15 16:56:37 +08:00
parent 5007c96116
commit 298cd4775b
6 changed files with 787 additions and 572 deletions
Download Patch File Download Diff File Expand all files Collapse all files

145
components/drainage.vue
View File

@@ -1,114 +1,93 @@
<template>
<view>
<!-- 私域引流 -->
<up-popup
:show="show"
mode="center"
round="16rpx"
closeOnClickOverlay
@close="close"
:safeAreaInsetBottom="false"
>
<view class="preview-box">
<view class="u-flex" style="align-items: stretch">
<view
class="u-flex-1 u-p-r-24 u-flex u-flex-col"
style="align-items: start; justify-content: space-between"
>
<view>
<view class="font-14 font-bold color-333">{{
drainageConfig.title
}}</view>
<view class="u-m-t-16 font-12 color-666">{{
drainageConfig.content
}}</view>
</view>
<view>
<!-- 私域引流 -->
<up-popup :show="show" mode="center" round="16rpx" closeOnClickOverlay @close="close" :safeAreaInsetBottom="false">
<view class="preview-box">
<view class="u-flex" style="align-items: stretch">
<view class="u-flex-1 u-p-r-24 u-flex u-flex-col" style="align-items: start; justify-content: space-between">
<view>
<view class="font-14 font-bold color-333">{{ drainageConfig.title }}</view>
<view class="u-m-t-16 font-12 color-666">{{ drainageConfig.content }}</view>
</view>
<view class="color-999 font-12 u-m-t-16">{{
drainageConfig.note
}}</view>
</view>
<view class="color-999 font-12 u-m-t-16">{{ drainageConfig.note }}</view>
</view>
<image
:show-menu-by-longpress="true"
:src="drainageConfig.qrCode"
style="width: 240rpx; height: 240rpx"
mode="aspectFit"
></image>
</view>
<image :show-menu-by-longpress="true" :src="drainageConfig.qrCode" style="width: 240rpx; height: 240rpx" mode="aspectFit"></image>
</view>
<view class="close" @click="close">
<up-icon name="close-circle" size="34" color="#fff"></up-icon>
</view>
</view>
</up-popup>
</view>
<view class="close" @click="close">
<up-icon name="close-circle" size="34" color="#fff"></up-icon>
</view>
</view>
</up-popup>
</view>
</template>
<script setup>
import * as drainageConfigApi from "@/common/api/market/drainageConfig.js";
import { ref, reactive, computed, watch, onMounted } from "vue";
import * as drainageConfigApi from '@/common/api/market/drainageConfig.js';
import { ref, reactive, computed, watch, onMounted } from 'vue';
const showPreview = defineModel({
type: Boolean,
default: false,
type: Boolean,
default: false
});
const show=ref(false);
const emit = defineEmits(["close"]);
const show = ref(false);
const emit = defineEmits(['close']);
function close() {
show.value = false;
emit("close");
show.value = false;
emit('close');
}
const drainageConfig = ref({});
async function getDrainageConfig() {
const shopId = uni.cache.get("shopId");
const drainageConfigRes = await drainageConfigApi.config({
shopId: shopId,
});
drainageConfig.value = drainageConfigRes;
if (drainageConfig.value.isEnable) {
show.value = true;
} else {
close();
}
const shopId = uni.cache.get('shopId');
const drainageConfigRes = await drainageConfigApi.config({
shopId: shopId
});
drainageConfig.value = drainageConfigRes;
if (drainageConfig.value.isEnable) {
show.value = true;
} else {
close();
}
}
// onMounted(() => {
// getDrainageConfig();
// });
watch(
() => showPreview.value,
(newVal) => {
if (newVal) {
getDrainageConfig();
}
}
() => showPreview.value,
(newVal) => {
if (newVal) {
getDrainageConfig();
}
}
);
</script>
<style scoped lang="scss">
.u-flex-col {
flex-direction: column;
flex-direction: column;
}
.preview {
padding: 8rpx 32rpx;
border-radius: 12rpx;
background: $my-main-color;
color: #ffffff;
font-size: 28rpx;
font-weight: 400;
line-height: 40rpx;
padding: 8rpx 32rpx;
border-radius: 12rpx;
background: $my-main-color;
color: #ffffff;
font-size: 28rpx;
font-weight: 400;
line-height: 40rpx;
}
.preview-box {
width: 700rpx;
padding: 32rpx 28rpx;
position: relative;
.close {
position: absolute;
left: 50%;
bottom: -100rpx;
transform: translateX(-50%);
}
width: 700rpx;
padding: 32rpx 28rpx;
position: relative;
.close {
position: absolute;
left: 50%;
bottom: -100rpx;
transform: translateX(-50%);
}
}
</style>
</style>