This commit is contained in:
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions

View File

@@ -0,0 +1,49 @@
<template>
<view class="h-wrapper">
<image style="width: 90rpx; height: 90rpx" :src="imgList[flag ? 1 : 0]" mode="scaleToFill" />
<view class="h-info">
<view class="h-title">{{ title }} <view class="state" :style="{ backgroundColor: flag ? '#168FFF' : '#d9d9d9' }"></view></view>
<view class="h-code">{{ subTitle }}</view>
</view>
</view>
</template>
<script setup>
import { reactive } from 'vue'
const props = defineProps({
title: { type: String }, //标题
subTitle: { type: String }, //副标题
flag: { type: Boolean }, //状态,
})
const imgList = reactive(['/pageDevice/static/detailsLislImg/horn-none.svg', '/pageDevice/static/devIconImg/icon-horn.svg'])
</script>
<style lang="scss" scoped>
.h-wrapper {
display: flex;
align-items: center;
padding-left: 40rpx;
height: 170rpx;
.h-info {
flex: 1;
margin-left: 20rpx;
.h-title {
display: flex;
justify-content: space-between;
align-items: center;
.state {
margin-right: 30rpx;
width: 20rpx;
height: 20rpx;
border-radius: 50%;
}
margin-bottom: 16rpx;
font-size: 30rpx;
}
.h-code {
font-size: 26rpx;
color: #999;
}
}
}
</style>

230
pageDevice/qrc/edit.vue Normal file
View File

@@ -0,0 +1,230 @@
<template>
<view class="page-wrapper jeepay-edit-form">
<JeepayCustomNavbar bgDefaultColor="#fff" :title="qrcInfo.createdAt ? '修改二维码' : '绑定二维码'" backCtrl="back" />
<uni-forms ref="qrcForm" :rules="rules" :model="qrcInfo" :label-width="160">
<uni-forms-item required label="立牌编号" name="qrcId" v-if="!qrcInfo.createdAt">
<view class="scan-wrapper">
<uni-easyinput :inputBorder="false" type="number" v-model="qrcInfo.qrcId" placeholder="请输入立牌编号" />
<image src="/pageDevice/static/devIconImg/icon-scan-code.svg" mode="scaleToFill" @tap="scanCode" />
</view>
</uni-forms-item>
<uni-forms-item required label="二维码名称" name="qrcAlias">
<uni-easyinput :inputBorder="false" type="text" v-model="qrcInfo.qrcAlias" placeholder="请输入立牌名称" />
</uni-forms-item>
<uni-forms-item required label="二维码金额">
<JeepayRadioPopupView v-model:value="qrcInfo.fixedFlag" :list="moneyTye">
<template #view="{ record }">
<view class="selected-sex" style="color: #000">
{{ record.label }}
<image src="/pageDevice/static/devIconImg/icon-arrow-sex.svg" mode="scaleToFill" />
</view>
</template>
</JeepayRadioPopupView>
</uni-forms-item>
<uni-forms-item required label="自定义金额" name="fixedPayAmount" v-if="qrcInfo.fixedFlag == 1">
<view class="amount-input"> <uni-easyinput :inputBorder="false" type="digit" v-model="qrcInfo.fixedPayAmount" /></view>
</uni-forms-item>
<view class="code-line"></view>
<uni-forms-item required label="绑定门店" name="storeId">
<template #label>
<view class="f-label">绑定门店</view>
</template>
<JeepayBizsPopupView :hasTitle="false" bizType="store" v-model:value="qrcInfo.storeId" :showName="qrcInfo.storeName" />
</uni-forms-item>
<view class="code-line"></view>
<!-- <uni-forms-item required label="绑定应用" name="appId">
<template #label>
<view class="f-label">绑定应用</view>
</template>
<JeepayBizsPopupView :hasTitle="false" bizType="mchApp" v-model:value="qrcInfo.appId" :showName="qrcInfo.appName" />
</uni-forms-item> -->
</uni-forms>
<view class="code-line"></view>
<JSwitchCard title="状态" tips="状态禁用后,该立牌将不可使用">
<template #right>
<JSwitch :bol="qrcInfo.qrcState == 1" :confirmTips="false" @confirm="(val) => (qrcInfo.qrcState = val ? 1 : 0)" />
</template>
</JSwitchCard>
<!-- <JSwitchCard title="支付宝支付方式" tips="支付宝支付方式">
<template #right>
<JeepayRadioPopupView v-model:value="qrcInfo.alipayWayCode" :list="aliTypeList">
<template #view="{ record }">
<view class="pay-type"> {{ record.label }}<image src="/static/iconImg/icon-arrow-small.svg" mode="scaleToFill" /> </view>
</template>
</JeepayRadioPopupView>
</template>
</JSwitchCard> -->
<JSwitchCard title="页面类型" tips="谨慎选择,确认后不可变更" borderWidth="100vw" v-if="!qrcInfo.createdAt">
<template #right>
<JeepayRadioPopupView v-model:value="qrcInfo.entryPage" :list="pageTypeList">
<template #view="{ record }">
<view class="pay-type">{{ record.label }} <image src="/static/iconImg/icon-arrow-small.svg" mode="scaleToFill" /> </view>
</template>
</JeepayRadioPopupView>
</template>
</JSwitchCard>
<view class="confirm-wrapper">
<Button @tap="submitBindCodeData">{{ qrcInfo.createdAt ? '保存修改' : '确认绑定' }}</Button>
</view>
</view>
<JSinglePopup :list="pageTypeList" ref="refPageType" confirm="selectedPageType" />
</template>
<script setup>
import { reactive, ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { reqLoad, API_URL_SYS_CODE_LIST, $bindEmptyQR, $parseQrCodeUrl } from '@/http/apiManager.js'
import formUtil from '@/commons/utils/formUtil.js'
import infoBox from '@/commons/utils/infoBox.js'
import emit from '@/commons/utils/emit.js'
import go from '@/commons/utils/go.js'
import cal from '@/commons/utils/cal.js'
onLoad((options) => {
if (options.codeId) {
return getDetails(options.codeId)
}
if (options.qrcId) return (qrcInfo.qrcId = options.qrcId)
})
const qrcInfo = reactive({
qrcId: '',
qrcState: 1,
entryPage: 'default',
alipayWayCode: 'ALI_JSAPI',
fixedFlag: 0,
})
// 表单实例
const qrcForm = ref(null)
// 选择页面类型
const refPageType = ref(null)
// 页面类型
const pageTypeList = [
{ label: '未指定', value: 'default' },
{ label: '仅H5网页', value: 'h5' },
{ label: '仅小程序', value: 'lite' },
]
// 支付宝支付方式
const aliTypeList = [
{ label: 'ALI_JSAPI', value: 'ALI_JSAPI' },
{ label: 'ALI_WAP', value: 'ALI_WAP' },
]
// 是否固定金额
const moneyTye = [
{ label: '固定金额', value: 1 },
{ label: '任意金额', value: 0 },
]
const rules = {
qrcAlias: {
rules: [formUtil.rules.requiredInput('')],
},
qrcId: {
rules: [formUtil.rules.requiredInput('')],
},
fixedPayAmount: {
rules: [formUtil.rules.requiredInput('')],
},
storeId: {
rules: [formUtil.rules.requiredSelect('门店')],
},
appId: {
rules: [formUtil.rules.requiredSelect('应用')],
},
}
const scanCode = () => {
uni.scanCode({
success: ({ result }) => {
$parseQrCodeUrl(result).then(({ bizData }) => {
qrcInfo.qrcId = bizData
})
},
fail: (err) => {
infoBox.showErrorToast('扫码失败')
},
})
}
const REG_AMOUNT = /^([0-9]{1}|^[1-9]{1}\d{1,15})(\.\d{1,2})?$/
// 提交绑定立牌数据
const submitBindCodeData = () => {
qrcForm.value.validate().then((res) => {
if (qrcInfo.fixedFlag == 1 && !REG_AMOUNT.test(qrcInfo.fixedPayAmount)) {
return infoBox.showToast('请输入正数 保留两位小数')
}
if (qrcInfo.createdAt) return saveQrcInfo()
$bindEmptyQR(qrcInfo).then((res) => {
infoBox.showSuccessToast('绑定成功')
go.back(1, emit.ENAME_REF_TERMINAL_LIST)
})
})
}
// 保存修改后的数据
const saveQrcInfo = () => {
reqLoad.addOrUpdate(qrcInfo.qrcId, API_URL_SYS_CODE_LIST, qrcInfo).then((res) => {
emit.pageEmit(emit.ENAME_REF_TERMINAL_LIST)
go.back(1, emit.ENAME_REF_QRC_DETAIL)
})
}
const getDetails = (id) => {
reqLoad.getById(API_URL_SYS_CODE_LIST, id).then(({ bizData }) => {
bizData.fixedPayAmount = cal.cert2Dollar(bizData.fixedPayAmount)
Object.assign(qrcInfo, bizData)
})
}
</script>
<style lang="scss">
input {
font-size: 32rpx;
}
.selected-sex {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 32rpx;
color: #b3b3b3;
image {
width: 120rpx;
height: 120rpx;
}
}
.confirm-wrapper {
padding: 50rpx 30rpx;
.confirm-button {
height: 110rpx;
color: #fff;
border-radius: 20rpx;
background: $jeepay-bg-primary;
}
}
.pay-type {
display: flex;
align-items: center;
color: #000;
transform: translateX(40rpx);
image {
width: 108rpx;
height: 42rpx;
}
}
.scan-wrapper {
display: flex;
align-items: center;
input {
flex: 1;
}
image {
width: 80rpx;
height: 120rpx;
}
}
.code-line {
height: 20rpx;
background-color: $v-color-bgrey;
}
.amount-input {
display: flex;
align-items: center;
}
</style>

75
pageDevice/qrc/index.vue Normal file
View File

@@ -0,0 +1,75 @@
<template>
<CommonPageByDevice
ref="commonPageByDeviceRef"
navTitle="码牌立牌管理"
searchTitle="搜索立牌名称、编号"
searchType="qrc"
searchStateField="qrcState"
:bottomBtnTitle="ak.ent.has('ENT_MCH_QR_CODE_ADD') ? '绑定立牌' : null"
@bottomBtnClickFunc="bottomBtnClickFunc"
:reqTableDataFunc="reqTableDataFunc"
></CommonPageByDevice>
<JSinglePopup ref="bindPopup" :list="codeBind" />
</template>
<script setup>
import { reactive, ref } from 'vue';
import { onReachBottom, onUnload, onShow } from '@dcloudio/uni-app';
import emit from '@/commons/utils/emit.js';
import CommonPageByDevice from '../commons/CommonPageByDevice.vue';
import { reqLoad, API_URL_SYS_CODE_LIST, $parseQrCodeUrl } from '@/http/apiManager.js';
import go from '@/commons/utils/go.js';
import DeviceCommonsRender from '@/pages/list/render/DeviceCommonsRender.vue';
import infoBox from '@/commons/utils/infoBox.js';
import ak from '@/commons/utils/ak.js';
const bindPopup = ref(null);
const reqTableDataFunc = (params) => {
return reqLoad.list(API_URL_SYS_CODE_LIST, params);
};
function bottomBtnClickFunc() {
bindPopup.value.open();
}
uni.$on(emit.ENAME_REF_QRC_LIST, (data) => {
commonPageByDeviceRef.value.refTable(true);
});
const commonPageByDeviceRef = ref(null);
// 点击绑定新码 事件
const codeBind = [
{
label: '扫码绑定',
value: 'scanCode',
fun: () => {
uni.scanCode({
success: ({ result }) => {
console.log('result', result);
$parseQrCodeUrl(result).then(({ bizData }) => {
console.log('bizData', bizData);
go.to('PAGES_APP_CODE_BIND', { qrcId: bizData });
});
},
fail: (err) => {
// infoBox.showErrorToast('扫码失败')
}
});
}
},
{
label: '手动绑定',
value: 'handBind',
fun: () => {
go.to('PAGES_APP_CODE_BIND');
}
}
];
onUnload(() => uni.$off(emit.ENAME_REF_QRC_LIST));
onReachBottom(() => {});
onShow(() => {
console.log('进入页面了============');
reqTableDataFunc();
commonPageByDeviceRef.value.refTable(true);
});
</script>
<style lang="scss" scoped></style>

243
pageDevice/qrc/view.vue Normal file
View File

@@ -0,0 +1,243 @@
<template>
<JeepayBackground :bgColorStyle="{ height: '776rpx' }">
<JeepayCustomNavbar textColor="#fff" bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="二维码" backCtrl="back" />
<JeepayTableListItem
viewClass="list-item-by-detail"
logo="/pageDevice/static/detailsLislImg/code-white.svg"
:title="vdata.record.qrcAlias"
:subtitle="vdata.record.qrcId"
:moreBtnList="list"
/>
<view class="create-time">
<view class="time-title">创建时间</view>
<view class="time-info">{{ vdata.record.updatedAt }}</view>
</view>
<JeepayCard editText="编辑信息" @editTap="toEdit">
<JeepayDescviewItem title="二维码名称" :desc="vdata.record.qrcAlias" />
<JeepayDescviewItem title="二维码金额" :desc="vdata.record.fixedFlag == 1 ? '固定金额' : '任意金额'" />
<JeepayDescviewItem title="绑定门店" :desc="vdata.record.storeName" />
<JeepayDescviewItem title="绑定应用" :desc="vdata.record.appName" />
</JeepayCard>
<JDetailsSwitch title="设备状态" subTitle="状态禁用后,该设备将无法使用">
<template #titleRight>
<JeepayStateSwitch v-model:state="vdata.record.qrcState" :showSwitchType="true" :updateStateFunc="confirmState" />
</template>
</JDetailsSwitch>
<JeepayCard>
<view class="qr-code flex-center">
<image class="qr-code-img" :src="vdata.qrcImgUrl" mode="scaleToFill" />
</view>
<template #editContent>
<view class="card-edit flex-center" hover-class="touch-hover" @tap="downLoadImg">
<image style="width: 40rpx; height: 40rpx; margin-right: 10rpx" src="/pageDevice/static/devIconImg/icon-save.svg" mode="scaleToFill" />
保存至相册
</view>
</template>
</JeepayCard>
<JeepayCard viewStyle="margin-top:30rpx" title="受支持的云音响设备" subtitle="以下云音响设备将会播报来自当前码牌的订单">
<block v-for="v in hornList" :key="v.deviceNo">
<hornCard :flag="v.state == 1" :title="v.deviceName" :subTitle="v.deviceNo" />
</block>
</JeepayCard>
</JeepayBackground>
<JSinglePopup ref="more" :list="list" activeColor="#FF5B4C" />
<JeepayPopupConfirm ref="tips" />
<l-painter isCanvasToTempFilePath @success="vdata.qrcImgUrl = $event" hidden css="width: 750rpx;background-color:#fff;">
<l-painter-view css="width:750rpx;">
<l-painter-qrcode :text="vdata.record.qrUrl" css="width:750rpx;height:750rpx;"></l-painter-qrcode>
<l-painter-view css="width:200rpx;height:200rpx;position:absolute;top:50%;left:50%;margin-top:-100rpx;margin-left:-100rpx;background-color:#fff;">
<l-painter-image :src="vdata.logo" css="width:100%;height:100%;"></l-painter-image>
</l-painter-view>
</l-painter-view>
</l-painter>
</template>
<script setup>
import { reactive, ref } from 'vue';
import { onLoad, onUnload } from '@dcloudio/uni-app';
import hornCard from './components/hornCard.vue';
import go from '@/commons/utils/go.js';
import { reqLoad, API_URL_SYS_CODE_LIST, $getHornList, $unBindQrc } from '@/http/apiManager.js';
// import qrCode from '@/commons/utils/qrCode.js';
import { saveHeadImgFile } from '@/commons/utils/saveImg.js';
import infoBox from '@/commons/utils/infoBox.js';
import emit from '@/commons/utils/emit.js';
const vdata = reactive({
record: {},
qrcImgUrl: '',
logo: ''
});
onLoad((options) => {
getDetails(options.codeId);
uni.$on(emit.ENAME_REF_QRC_DETAIL, () => {
getDetails(vdata.record.qrcId);
});
vdata.logo = uni.getStorageSync('siteInfos').siteInfo.sysMinLogoUrl;
console.log(vdata)
});
onUnload(() => uni.$off(emit.ENAME_REF_QRC_DETAIL));
const more = ref(null);
const tips = ref(null);
const params = {};
const hornList = reactive([]);
const list = reactive([
{ label: '保存二维码图片', value: 'save', fun: downLoadImg },
{ label: '解除绑定', value: 'remove', color: '#FF5B4C', fun: unBinding }
]);
function unBinding() {
more.value.close();
tips.value
.open('确认解除绑定吗?', { confirmColor: '#FF5B4C' })
.then((res) => {
if (vdata.record.qrcBelongType == 1) return infoBox.showErrorToast('自建立牌不能解绑');
$unBindQrc(vdata.record.qrcId).then((res) => {
infoBox.showSuccessToast('解绑成功');
go.back(1, emit.ENAME_REF_QRC_LIST);
});
})
.catch((err) => {
more.value.open('remove');
});
}
const getDetails = (id) => {
reqLoad.getById(API_URL_SYS_CODE_LIST, id).then(({ bizData }) => {
vdata.record = bizData;
// vdata.qrcImgUrl = qrCode.drawImg(bizData.qrUrl);
getHornList(id);
});
};
// 查询受支持的云喇叭设备
const getHornList = (id) => {
$getHornList(id).then(({ bizData }) => {
Object.assign(hornList, bizData.records);
console.log('hornList', hornList);
});
};
const confirmState = (bol) => {
console.log('bol', bol);
return reqLoad.addOrUpdate(vdata.record.qrcId, API_URL_SYS_CODE_LIST, { qrcState: bol }).then((res) => {
emit.refPageAndSearchEmit(emit.ENAME_REF_QRC_LIST);
});
};
// 保存二维码
function downLoadImg() {
// #ifdef APP-PLUS
saveHeadImgFile(vdata.qrcImgUrl, 80)
.then((success) => {
infoBox.showSuccessToast('保存成功');
})
.catch((err) => {
infoBox.showErrorToast('保存失败');
});
// #endif
//#ifdef MP-WEIXIN
downloadQR();
//#endif
}
//#ifdef MP-WEIXIN
function downloadQR() {
wx.getSetting({
//获取权限
success(res) {
if (res.authSetting['scope.writePhotosAlbum']) {
download(vdata.qrcImgUrl);
} else {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {
download(vdata.qrcImgUrl);
}
});
}
}
});
}
function download(data) {
const fileManager = wx.getFileSystemManager();
const filePath = wx.env.USER_DATA_PATH + '/res.png';
//这块是定义图片的名称,可自定义其他
fileManager.writeFile({
filePath: filePath,
data: data.slice(22),
encoding: 'base64',
success: (res) => {
wx.saveImageToPhotosAlbum({
filePath: filePath,
success: function (res) {
//保存成功
infoBox.showSuccessToast('保存成功');
},
fail: function (err) {
console.log(err);
//保存失败
infoBox.showErrorToast('保存失败');
}
});
},
fail: (err) => {
infoBox.showErrorToast('保存失败');
}
});
}
//#endif
const toEdit = (val) => {
go.to('PAGES_APP_CODE_BIND', { codeId: vdata.record.qrcId });
};
</script>
<style lang="scss" scoped>
.create-time {
display: flex;
justify-content: space-between;
margin: 0 75rpx;
padding: 50rpx 0;
font-size: 30rpx;
border-top: 1rpx solid rgba(255, 255, 255, 0.2);
.time-title {
color: rgba(255, 255, 255, 0.7);
}
.time-info {
color: #fff;
}
}
.store-info {
padding: 0.1rpx;
margin: 0 35rpx;
background-color: #fff;
border-radius: $J-b-r32;
}
.default-img {
width: 50rpx;
height: 50rpx;
}
.qr-code {
width: 680rpx;
height: 370rpx;
.qr-code-img {
width: 270rpx;
height: 270rpx;
}
}
.c-card-wrapper {
margin-top: 30rpx !important;
}
.card-edit {
height: 110rpx;
border-top: 1rpx solid #ededed;
color: #2980fd;
font-size: 33rpx;
font-weight: 400;
image {
width: 44rpx;
height: 44rpx;
margin-right: 10rpx;
}
}
</style>