tangxinyue
/
alipay-emulator
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'Branch_1' of https://git.u8t.cn/tangxinyue/alipay-emulator into Branch_1

This commit is contained in:
tangxinyue 2026-05-13 18:17:24 +08:00
parent 7012a8624c b250034b47
commit 55c624621d
10 changed files with 288 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pages/index/index.nvue
View File

@ -286,7 +286,7 @@ const otherList = [{
{
icon: "/static/image/other/certificate/certificate.png",
name: "证书",
path: "/pages/other/certificate/graduate"
path: "/pages/other/certificate/index"
},
{
icon: "/static/image/other/silkBanner/silkBanner.png",

119
pages/other/certificate/graduate.vue
View File

@ -3,14 +3,12 @@
<!-- 自定义头部导航栏 -->
<ZdyNavbar @right-click="edit" isRightButton rightButtonText="编辑" :title="data.navbar.title"
:bgColor="data.navbar.bgColor" :isBack="true" />
<scroll-view scroll-x="true" class="footer-btn" :show-scrollbar="false">
<view class="footer-box">
<view class="btn" v-for="(item, index) in data.typeList" :key="index" :class="{ active: data.type == index }"
<view class="btn" v-for="(item, index) in data.typeList" :key="index" :class="{ active: data.type == getType(index) }"
@click="setType(index)">
{{ item }}
</view>
</view>
</scroll-view>
<view style="display: flex;align-items: center;background: #fff;border-radius: 6px;margin: 10px;padding: 4px;color: #767676;">
<image src="/static/image/other/notice.png" style="width: 16px;height: 16px;margin-right: 10rpx;margin-left: 10rpx;"></image>
此功能不具备真实性，仅供娱乐
@ -555,6 +553,7 @@
proxy
} = getCurrentInstance();
const data = reactive({
styleType:0,
type: 0,
graduate: {
type: 0,
@ -599,14 +598,14 @@
textCssLeft: 'text-align: left;',
textCssCenter: 'text-align: center;',
typeList: [
'毕业证书样式1',
'毕业证书样式2',
'样式一',//毕业证书
'样式二',//毕业证书
'情侣证',
'分手证',
'奖状样式1',
'奖状样式2',
'女神证',
'男神证',
'样式一',//奖状样式
'样式二',//奖状样式
'样式一',//女神证
'样式二',//男神证
]
})
@ -614,9 +613,39 @@
const showEditPopup = ref(false);
const editForm = ref({});
onLoad((option) => {
uni.showLoading({
title: "生成中"
})
data.styleType=option.styleType||0
if(data.styleType==0){
data.typeList=[
'样式一',//毕业证书
'样式二',//毕业证书
]
setType(0)
}else if(data.styleType==1){
data.typeList=['情侣证',]
data.type=2
setType(0)
}else if(data.styleType==2){
data.typeList=['分手证',]
data.type=3
setType(0)
}else if(data.styleType==3){
data.typeList=[
'样式一',//奖状样式
'样式二',//奖状样式
]
data.type=4
setType(0)
}else{
data.type=6
data.typeList=[
'样式一',//女神证
'样式二',//男神证
]
setType(0)
}
// uni.showLoading({
// title: "生成中"
// })
// 进入毕业证书页面埋点
proxy.$apiUserEvent('all', {
type: 'event',
@ -624,10 +653,10 @@
prefix: '.uni.other.',
value: "证书"
})
let graduateData = uni.getStorageSync("graduateData")
if (graduateData) {
data.graduate = graduateData
}
// let graduateData = uni.getStorageSync("graduateData")
// if (graduateData) {
// data.graduate = graduateData
// }
uni.$on("editFormPhoto", (info) => {
data.code = ""
if(data.type==2||data.type==3){
@ -715,6 +744,17 @@
})
function setType(index) {
if(data.styleType==0){
}else if(data.styleType==1){
index+=2
}else if(data.styleType==2){
index+=3
}else if(data.styleType==3){
index+=4
}else{
index+=6
}
uni.showLoading({
title: "生成中"
})
@ -803,7 +843,20 @@
editForm.value.icon = '/static/image/other/certificate/graduate/icon1.png';
}
}
const getType = (index) => {
switch (Number(data.styleType)) {
case 0:
return index
case 1:
return index + 2
case 2:
return index + 3
case 3:
return index + 4
default:
return index + 6
}
}
function successImage(e) {
data.code = e
uni.hideLoading()
@ -1291,33 +1344,29 @@
box-shadow: 0 2rpx 6rpx rgba(7, 140, 193, 0.3);
}
.footer-btn {
width: 100vw;
overflow-x: auto;
white-space: nowrap;
.footer-box {
display: inline-flex;
padding: 10rpx 0;
position: fixed;
left: 0;
bottom: 16px;
width: 100vw;
display: flex;
justify-content: center;
.btn {
padding: 8rpx 10rpx;
font-size: 18px;
color: #767676;
width: 94px;
height: 50px;
line-height: 50px;
background: #FFFFFF;
border-radius: 8px 8px 8px 8px;
background: #FFFFFF;
border-radius: 12px;
text-align: center;
margin: 0 24rpx;
color: #767676;
font-size: 12px;
// border: 2px solid #FFFFFF;
min-width: 120rpx;
}
.active {
color: #1777FF;
// border: 2px solid #1777FF;
border: 2px solid #1777FF;
}
}
}
</style>

144
pages/other/certificate/index.vue
View File

@ -1,57 +1,129 @@
<template>
<view class="container" >
<!-- 自定义头部导航栏 -->
<!-- <ZdyNavbar :title="data.navbar.title" :bgColor="data.navbar.bgColor" :isAdd="true" :isSearch="$system=='Android'">
</ZdyNavbar> -->
<view class="container">
<ZdyNavbar :title="data.navbar.title" :bgColor="data.navbar.bgColor" :isAdd="true" :isSearch="$system=='Android'">
</ZdyNavbar>
<view class="card-grid">
<view class="card" v-for="(item, index) in cardList" :key="index">
<view class="title">
{{item.title}}
</view>
<image :src="item.img" class="card-img" />
<button class="card-btn" @click="create(index)">立即制作</button>
</view>
</view>
</view>
</template>
<script setup>
// 自定义头部
// import ZdyNavbar from "@/components/navbar/navbar.vue"
import ZdyNavbar from "@/components/nav-bar/nav-bar.vue"
import {
ref,
reactive,
watch,
nextTick,
getCurrentInstance
} from "vue";
import {
onLoad,
onShow,
onReady,
onPullDownRefresh,
onReachBottom
} from "@dcloudio/uni-app";
const {
appContext,
proxy
} = getCurrentInstance();
reactive
} from 'vue'
const data = reactive({
navbar: {
title: "微信",
bgColor: '#EDEDED',
title: '证件选择',
bgColor: ''
}
})
onLoad((option) => {
})
onReady(()=>{
const cardList = ref([
{
title: '身份证',
img: '/static/image/other/certificate/certificate1.png',
},
{
title: '毕业证',
img: '/static/image/other/certificate/certificate2.png',
},
{
title: '情侣证',
img: '/static/image/other/certificate/certificate3.png',
},
{
title: '分手证',
img: '/static/image/other/certificate/certificate4.png',
},
{
title: '奖状',
img: '/static/image/other/certificate/certificate5.png',
},
{
title: '颜值证',
img: '/static/image/other/certificate/certificate6.png',
},
])
function create(index){
if(index){
uni.navigateTo({
url:'/pages/other/certificate/graduate?styleType='+(index-1)
})
onShow(() => {})
onPullDownRefresh(() => {
setTimeout(() => {
uni.stopPullDownRefresh();
}, 1000);
})
onReachBottom(() => {
}else{
uni.navigateTo({
url:'/pages/other/card/card'
})
}
}
</script>
<style lang="scss" scoped>
<style scoped>
.container {
padding: 20rpx;
background-color: #F0F4F9;
min-height: 100vh;
}
.card-grid {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.card {
width: 48%;
background-color: #fff;
border-radius: 20rpx;
padding: 20rpx;
margin-bottom: 20rpx;
align-items: center;
box-shadow: 0 4rpx 10rpx rgba(0, 0, 0, 0.05);
display: flex;
align-items: center;
flex-direction: column;
}
.title{
font-size: 14px;
color: #1A1A1A;
line-height: 14px;
}
.card-img {
width: 130px;
height: 80px;
/* border-radius: 8px 8px 8px 8px; */
margin-top: 21px;
margin-bottom: 18px;
}
.card-btn {
width: 68px;
height: 28px;
background: linear-gradient(327deg, #1777FF 0%, #17CDFF 100%);
border-radius: 8px 8px 8px 8px;
font-size: 12px;
color: #FFFFFF;
display: flex;
align-items: center;
justify-content: center;
}
button{
padding: 0;
margin: 0;
border: none;
}
</style>

139
pages/other/silkBanner/silkBanner.vue
View File

@ -3,16 +3,16 @@
<!-- 自定义头部导航栏 -->
<ZdyNavbar @right-click="edit" isRightButton rightButtonText="编辑" :title="data.navbar.title"
:bgColor="data.navbar.bgColor" :isBack="true" />
<scroll-view scroll-x="true" class="footer-btn" :show-scrollbar="false">
<view class="footer-box">
<view class="btn" v-for="(item, index) in data.typeList" :key="index" :class="{ active: data.type == index }"
@click="setType(index)">
{{ item }}
样式一
</view>
</view>
</scroll-view>
<view style="display: flex;align-items: center;background: #fff;border-radius: 6px;margin: 10px;padding: 4px;color: #767676;">
<image src="/static/image/other/notice.png" style="width: 16px;height: 16px;margin-right: 10rpx;margin-left: 10rpx;"></image>
<view
style="display: flex;align-items: center;background: #fff;border-radius: 6px;margin: 10px;padding: 4px;color: #767676;">
<image src="/static/image/other/notice.png"
style="width: 16px;height: 16px;margin-right: 10rpx;margin-left: 10rpx;"></image>
此功能不具备真实性，仅供娱乐
</view>
<image :src="data.code" mode="widthFix" style="width:calc( 100vw - 24px);margin:0 12px;" @click="previewImage">
@ -27,46 +27,46 @@
:css="`width:351px;height:460px;background-image: url('/static/image/other/silkBanner/banner1.png');position: relative;`">
<!-- 落款日期 -->
<l-painter-view :css="`position: absolute;left:85px;bottom:94px;`">
<l-painter-text :css="data.textCss" :text="data.banner.dateText" />
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.dateText" />
</l-painter-view>
<!-- 敬赠落款 -->
<l-painter-view :css="`position: absolute;left:105px;bottom:94px;`">
<l-painter-text :css="data.textCss" :text="data.banner.donorLine" />
<l-painter-view :css="`position: absolute;left:100px;bottom:94px;`">
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.donorLine" />
</l-painter-view>
<!-- 受赠对象 -->
<l-painter-view :css="`position: absolute;top:86px;right:74px;`">
<l-painter-text :css="data.textCss" :text="data.banner.recipientLine" />
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.recipientLine" />
</l-painter-view>
<!-- 中心大字 -->
<l-painter-view :css="`position: absolute;top:86px;left:171px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:112px;left:124px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:112px;right:116px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:155px;left:107px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:155px;right:101px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:198px;left:141px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:198px;right:126px;`">
<l-painter-text :css="data.textCss1" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss1" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:112px;left:142px;`">
<l-painter-text :css="data.textCss2" :text="data.banner.centerChar" />
<l-painter-text :css="data.textFont+data.textCss2" :text="data.banner.centerChar" />
</l-painter-view>
<l-painter-view :css="`position: absolute;bottom:170px;left:10px;`">
<l-painter-text :css="data.textCss3" :text="data.banner.phraseTop" />
<l-painter-view :css="`position: absolute;bottom:165px;left:10px;`">
<l-painter-text :css="data.textFont+data.textCss3" :text="data.banner.phraseTop" />
</l-painter-view>
<l-painter-view :css="`position: absolute;bottom:118px;left:10px;`">
<l-painter-text :css="data.textCss3" :text="data.banner.phraseBottom" />
<l-painter-text :css="data.textFont+data.textCss3" :text="data.banner.phraseBottom" />
</l-painter-view>
<l-painter-view v-if="$isVip()" :css="`position: absolute;left:117px;bottom:127px;`">
@ -80,22 +80,22 @@
:css="`width:351px;height:460px;background-image: url('/static/image/other/silkBanner/banner2.png');position: relative;`">
<!-- 落款日期 -->
<l-painter-view :css="`position: absolute;left:85px;bottom:94px;`">
<l-painter-text :css="data.textCss" :text="data.banner.dateText" />
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.dateText" />
</l-painter-view>
<!-- 敬赠落款 -->
<l-painter-view :css="`position: absolute;left:105px;bottom:94px;`">
<l-painter-text :css="data.textCss" :text="data.banner.donorLine" />
<l-painter-view :css="`position: absolute;left:100px;bottom:94px;`">
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.donorLine" />
</l-painter-view>
<!-- 受赠对象 -->
<l-painter-view :css="`position: absolute;top:86px;right:74px;`">
<l-painter-text :css="data.textCss" :text="data.banner.recipientLine" />
<l-painter-text :css="data.textFont+data.textCss" :text="data.banner.recipientLine" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:102px;right:131px;`">
<l-painter-text :css="data.textCss4" :text="data.banner.phraseTop" />
<l-painter-text :css="data.textFont+data.textCss4" :text="data.banner.phraseTop" />
</l-painter-view>
<l-painter-view :css="`position: absolute;top:102px;left:142px;`">
<l-painter-text :css="data.textCss4" :text="data.banner.phraseBottom" />
<l-painter-text :css="data.textFont+data.textCss4" :text="data.banner.phraseBottom" />
</l-painter-view>
<l-painter-view v-if="$isVip()" :css="`position: absolute;left:117px;bottom:127px;`">
@ -191,14 +191,16 @@
// 返回对应 type 的数据，如果没有则返回默认 type 1
return banners[type] || banners[1]
}
function mergeBanner(raw,type) {
function mergeBanner(raw, type) {
return Object.assign(defaultBanner(type), raw && typeof raw === 'object' ? raw : {})
}
const data = reactive({
isShow:false,
type: 0,
banner: mergeBanner(null,0),
shuaxing: true,
banner: mergeBanner(null, 0),
shuaxing: false,
navbar: {
title: "锦旗",
bgColor: '#EDEDED',
@ -206,13 +208,13 @@
width: 800,
height: 600,
code: '',
textCss: 'text-align: center;font-weight: bold;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;font-family: "SimSun", "宋体", sans-serif;width:10px;color:#FFDD6D;font-size:10px; mix-blend-mode: overlay;',
textCss: 'text-align: center;font-weight: 400;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;width:10px;color:#FFDD6D;font-size:10px; mix-blend-mode: overlay;',
textCss1: 'font-weight: bold;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;font-family: "SimSun", "宋体", sans-serif;color:#FFDD6D;font-size:20px; mix-blend-mode: overlay;',
textCss2: 'font-weight: bold;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;font-family: "SimSun", "宋体", sans-serif;color:#FFDD6D;font-size:80px; mix-blend-mode: overlay;',
textCss3: 'text-align: center;width:351px;font-weight: bold;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;font-family: "SimSun", "宋体", sans-serif;color:#FFDD6D;font-size:30px; mix-blend-mode: overlay;',
textCss4: 'text-align: center;width:20px;font-weight: bold;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;font-family: "SimSun", "宋体", sans-serif;color:#FFDD6D;font-size:40px; mix-blend-mode: overlay;',
textFont:'font-family:"certificate";',
textCss1: 'font-weight: 400;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;color:#FFDD6D;font-size:20px; mix-blend-mode: overlay;',
textCss2: 'font-weight: 400;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;color:#FFDD6D;font-size:80px; mix-blend-mode: overlay;',
textCss3: 'text-align: center;width:351px;font-weight: 400;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;color:#FFDD6D;font-size:30px; mix-blend-mode: overlay;',
textCss4: 'text-align: center;width:20px;font-weight: 400;word-spacing: 50px;letter-spacing: 20px;word-spacing: 20px;color:#FFDD6D;font-size:40px; mix-blend-mode: overlay;',
textFont: 'font-family:"certificate2";',
typeList: ['样式1', '样式2']
})
@ -226,28 +228,32 @@
// 进入锦旗页面埋点
proxy.$apiUserEvent('all', {
type: 'event',
key: 'certificate',
key: 'silkBanner',
prefix: '.uni.other.',
value: "锦旗"
})
data.banner = mergeBanner(uni.getStorageSync("silkBanner"+data.type),data.type)
data.banner = mergeBanner(uni.getStorageSync("silkBanner" + data.type), data.type)
const config = uni.getStorageSync('config')
console.log("---config---", config);
const font = config.config['client.uniapp.font']
console.log("字体地址信息", font.certificate);
console.log("字体地址信息", font.certificate2);
// Font loading logic
const fontUrl = font.certificate;
const fontName = 'certificate';
const fontUrl = font.certificate2;
const fontName = 'certificate2';
const loadFont = (path) => {
uni.loadFontFace({
family: fontName,
source: `url("${path}")`,
success() {
data.isShow=true
data.shuaxing=true
console.log('字体加载成功');
},
fail(err) {
data.isShow=true
data.shuaxing=true
console.error('字体加载失败', err);
}
});
@ -272,7 +278,7 @@
tempFilePath: res.tempFilePath,
success: (saveRes) => {
const savedPath = saveRes.savedFilePath;
uni.setStorageSync('certificate_font_path', savedPath);
uni.setStorageSync('certificate2_font_path', savedPath);
console.log("字体保存路径", savedPath);
loadFont(savedPath);
},
@ -303,13 +309,12 @@
onReachBottom(() => {
})
function setType(index) {
uni.showLoading({
title: "生成中"
})
data.type = index
data.banner = mergeBanner(uni.getStorageSync("silkBanner"+data.type),data.type)
data.banner = mergeBanner(uni.getStorageSync("silkBanner" + data.type), data.type)
}
function successImage(e) {
@ -323,7 +328,7 @@
}
// 打开编辑弹窗
function edit() {
editForm.value = mergeBanner(JSON.parse(JSON.stringify(data.banner)),data.type)
editForm.value = mergeBanner(JSON.parse(JSON.stringify(data.banner)), data.type)
showEditPopup.value = true;
}
@ -338,11 +343,11 @@
title: "生成中"
})
data.shuaxing = false
data.banner = mergeBanner(editForm.value,data.type)
data.banner = mergeBanner(editForm.value, data.type)
setTimeout(() => {
data.shuaxing = true
}, 100)
uni.setStorageSync("silkBanner"+data.type, data.banner)
uni.setStorageSync("silkBanner" + data.type, data.banner)
// 关闭弹窗
showEditPopup.value = false;
}
@ -618,7 +623,7 @@
.popup-title {
font-size: 32rpx;
font-weight: bold;
font-weight: 400;
color: #333;
}
@ -641,7 +646,7 @@
.section-title {
font-size: 28rpx;
font-weight: bold;
font-weight: 400;
color: #333;
margin-bottom: 20rpx;
display: block;
@ -682,7 +687,7 @@
.form-total-input {
background-color: #f9f9f9;
color: #ff6b35;
font-weight: bold;
font-weight: 400;
}
/* 上传图片样式 */
@ -758,7 +763,7 @@
padding: 18rpx 60rpx;
border-radius: 50rpx;
font-size: 26rpx;
font-weight: bold;
font-weight: 400;
box-shadow: 0 3rpx 10rpx rgba(7, 66, 193, 0.3);
transition: all 0.3s ease;
text-align: center;
@ -769,39 +774,33 @@
transform: translateY(-2rpx);
box-shadow: 0 4rpx 12rpx rgba(7, 72, 193, 0.4);
}
.btn-save-image:active {
transform: translateY(0);
box-shadow: 0 2rpx 6rpx rgba(7, 140, 193, 0.3);
}
.footer-btn {
width: 100vw;
overflow-x: auto;
white-space: nowrap;
.footer-box {
display: inline-flex;
padding: 10rpx 0;
position: fixed;
left: 0;
bottom: 16px;
width: 100vw;
display: flex;
justify-content: center;
.btn {
padding: 8rpx 10rpx;
font-size: 18px;
color: #767676;
width: 94px;
height: 50px;
line-height: 50px;
background: #FFFFFF;
border-radius: 8px 8px 8px 8px;
background: #FFFFFF;
border-radius: 12px;
text-align: center;
margin: 0 24rpx;
color: #767676;
font-size: 12px;
// border: 2px solid #FFFFFF;
min-width: 120rpx;
}
.active {
color: #1777FF;
// border: 2px solid #1777FF;
border: 2px solid #1777FF;
}
}
}
</style>

BIN
static/image/other/certificate/certificate1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
static/image/other/certificate/certificate2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 43 KiB

BIN
static/image/other/certificate/certificate3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
static/image/other/certificate/certificate4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
static/image/other/certificate/certificate5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 42 KiB

BIN
static/image/other/certificate/certificate6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 67 KiB