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

身份证，通话

This commit is contained in:
小李 2026-03-16 17:32:36 +08:00
parent 21c79178fd
commit b5685a0d6f
19 changed files with 2017 additions and 797 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
components/call-log/header/header.vue
View File

@ -11,18 +11,18 @@
<image v-if="type=='ios'" src="/static/image/call/iosSearchRight.png" mode=""></image> <image v-if="type=='ios'" src="/static/image/call/iosSearchRight.png" mode=""></image>
</view> </view>
<view class="selectType" v-if="type=='huawei'"> <view class="selectType" v-if="type=='huawei'">
<view class="btn active"> <view class="btn " :class="{'active':active}" @click.stop="setActive(true)">
全部来电 全部来电
</view> </view>
<view class="btn"> <view class="btn" :class="{'active':!active}" @click.stop="setActive(false)">
未接来电 未接来电
</view> </view>
</view> </view>
<view class="selectTypeVivo" v-if="type=='vivo'"> <view class="selectTypeVivo" v-if="type=='vivo'">
<view class="btn active"> <view class="btn " :class="{'active':active}" @click.stop="setActive(true)">
全部 全部
</view> </view>
<view class="btn"> <view class="btn" :class="{'active':!active}" @click.stop="setActive(false)">
未接 未接
</view> </view>
</view> </view>
@ -53,6 +53,7 @@
}) })
const data = reactive({ const data = reactive({
active:true,
statusBarHeight: 0, statusBarHeight: 0,
showTipLayer: true, showTipLayer: true,
title:'最近通话', title:'最近通话',
@ -67,6 +68,7 @@
}) })
let { let {
active,
searchTitle, searchTitle,
title, title,
list, list,
@ -77,7 +79,7 @@
if(props.type=='xiaomi'){ if(props.type=='xiaomi'){
searchTitle.value="搜索联系人" searchTitle.value="搜索联系人"
title.value="通话" title.value="通话"
console.log('aaaaaaaaaaa') // console.log('aaaaaaaaaaa')
}else if(props.type=='oppo'){ }else if(props.type=='oppo'){
title.value="通话" title.value="通话"
}else if(props.type=='huawei'){ }else if(props.type=='huawei'){
@ -85,6 +87,11 @@
} }
}) })
function setActive(status){
active.value=status
uni.$emit('setActive',status)
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

1537
components/call-log/list/list.vue
View File

File diff suppressed because it is too large Load Diff

21
components/call-log/nav-bar/nav-bar.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<uni-nav-bar :backgroundColor="navBgColor" class="nav-bar" :border="false" :title="title" fixed="true"> <uni-nav-bar :backgroundColor="navBgColor" class="nav-bar" :border="false" :title="title" fixed="true" statusBar="true">
<template v-slot:left> <template v-slot:left>
<slot name="left"> <slot name="left">
<view :class="[type+'LeftTitle']" :style="{opacity:(type!='huawei'&&type!='oppo'?1: navOpacity)}"> <view :class="[type+'LeftTitle']" :style="{opacity:(type!='huawei'&&type!='oppo'?1: navOpacity)}">
@ -11,18 +11,18 @@
<view class="nav-bar-title " :class="['nav-bar-title-'+type]"> <view class="nav-bar-title " :class="['nav-bar-title-'+type]">
<slot> <slot>
<view class="iosBox" v-if="type=='ios'"> <view class="iosBox" v-if="type=='ios'">
<view class="btn active"> <view class="btn " :class="{'active':active}" @click.stop="setActive(true)">
全部来电 全部来电
</view> </view>
<view class="btn"> <view class="btn" :class="{'active':!active}" @click.stop="setActive(false)">
未接来电 未接来电
</view> </view>
</view> </view>
<view class="oppoBox" v-if="type=='oppo'" :style="{opacity: navOpacity?1-navOpacity:1}"> <view class="oppoBox" v-if="type=='oppo'" :style="{opacity: navOpacity?1-navOpacity:1}">
<view class="btn active"> <view class="btn " :class="{'active':active}" @click.stop="setActive(true)">
全部 全部
</view> </view>
<view class="btn"> <view class="btn" :class="{'active':!active}" @click.stop="setActive(false)">
未接 未接
</view> </view>
</view> </view>
@ -80,6 +80,7 @@
}) })
const data = reactive({ const data = reactive({
active:true,
statusBarHeight: 0, statusBarHeight: 0,
LeftTitle:'', LeftTitle:'',
showTipLayer: true, showTipLayer: true,
@ -88,6 +89,7 @@
}) })
let { let {
active,
LeftTitle, LeftTitle,
showTipLayer, showTipLayer,
navOpacity, navOpacity,
@ -96,7 +98,7 @@
// 监听 scrollTop 变化 // 监听 scrollTop 变化
watch(() => props.scrollTop, (newValue, oldValue) => { watch(() => props.scrollTop, (newValue, oldValue) => {
console.log('scrollTop changed:', newValue); // console.log('scrollTop changed:', newValue);
// 根据 scrollTop 的值计算导航栏透明度 // 根据 scrollTop 的值计算导航栏透明度
if (newValue > 0) { if (newValue > 0) {
// 当 scrollTop 大于 0 时，透明度逐渐增加 // 当 scrollTop 大于 0 时，透明度逐渐增加
@ -123,11 +125,15 @@
LeftTitle.value='' LeftTitle.value=''
} }
}) })
function setActive(status){
active.value=status
uni.$emit('setActive',status)
}
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
::v-deep .uni-navbar__header-btns { ::v-deep .uni-navbar__header-btns {
width: 25vw !important; width: 27vw !important;
} }
.iosLeftTitle { .iosLeftTitle {
@ -246,6 +252,7 @@
background: #FFFFFF; background: #FFFFFF;
box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.1);
border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px;
margin: 0 2px;
} }
} }
} }

2
main.js
View File

@ -27,7 +27,7 @@ export function createApp() {
const systemInfo = uni.getStorageSync('systemInfo') || {} const systemInfo = uni.getStorageSync('systemInfo') || {}
app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android' app.config.globalProperties.$system = systemInfo.platform == 'ios' ? 'iOS' : 'Android'
app.config.globalProperties.$systemInfo = systemInfo app.config.globalProperties.$systemInfo = systemInfo
uni.setStorageSync('version', '1.0.3.sp1') uni.setStorageSync('version', '1.0.3.sp2')
app.config.globalProperties.$version = uni.getStorageSync('version') app.config.globalProperties.$version = uni.getStorageSync('version')
app.use(globalMethods); app.use(globalMethods);

8
pages.json
View File

@ -193,6 +193,14 @@
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
{
"path": "qf-image/qf-image",
"style": {
"navigationBarTitleText": "图片裁剪",
"navigationStyle": "custom"
}
},
{ {
"path": "train-tickets/ctrip-train-tickets/ctrip-train-tickets", "path": "train-tickets/ctrip-train-tickets/ctrip-train-tickets",
"style": { "style": {

66
pages/call-log/call.vue
View File

@ -1,10 +1,11 @@
<template> <template>
<view class="container"> <view class="container">
<!-- 自定义头部导航栏 --> <!-- 自定义头部导航栏 -->
<ZdyNavbar :type="data.type" :scrollTop="data.scrollTop"/> <ZdyNavbar :type="data.type" :scrollTop="data.scrollTop" @click="open"/>
<ZdyHeader :type="data.type" /> <ZdyHeader :type="data.type" />
<callList :type="data.type"></callList> <callList :type="data.type" ref="callLogList"></callList>
<tabbar :type="data.type" /> <tabbar :type="data.type" />
<image v-if="data.type!='ios'" :src="`/static/image/call/${data.type}BtnImg.png`" mode="" class="btnImg" :class="['btnImg_'+data.type]"></image>
</view> </view>
</template> </template>
@ -13,7 +14,7 @@
import ZdyHeader from "@/components/call-log/header/header.vue" import ZdyHeader from "@/components/call-log/header/header.vue"
import callList from "@/components/call-log/list/list.vue" import callList from "@/components/call-log/list/list.vue"
import tabbar from "@/components/call-log/tabbar/tabbar.vue" import tabbar from "@/components/call-log/tabbar/tabbar.vue"
import {util} from"@/utils/common.js"
import { ref, reactive, watch, nextTick, getCurrentInstance } from "vue"; import { ref, reactive, watch, nextTick, getCurrentInstance } from "vue";
import { onLoad, onShow, onReady, onPageScroll, onReachBottom } from "@dcloudio/uni-app"; import { onLoad, onShow, onReady, onPageScroll, onReachBottom } from "@dcloudio/uni-app";
@ -22,24 +23,75 @@
type: 'vivo', type: 'vivo',
scrollTop:0 scrollTop:0
}) })
let callLogList = ref();
onLoad((option) => { onLoad((option) => {
data.type=option.type
}) })
onReady(() => { onReady(() => {
}) })
onShow(() => {}) onShow(() => {
try {
if (plus.os.name === 'Android') {
let colorTabbar="#FAFAFA"
if(data.type=='xiaomi'||data.type=='oppo'){
colorTabbar="#FFF"
}
util.setAndroidSystemBarColor(colorTabbar)
setTimeout(() => {
plus.navigator.setStatusBarStyle("dark");
}, 500)
}
} catch (error) {
console.log("修改导航条颜色失败", error);
}
})
onPageScroll((e) => { onPageScroll((e) => {
console.log(e) // console.log(e)
data.scrollTop=e.scrollTop data.scrollTop=e.scrollTop
}) })
onReachBottom(() => { onReachBottom(() => {
}) })
function open(){
console.log(callLogList.value)
callLogList.value.openAddModal()
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" >
page{
background-color: #fff;
}
.btnImg{
position: fixed;
}
.btnImg_vivo{
width: 80px;
height: 96px;
left: 40px;
bottom: 130px;
}
.btnImg_huawei{
width: 54px;
height: 54px;
left: calc(50% - 27px);
bottom: 65px;
}
.btnImg_oppo{
width: 58px;
height: 58px;
right: 20px;
bottom: 100px;
}
.btnImg_xiaomi{
width: 55px;
height: 55px;
right: 34px;
bottom: 100px;
}
</style> </style>

10
pages/common/call-and-message-entry/call-and-message-entry.vue
View File

@ -39,7 +39,7 @@ const source = ref([{
}, },
icon: 'iphone', icon: 'iphone',
messageUrl: "/pages/message/list-index?phone=iphone", messageUrl: "/pages/message/list-index?phone=iphone",
callUrl: "" callUrl: "/pages/call-log/call?type=ios"
}, },
{ {
name: '华为', name: '华为',
@ -50,7 +50,7 @@ const source = ref([{
}, },
icon: 'huawei', icon: 'huawei',
messageUrl: "/pages/message/list-index?phone=huawei", messageUrl: "/pages/message/list-index?phone=huawei",
callUrl: "" callUrl: "/pages/call-log/call?type=huawei"
}, },
{ {
name: '小米', name: '小米',
@ -61,7 +61,7 @@ const source = ref([{
}, },
icon: 'mi', icon: 'mi',
messageUrl: "/pages/message/list-index?phone=mi", messageUrl: "/pages/message/list-index?phone=mi",
callUrl: "" callUrl: "/pages/call-log/call?type=xiaomi"
}, },
{ {
name: 'oppo', name: 'oppo',
@ -72,7 +72,7 @@ const source = ref([{
}, },
icon: 'oppo', icon: 'oppo',
messageUrl: "/pages/message/list-index?phone=oppo", messageUrl: "/pages/message/list-index?phone=oppo",
callUrl: "" callUrl: "/pages/call-log/call?type=oppo"
}, { }, {
name: 'vivo', name: 'vivo',
color: { color: {
@ -82,7 +82,7 @@ const source = ref([{
}, },
icon: 'vivo', icon: 'vivo',
messageUrl: "/pages/message/list-index?phone=vivo", messageUrl: "/pages/message/list-index?phone=vivo",
callUrl: "" callUrl: "/pages/call-log/call?type=vivo"
}, },
]) ])

7
pages/index/index.nvue
View File

@ -256,10 +256,15 @@ const otherList = [{
path: "/pages/other/card/card" path: "/pages/other/card/card"
}, },
{ {
icon: "/static/image/index/qita/card.png", icon: "/static/image/index/qita/message.png",
name: "短信", name: "短信",
path: "/pages/common/call-and-message-entry/call-and-message-entry?type=message" path: "/pages/common/call-and-message-entry/call-and-message-entry?type=message"
}, },
{
icon: "/static/image/index/qita/call.png",
name: "通话",
path: "/pages/common/call-and-message-entry/call-and-message-entry?type=call"
},
] ]
const data = reactive({ const data = reactive({

852
pages/other/card/card.vue
View File

@ -11,34 +11,37 @@
<l-painter isCanvasToTempFilePath @success="successImage" @progress="progress" hidden <l-painter isCanvasToTempFilePath @success="successImage" @progress="progress" hidden
:css="`width:${data.width}px;height:${data.height }px;background-color:#fff;`"> :css="`width:${data.width}px;height:${data.height }px;background-color:#fff;`">
<l-painter-view <l-painter-view
:css="`margin-top:116px;margin-left:75px;position: relative;width:650px;height:360px;background-image: url('/static/image/other/card/cardBGImg.png');background-size:650px 360px;`"> :css="`margin-top:109px;margin-left:75px;position: relative;width:666px;height:406px;background-image: url('/static/image/other/card/cardBGImg.png');background-size:6660px 406px;`">
<!-- 头部年月 --> <!-- 头部年月 -->
<l-painter-view :css="`position: absolute;left:122px;top:28px;`"> <l-painter-view :css="`position: absolute;left:122px;top:50px;`">
<l-painter-text :css="data.textCss+data.textCssLeft" :text="data.form.name" /> <l-painter-text :css="data.textCss+data.textCssLeft" :text="data.form.name" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:122px;top:78px;`"> <l-painter-view :css="`position: absolute;left:122px;top:100px;`">
<l-painter-text :css="data.textCss2+data.textCssLeft" :text="data.form.gender" /> <l-painter-text :css="data.textCss2+data.textCssLeft" :text="data.form.gender" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:254px;top:78px;`"> <l-painter-view :css="`position: absolute;left:260px;top:100px;`">
<l-painter-text :css="data.textCss2+data.textCssLeft" :text="data.form.nation" /> <l-painter-text :css="data.textCss2+data.textCssLeft" :text="data.form.nation" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:122px;top:126px;`"> <l-painter-view :css="`position: absolute;left:122px;top:148px;`">
<l-painter-text v-for="(item,index) in data.form.year.toString()" :css="data.textCss3+data.textCssLeft" :text="item" :key="index" /> <l-painter-text v-for="(item,index) in data.form.year.toString()" :css="data.textCss3+data.textCssLeft"
:text="item" :key="index" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:184px;top:126px;`"> <l-painter-view :css="`position: absolute;left:190px;top:148px;`">
<l-painter-text :css="data.textCss2+data.textCssCenter" :text="data.form.month.toString()" /> <l-painter-text :css="data.textCss2+data.textCssCenter" :text="data.form.month.toString()" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:244px;top:126px;`"> <l-painter-view :css="`position: absolute;left:250px;top:148px;`">
<l-painter-text :css="data.textCss2+data.textCssCenter" :text="data.form.day.toString()" /> <l-painter-text :css="data.textCss2+data.textCssCenter" :text="data.form.day.toString()" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:122px;top:177px;width:274px;`"> <l-painter-view :css="`position: absolute;left:122px;top:196px;width:274px;`">
<l-painter-text v-for="(item,index) in data.form.address" :css="data.textCss3+data.textCssLeft" :text="item" :key="index"/> <l-painter-text v-for="(item,index) in data.form.address" :css="data.textCss3+data.textCssLeft" :text="item"
:key="index" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;left:223px;top:300px;`"> <l-painter-view :css="`position: absolute;left:223px;top:320px;`">
<l-painter-text v-for="(item,index) in data.form.idNumber" :css="data.textCss4+data.textCssLeft" :text="item" :key="index"/> <l-painter-text v-for="(item,index) in data.form.idNumber" :css="data.textCss4+data.textCssLeft" :text="item"
:key="index" />
</l-painter-view> </l-painter-view>
<l-painter-view :css="`position: absolute;right:48px;top:55px;`"> <l-painter-view :css="`position: absolute;right:48px;top:62px;`">
<l-painter-image v-if="data.form.photo" :src="data.form.photo" css="width: 196px; height: 230px;"/> <l-painter-image v-if="data.form.photo" :src="data.form.photo" css="width: 196px; height: 230px;" />
<l-painter-view v-else css="width: 196px; height: 230px;background-color:#fff;"> <l-painter-view v-else css="width: 196px; height: 230px;background-color:#fff;">
</l-painter-view> </l-painter-view>
</l-painter-view> </l-painter-view>
@ -104,280 +107,343 @@
</template> </template>
<script setup> <script setup>
// 自定义头部 // 自定义头部
import ZdyNavbar from "@/components/nav-bar/nav-bar.vue" import ZdyNavbar from "@/components/nav-bar/nav-bar.vue"
import { import {
ref, ref,
reactive, reactive,
watch, watch,
nextTick, nextTick,
getCurrentInstance getCurrentInstance
} from "vue"; } from "vue";
import { import {
onLoad, onLoad,
onShow, onShow,
onReady, onReady,
onPullDownRefresh, onPullDownRefresh,
onReachBottom onReachBottom
} from "@dcloudio/uni-app"; } from "@dcloudio/uni-app";
const { const {
appContext, appContext,
proxy proxy
} = getCurrentInstance(); } = getCurrentInstance();
const data = reactive({ const data = reactive({
navbar: { navbar: {
title: "身份证", title: "身份证",
bgColor: '#EDEDED', bgColor: '#EDEDED',
}, },
width: 800, width: 800,
height: 600, height: 600,
code: '', code: '',
form: { form: {
name: '李某', name: '李某',
gender: '男', gender: '男',
nation: '汉', nation: '汉',
year: 2025, year: 2025,
month: 2, month: 2,
day: 1, day: 1,
address: '翻斗大街翻斗花园二号楼1001室', address: '翻斗大街翻斗花园二号楼1001室',
idNumber: '500000000000000000', idNumber: '500000000000000000',
photo: '', photo: '',
}, },
textCss: 'font-family: "SimHei", "Microsoft YaHei", sans-serif;width:100px;color:#3D3D3D;font-size:24px; mix-blend-mode: overlay;', textCss: 'font-family: "SimHei", "Microsoft YaHei", sans-serif;width:100px;color:#3D3D3D;font-size:24px; mix-blend-mode: overlay;',
textCss2: 'font-family: "SimHei", "Microsoft YaHei", sans-serif;width:100px;text-align: left;color:#3D3D3D;font-size:22px;mix-blend-mode: overlay;', textCss2: 'font-family: "SimHei", "Microsoft YaHei", sans-serif;width:100px;text-align: left;color:#3D3D3D;font-size:22px;mix-blend-mode: overlay;',
textCss3: 'word-spacing: 10px;letter-spacing: 10px;margin-right:2px;font-family: "SimHei", "Microsoft YaHei", sans-serif;text-align: left;color:#3D3D3D;font-size:22px;mix-blend-mode: overlay;', textCss3: 'word-spacing: 10px;letter-spacing: 10px;margin-right:2px;font-family: "SimHei", "Microsoft YaHei", sans-serif;text-align: left;color:#3D3D3D;font-size:22px;mix-blend-mode: overlay;',
textCss4: 'word-spacing: 10px;margin-right:3px;letter-spacing: 10px;font-family: "card", "Microsoft YaHei", sans-serif;text-align: left;color:#1a1a1a;font-size:28px;mix-blend-mode: overlay;display:flex;', textCss4: 'word-spacing: 10px;margin-right:3px;letter-spacing: 10px;font-family: "card", "Microsoft YaHei", sans-serif;text-align: left;color:#1a1a1a;font-size:28px;mix-blend-mode: overlay;display:flex;',
textCssLeft:'text-align: left;', textCssLeft: 'text-align: left;',
textCssCenter:'text-align: center;' textCssCenter: 'text-align: center;'
}) })
// 弹窗相关 // 弹窗相关
const showEditPopup = ref(false); const showEditPopup = ref(false);
const editForm = ref({}); const editForm = ref({});
// //
function successImage(e){ function successImage(e) {
data.code=e console.log(e)
} data.code = e
function progress(e){
if(e<0.03){
uni.showLoading({
title:"生成中"
})
} }
if(e==1){
uni.hideLoading()
}
console.log(e)
}
// 打开编辑弹窗
function edit() {
console.log(data.form)
// 复制当前表单数据到编辑表单
editForm.value = JSON.parse(JSON.stringify(data.form));
// 显示弹窗
showEditPopup.value = true;
}
// 关闭编辑弹窗 function progress(e) {
function closeEditPopup() { console.log(e)
showEditPopup.value = false; if (e < 0.03) {
} uni.showLoading({
title: "生成中"
// 保存编辑表单 })
function saveEditForm() {
// 将编辑后的数据复制回原始表单
data.form = JSON.parse(JSON.stringify(editForm.value));
// 关闭弹窗
showEditPopup.value = false;
}
// 选择图片
function chooseImage() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
editForm.value.photo = res.tempFilePaths[0];
},
fail: (err) => {
console.log('选择图片失败', err);
} }
}); if (e == 1) {
} setTimeout(() => {
uni.hideLoading()
}, 1000)
// 预览图片 }
function previewImage() { }
if (data.code) { // 打开编辑弹窗
uni.previewImage({ function edit() {
urls: [data.code], console.log(data.form)
current: 0 // 复制当前表单数据到编辑表单
editForm.value = JSON.parse(JSON.stringify(data.form));
// 显示弹窗
showEditPopup.value = true;
}
// 关闭编辑弹窗
function closeEditPopup() {
showEditPopup.value = false;
}
// 保存编辑表单
function saveEditForm() {
// 将编辑后的数据复制回原始表单
data.form = JSON.parse(JSON.stringify(editForm.value));
uni.setStorageSync("cardForm",data.form)
// 关闭弹窗
showEditPopup.value = false;
}
// 选择图片
function chooseImage() {
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
crop:{
width:'196px',
height:"230px"
},
success: (res) => {
uni.showLoading({
title:"抠图中"
})
convertLocalImageToFile(res.tempFilePaths[0]).then(file => {
proxy.$imageUpload(file.split(',', 2)[1]).then(resimage=>{
console.log(resimage);
console.log(resimage.data);
editForm.value.photo = decodeURI(resimage.data);
uni.hideLoading()
}).catch(err=>{
uni.hideLoading()
console.log(err.data.message)
uni.showToast({
icon:"none",
title:err.data.message
})
})
}).catch(err=>{
uni.hideLoading()
})
},
fail: (err) => {
console.log('选择图片失败', err);
}
}); });
} }
}
// 保存图片
function saveImage() { /**
if (data.code) { * 将本地图片路径通过 Canvas 转换为 File 对象
console.log(data.code) * @param {string} localPath - 本地图片路径（如从 uni.chooseImage 获取的 tempFilePath）
uni.showLoading({ * @param {Object} options - 可选参数
title: '保存中...' * @param {string} options.format - 输出格式 'image/png' 或 'image/jpeg'，默认 'image/png'
* @param {number} options.quality - 图片质量（仅 jpeg 有效），0~1，默认 0.92
* @param {number} options.maxWidth - 最大宽度（等比缩放），不填则使用原图尺寸
* @param {number} options.maxHeight - 最大高度（等比缩放），不填则使用原图尺寸
* @returns {Promise<File>} 返回一个 Promise，resolve 为 File 对象
*/
function convertLocalImageToFile(localPath) {
return new Promise((resolve, reject) => {
// 1. 读取本地图片为 Base64（避免 Image 对象直接加载本地路径的兼容问题）
plus.io.resolveLocalFileSystemURL(localPath, (entry) => {
entry.file((file) => {
const reader = new plus.io.FileReader();
reader.onload = (e) => {
const base64Data = e.target.result; // 格式如 data:image/jpeg;base64,/9j/...
resolve(e.target.result)
};
reader.onerror = (err) => reject(err);
reader.readAsDataURL(file); // 读取为 DataURL
}, reject);
}, reject);
}); });
try { }
// 检查是否为base64格式 // 预览图片
if (data.code.startsWith('data:image')) { function previewImage() {
// 处理base64格式图片 if (data.code) {
console.log('开始处理base64图片'); uni.previewImage({
uni.base64ToTempFile({ urls: [data.code],
base64: data.code.split(',')[1], // 去除base64前缀 current: 0
success: (res) => { });
console.log('base64转换成功', res); }
if (res.tempFilePath) { }
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath, // 保存图片
success: () => { function saveImage() {
console.log('保存图片成功'); if (data.code) {
uni.hideLoading(); console.log(data.code)
uni.showToast({ uni.showLoading({
title: '保存成功', title: '保存中...'
icon: 'success' });
}); try {
}, // 检查是否为base64格式
fail: (err) => { if (data.code.startsWith('data:image')) {
console.log('保存图片失败', err); // 处理base64格式图片
uni.hideLoading(); console.log('开始处理base64图片');
uni.showToast({ uni.base64ToTempFile({
title: '保存失败', base64: data.code.split(',')[1], // 去除base64前缀
icon: 'none' success: (res) => {
}); console.log('base64转换成功', res);
} if (res.tempFilePath) {
}); uni.saveImageToPhotosAlbum({
} else { filePath: res.tempFilePath,
console.log('base64转换失败，无临时文件路径'); success: () => {
console.log('保存图片成功');
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
console.log('保存图片失败', err);
uni.hideLoading();
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
});
} else {
console.log('base64转换失败，无临时文件路径');
uni.hideLoading();
uni.showToast({
title: '转换失败',
icon: 'none'
});
}
},
fail: (err) => {
console.log('base64转换失败', err);
uni.hideLoading(); uni.hideLoading();
uni.showToast({ uni.showToast({
title: '转换失败', title: '转换失败',
icon: 'none' icon: 'none'
}); });
} }
}, });
fail: (err) => { } else if (data.code.startsWith('_') || data.code.includes('temp') || data.code.includes('cache') || data
console.log('base64转换失败', err); .code.includes('_doc') || data.code.includes('_tmp')) {
uni.hideLoading(); // 处理本地临时文件
uni.showToast({ console.log('开始处理本地临时文件');
title: '转换失败', uni.saveImageToPhotosAlbum({
icon: 'none' filePath: data.code,
}); success: () => {
} console.log('保存本地文件成功');
}); uni.hideLoading();
} else if (data.code.startsWith('_') || data.code.includes('temp') || data.code.includes('cache') || data uni.showToast({
.code.includes('_doc') || data.code.includes('_tmp')) { title: '保存成功',
// 处理本地临时文件 icon: 'success'
console.log('开始处理本地临时文件');
uni.saveImageToPhotosAlbum({
filePath: data.code,
success: () => {
console.log('保存本地文件成功');
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
console.log('保存本地文件失败', err);
uni.hideLoading();
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
});
} else {
// 处理网络图片
console.log('开始处理网络图片');
uni.downloadFile({
url: data.code,
success: (res) => {
console.log('下载图片成功', res);
if (res.statusCode === 200 && res.tempFilePath) {
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
console.log('保存图片成功');
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
console.log('保存图片失败', err);
uni.hideLoading();
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
}); });
} else { },
console.log('下载图片失败，状态码:', res.statusCode); fail: (err) => {
console.log('保存本地文件失败', err);
uni.hideLoading();
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
});
} else {
// 处理网络图片
console.log('开始处理网络图片');
uni.downloadFile({
url: data.code,
success: (res) => {
console.log('下载图片成功', res);
if (res.statusCode === 200 && res.tempFilePath) {
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: () => {
console.log('保存图片成功');
uni.hideLoading();
uni.showToast({
title: '保存成功',
icon: 'success'
});
},
fail: (err) => {
console.log('保存图片失败', err);
uni.hideLoading();
uni.showToast({
title: '保存失败',
icon: 'none'
});
}
});
} else {
console.log('下载图片失败，状态码:', res.statusCode);
uni.hideLoading();
uni.showToast({
title: '下载失败',
icon: 'none'
});
}
},
fail: (err) => {
console.log('下载图片失败', err);
uni.hideLoading(); uni.hideLoading();
uni.showToast({ uni.showToast({
title: '下载失败', title: '下载失败',
icon: 'none' icon: 'none'
}); });
} }
}, });
fail: (err) => { }
console.log('下载图片失败', err); } catch (error) {
uni.hideLoading(); console.log('保存图片异常', error);
uni.showToast({ uni.hideLoading();
title: '下载失败', uni.showToast({
icon: 'none' title: '保存失败',
}); icon: 'none'
}
}); });
} }
} catch (error) { } else {
console.log('保存图片异常', error);
uni.hideLoading();
uni.showToast({ uni.showToast({
title: '保存失败', title: '暂无图片可保存',
icon: 'none' icon: 'none'
}); });
} }
} else {
uni.showToast({
title: '暂无图片可保存',
icon: 'none'
});
} }
}
onLoad((option) => { onLoad((option) => {
// 进入身份证页面埋点 // 进入身份证页面埋点
proxy.$apiUserEvent('all', { proxy.$apiUserEvent('all', {
type: 'event', type: 'event',
key: 'idcard', key: 'idcard',
prefix: '.uni.other.', prefix: '.uni.other.',
value: "身份证" value: "身份证"
})
let formdata=uni.getStorageSync("cardForm")
if(formdata){
data.form=formdata
}
}) })
}) onReady(() => {
onReady(() => {
}) })
onShow(() => { }) onShow(() => {})
onPullDownRefresh(() => { onPullDownRefresh(() => {
setTimeout(() => { setTimeout(() => {
uni.stopPullDownRefresh(); uni.stopPullDownRefresh();
}, 1000); }, 1000);
}) })
onReachBottom(() => { onReachBottom(() => {
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -386,113 +452,113 @@ onReachBottom(() => {
src: url("/static/font/card.ttf"); src: url("/static/font/card.ttf");
} }
* { * {
box-sizing: content-box; box-sizing: content-box;
} }
.aadadad { .aadadad {
text-align: center; text-align: center;
} }
.heiti { .heiti {
font-family: "SimHei", "Microsoft YaHei", sans-serif; font-family: "SimHei", "Microsoft YaHei", sans-serif;
} }
/* 弹窗样式 */ /* 弹窗样式 */
.popup-overlay { .popup-overlay {
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
z-index: 9999; z-index: 9999;
} }
.popup-content { .popup-content {
background-color: #fff; background-color: #fff;
border-radius: 10px; border-radius: 10px;
width: 90%; width: 90%;
max-width: 500px; max-width: 500px;
max-height: 80vh; max-height: 80vh;
overflow-y: auto; overflow-y: auto;
} }
.popup-header { .popup-header {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 20rpx; padding: 20rpx;
border-bottom: 1rpx solid #eee; border-bottom: 1rpx solid #eee;
} }
.popup-title { .popup-title {
font-size: 32rpx; font-size: 32rpx;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
} }
.popup-close { .popup-close {
font-size: 48rpx; font-size: 48rpx;
color: #999; color: #999;
cursor: pointer; cursor: pointer;
} }
.popup-body { .popup-body {
padding: 20rpx; padding: 20rpx;
} }
.form-section { .form-section {
margin-bottom: 30rpx; margin-bottom: 30rpx;
padding: 20rpx; padding: 20rpx;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 8rpx; border-radius: 8rpx;
} }
.section-title { .section-title {
font-size: 28rpx; font-size: 28rpx;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
margin-bottom: 20rpx; margin-bottom: 20rpx;
display: block; display: block;
} }
.form-row { .form-row {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.form-label { .form-label {
width: 200rpx; width: 200rpx;
font-size: 26rpx; font-size: 26rpx;
color: #333; color: #333;
} }
.form-input { .form-input {
flex: 1; flex: 1;
padding: 15rpx; padding: 15rpx;
border: 1rpx solid #ddd; border: 1rpx solid #ddd;
border-radius: 4rpx; border-radius: 4rpx;
font-size: 26rpx; font-size: 26rpx;
} }
.form-separator { .form-separator {
margin: 0 10rpx; margin: 0 10rpx;
font-size: 26rpx; font-size: 26rpx;
color: #333; color: #333;
} }
.form-total { .form-total {
margin-top: 10rpx; margin-top: 10rpx;
padding-top: 10rpx; padding-top: 10rpx;
border-top: 1rpx dashed #ddd; border-top: 1rpx dashed #ddd;
} }
.form-total-input { .form-total-input {
background-color: #f9f9f9; background-color: #f9f9f9;
color: #ff6b35; color: #ff6b35;
font-weight: bold; font-weight: bold;
@ -528,61 +594,61 @@ onReachBottom(() => {
object-fit: cover; object-fit: cover;
} }
.popup-footer { .popup-footer {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
padding: 20rpx; padding: 20rpx;
border-top: 1rpx solid #eee; border-top: 1rpx solid #eee;
} }
.btn-cancel, .btn-cancel,
.btn-save { .btn-save {
width: 48%; width: 48%;
padding: 20rpx; padding: 20rpx;
border-radius: 4rpx; border-radius: 4rpx;
font-size: 28rpx; font-size: 28rpx;
} }
.btn-cancel { .btn-cancel {
background-color: #f5f5f5; background-color: #f5f5f5;
color: #333; color: #333;
border: 1rpx solid #ddd; border: 1rpx solid #ddd;
} }
.btn-save { .btn-save {
background-color: #ff6b35; background-color: #187AFF;
color: #fff; color: #fff;
border: none; border: none;
} }
/* 保存图片按钮 */ /* 保存图片按钮 */
.button-container { .button-container {
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 30rpx 0; padding: 30rpx 0;
} }
.btn-save-image { .btn-save-image {
background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%); background: linear-gradient(90deg, #187AFF 0%, #3295FC 100%);
color: #fff; color: #fff;
border: none; border: none;
padding: 18rpx 60rpx; padding: 18rpx 60rpx;
border-radius: 40rpx; border-radius: 40rpx;
font-size: 26rpx; font-size: 26rpx;
font-weight: bold; font-weight: bold;
box-shadow: 0 3rpx 10rpx rgba(7, 66, 193, 0.3); box-shadow: 0 3rpx 10rpx rgba(7, 66, 193, 0.3);
transition: all 0.3s ease; transition: all 0.3s ease;
text-align: center; text-align: center;
min-width: 160rpx; min-width: 160rpx;
} }
.btn-save-image:hover { .btn-save-image:hover {
transform: translateY(-2rpx); transform: translateY(-2rpx);
box-shadow: 0 4rpx 12rpx rgba(7, 72, 193, 0.4); box-shadow: 0 4rpx 12rpx rgba(7, 72, 193, 0.4);
} }
.btn-save-image:active { .btn-save-image:active {
transform: translateY(0); transform: translateY(0);
box-shadow: 0 2rpx 6rpx rgba(7, 140, 193, 0.3); box-shadow: 0 2rpx 6rpx rgba(7, 140, 193, 0.3);
} }
</style> </style>

20
pages/other/qf-image/qf-image.vue Normal file
View File

@ -0,0 +1,20 @@
<template>
<view>
<qf-image-cropper :width="196" :height="230" :radius="0" @crop="handleCrop" :reverseRotatable="true"></qf-image-cropper>
</view>
</template>
<script>
export default {
methods: {
handleCrop(e) {
uni.saveFile({
tempFilePath: e.tempFilePath,
success: function(res) {
res.avatar = res.savedFilePath
}
});
}
}
}
</script>

BIN
static/image/call/huaweiBtnImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
static/image/call/oppoBtnImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
static/image/call/vivoBtnImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.9 KiB

BIN
static/image/call/xiaomiBtnImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
static/image/index/qita/call.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
static/image/index/qita/message.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

176
test.js Normal file
View File

File diff suppressed because one or more lines are too long

89
utils/globalMethods.js
View File

@ -4,6 +4,9 @@ import {
postJson postJson
} from "@/utils/requests.js" } from "@/utils/requests.js"
import pageData from "@/static/json/page.json" import pageData from "@/static/json/page.json"
import {
jsonString
} from "../uni_modules/uv-ui-tools/libs/function/test";
export default { export default {
install(app, options) { install(app, options) {
@ -148,7 +151,7 @@ export default {
temp += "&" + CryptoJS.MD5(key).toString(); temp += "&" + CryptoJS.MD5(key).toString();
config.data.signature = CryptoJS.MD5(temp).toString(); config.data.signature = CryptoJS.MD5(temp).toString();
} }
// console.log("config:", config) console.log("config:", config)
return config return config
}; };
@ -169,11 +172,14 @@ export default {
const sortedKeys = Object.keys(data.data).sort(); const sortedKeys = Object.keys(data.data).sort();
let str = '' let str = ''
for (const key of sortedKeys) { for (const key of sortedKeys) {
str += '&' + key + '=' + encodeURIComponent(data.data[key]); if(!(data.url=='api/image/segment/base64'&&key=='file')){
str += '&' + key + '=' + encodeURIComponent(data.data[key]);
}
} }
str = str.replace('&', '?') str = str.replace('&', '?')
// 拼接URL host=host+str
host = host + str console.log(host)
console.log(data)
const response = await new Promise((resolve, reject) => { const response = await new Promise((resolve, reject) => {
uni.request({ uni.request({
url: host, url: host,
@ -181,15 +187,17 @@ export default {
data: data.data, data: data.data,
header, header,
success: res => { success: res => {
console.log(res)
try { try {
if (isCode) { if (isCode) {
res.data = deCode(res.data.data) res.data = deCode(res.data.data)
console.log(res.data)
} else { } else {
res.data = res.data.data res.data = res.data.data
} }
} catch (err) { } catch (err) {
console.log(err);
} }
resolve(res.data); resolve(res.data);
}, },
@ -201,8 +209,6 @@ export default {
return response; return response;
}; };
app.config.globalProperties.$getUserInfo = async () => { app.config.globalProperties.$getUserInfo = async () => {
try { try {
let user = await app.config.globalProperties.$requestPromise({ let user = await app.config.globalProperties.$requestPromise({
@ -214,22 +220,69 @@ export default {
if (user.code == 0) { if (user.code == 0) {
uni.setStorageSync('AppUser', user.data) uni.setStorageSync('AppUser', user.data)
uni.setStorageSync('userInfo', user.data) uni.setStorageSync('userInfo', user.data)
// uni.showModal({
// title: '提示',
// content: JSON.stringify(user.data),
// success: function (res) {
// if (res.confirm) {
// console.log('用户点击确定');
// } else if (res.cancel) {
// console.log('用户点击取消');
// }
// }
// });
} }
} catch (error) { } catch (error) {
//TODO handle the exception //TODO handle the exception
} }
} }
// 上传图片
app.config.globalProperties.$uploadImage = async (filePath) => {
//头部header
let header = uni.getStorageSync('header')
//请求地址
let host = uni.getStorageSync('host') + 'api/image/segment'
header['content-type'] = "multipart/form-data"
// // 排序
let data={
method:'POST',
data:{},
url:'api/image/segment'
}
data = sign(data)
const sortedKeys = Object.keys(data.data).sort();
let str = ''
for (const key of sortedKeys) {
str += '&' + key + '=' + encodeURIComponent(data.data[key]);
}
str = str.replace('&', '?')
// 拼接URL
host = host + str
console.log(host);
console.log(data);
uni.uploadFile({
url: host, // 完整URL
filePath: filePath,
name: 'file',
method:"POST",
header: header,
formData:{
...data.data
},
success: (res) => {
console.log('1.上传成功:',JSON.stringify(res));
},
fail: (err) => {
console.error('2. 错误详情:', JSON.stringify(err));
},
complete: (res) => {
console.log('3. 上传完成');
}
});
};
app.config.globalProperties.$imageUpload = async (imagePath) => {
return new Promise((resolve, reject) => {
postJson('a', 'api/image/segment/base64', {
file:imagePath
}).then(res=>{
resolve(res)
}).catch(err=>{
reject(err)
})
})
};
} }
}; };

1
utils/requests.js
View File

@ -185,6 +185,7 @@ const request = (method = 'GET', serverUrl, domainUrl, params, dataType = "json"
console.log("传参详情", data) console.log("传参详情", data)
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
uni.request(data).then(res => { uni.request(data).then(res => {
console.log(deCode(res.data.data))
if (res.statusCode == 200) { if (res.statusCode == 200) {
if (res.data.encrypt) { if (res.data.encrypt) {
if (q != 'test') { if (q != 'test') {