'!'
This commit is contained in:
127
src/pages/merchant/userInfo/userInfo.scss
Normal file
127
src/pages/merchant/userInfo/userInfo.scss
Normal file
@@ -0,0 +1,127 @@
|
||||
.merchant-root {
|
||||
box-sizing: border-box;
|
||||
background-color: #4eb331;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
|
||||
.store-timer {
|
||||
text-align: center;
|
||||
color: #fcff06;
|
||||
height: 0rpx;
|
||||
line-height: 50rpx;
|
||||
overflow: hidden;
|
||||
transition: all 0.5s;
|
||||
|
||||
.text {
|
||||
margin-left: -60rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.store-active {
|
||||
height: 50rpx;
|
||||
}
|
||||
|
||||
.info-root {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0rpx 20rpx 20rpx 20rpx;
|
||||
|
||||
.user-infor-root {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
image {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
border: 4rpx solid #fff;
|
||||
}
|
||||
|
||||
.isHeight {
|
||||
height: 190rpx;
|
||||
}
|
||||
|
||||
.storeName-style-timer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #fff;
|
||||
width: 380rpx;
|
||||
margin-left: 25rpx;
|
||||
|
||||
.timer-root {
|
||||
margin-top: 5rpx;
|
||||
line-height: 1;
|
||||
padding: 10rpx 10rpx;
|
||||
background-color: rgba(0, 0, 0, 0.15);
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.name,
|
||||
.state,
|
||||
.timer-root {
|
||||
display: inline-block;
|
||||
max-width: 380rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.state,
|
||||
.timer {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.tip{
|
||||
display: flex;
|
||||
line-height: 46rpx;
|
||||
.title{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.do-business-root {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: #3e8f27;
|
||||
border-radius: 80rpx;
|
||||
color: #cccccc;
|
||||
margin-right: 10rpx;
|
||||
transition: all 0.4s;
|
||||
|
||||
.text {
|
||||
padding: 0 15rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.business-active {
|
||||
background-color: #ffad49;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.esc-switchSoter {
|
||||
width: 152rpx;
|
||||
|
||||
button {
|
||||
font-size: 24rpx;
|
||||
color: #4eb331;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.swithcStore-btn {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
229
src/pages/merchant/userInfo/userInfo.ts
Normal file
229
src/pages/merchant/userInfo/userInfo.ts
Normal file
@@ -0,0 +1,229 @@
|
||||
/**
|
||||
* 用户信息类
|
||||
*/
|
||||
import { getStorage, setStorage } from "@/utils/storage";
|
||||
import { onPullDownRefresh, onShow, onLoad } from "@dcloudio/uni-app";
|
||||
import { computed, onBeforeUnmount, ref } from "vue";
|
||||
import { timeFormatD } from "@/utils/tools";
|
||||
import useGlobalFunc from "@/composables/useGlobalFunc";
|
||||
import { listenOrder } from '@/utils/bluetoothPrinter/printerOrder'
|
||||
import { store } from "@/store";
|
||||
|
||||
|
||||
function userInfo() {
|
||||
const { newMessage, logOutFn, isTxd, getMtStoreIMStatus } = useGlobalFunc()
|
||||
|
||||
|
||||
/**
|
||||
* 门店自动营业时间
|
||||
*/
|
||||
const newAutoEnableAt = ref<string>('')
|
||||
const switchOpenTime = computed(() => {
|
||||
if (newAutoEnableAt.value) {
|
||||
let now = +new Date(timeFormatD(+new Date()));
|
||||
let time = +new Date(timeFormatD(newAutoEnableAt.value));
|
||||
let num = time - now;
|
||||
if (num < 0) {
|
||||
return "营业时间错误请联系运营";
|
||||
} else {
|
||||
let day = num / 1000 / 3600 / 24;
|
||||
if (day < 1) return "门店将在今天自动营业";
|
||||
else if (day >= 1 && day < 2) return "门店将在明天自动营业";
|
||||
else if (day >= 2 && day < 3) return "门店将在后天自动营业";
|
||||
else return `将在 ${timeFormatD(newAutoEnableAt.value)} 自动营业`;
|
||||
}
|
||||
} else {
|
||||
return "";
|
||||
}
|
||||
})
|
||||
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
let onPullDownRefreshTimer: any = null
|
||||
onPullDownRefresh(async () => {
|
||||
await getStores()
|
||||
clearTimeout(onPullDownRefreshTimer)
|
||||
onPullDownRefreshTimer = setTimeout(() => {
|
||||
uni.stopPullDownRefresh()
|
||||
}, 1000)
|
||||
})
|
||||
|
||||
/**
|
||||
* 用户头像、门店名字
|
||||
*/
|
||||
interface StoreInfoType {
|
||||
avatar: string;
|
||||
storeName: string;
|
||||
}
|
||||
const storeInfo = ref<StoreInfoType>({
|
||||
avatar: "https://image.jxc4.com/image/70143fcf48aefe74537533f35a0a8153.jpg",
|
||||
storeName: "",
|
||||
});
|
||||
let oldStoreID: any = 0
|
||||
onShow(async () => {
|
||||
getStores()
|
||||
await listenOrder()
|
||||
storeInfo.value.storeName = getStorage("storeName")
|
||||
if (oldStoreID != getStorage('storeID') && oldStoreID != 0) {
|
||||
uni.startPullDownRefresh({})
|
||||
}
|
||||
oldStoreID = getStorage('storeID')
|
||||
});
|
||||
onLoad(async () => {
|
||||
await getStores()
|
||||
await newMessage() // 商家中心有新信息了
|
||||
})
|
||||
|
||||
const businessHours = ref<AnyObject>({})
|
||||
async function getStores() {
|
||||
await store.dispatch('storeInfo/getOneStore',getStorage("storeID"))
|
||||
businessHours.value = store.getters['storeInfo/businessHours'] // 营业时间
|
||||
newAutoEnableAt.value = store.getters['storeInfo/newAutoEnableAt'] // 手机门店休息时间
|
||||
|
||||
await getMtStoreIMStatus() // 获取门店的IM单聊开关状态
|
||||
|
||||
await newMessage() // 商家中心有新信息了
|
||||
await listenOrder() // 小程序监听新订单
|
||||
}
|
||||
|
||||
/*************************************************
|
||||
* 去修改营业时间
|
||||
*/
|
||||
function setTime() {
|
||||
uni.navigateTo({ url: `/subPages/merchantChild/setBusinessTime/setBusinessTime` })
|
||||
}
|
||||
|
||||
/**
|
||||
* 退出登录
|
||||
*/
|
||||
let goLoginTime: any = null
|
||||
function goLogin() {
|
||||
uni.vibrateShort({})
|
||||
uni.showActionSheet({
|
||||
title: '退出后不会删除任何数据',
|
||||
itemColor: '#e70808',
|
||||
itemList: ['退出登录'],
|
||||
popover: {
|
||||
width: 5000,
|
||||
},
|
||||
success: function (res) {
|
||||
logOutFn()
|
||||
// uni.navigateTo({ url: '/subPages/login/wxLogin/wxLogin' })
|
||||
uni.reLaunch({ url: '/subPages/login/wxLogin/wxLogin' })
|
||||
},
|
||||
fail: () => {
|
||||
console.log('ZSW-取消退出');
|
||||
},
|
||||
complete: () => {
|
||||
uni.vibrateShort({})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function downApp() {
|
||||
uni.jxAlert({
|
||||
title: '提示',
|
||||
content: '下载链接复制成功，请到浏览器进行下载，或者到手机应用商店搜索【京西菜市】进行下载！',
|
||||
success: () => {
|
||||
uni.setClipboardData({
|
||||
data: 'https://www.jxc4.com/managerApp/downApp.html'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 切换门店
|
||||
*/
|
||||
function switchStore() {
|
||||
uni.navigateTo({ url: "/subPages/switchStore/switchStore" });
|
||||
|
||||
// 图片转pdf https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=88093251_52_hao_pg&wd=uniapp%E5%B0%8F%E7%A8%8B%E5%BA%8F%20%E5%A6%82%E4%BD%95%E5%B0%86%E5%9B%BE%E7%89%87%E7%9A%84%E4%B8%B4%E6%97%B6%E6%96%87%E4%BB%B6%E8%BD%AC%E6%88%90pdf%E6%A0%BC%E5%BC%8F&oq=%25E9%2587%258D%25E6%25B8%25A9%25E6%2580%25BB%25E4%25B9%25A6%25E8%25AE%25B0%25E5%25AF%25B9%25E6%25B5%25B7%25E5%258D%2597%25E5%25AF%2584%25E4%25BA%2588%25E7%259A%2584%25E5%258E%259A%25E6%259C%259B&rsv_pq=cd144c82001083ca&rsv_t=4715G1mkyqJr%2FhraQB%2FDsJO62gnA57BCAmiAx1S%2Be4x%2FRVjoViQTJa15XVpww3QSg2jkH32EJe6s&rqlang=cn&rsv_enter=1&rsv_dl=tb&rsv_sug3=25&rsv_n=2&rsv_sug1=18&rsv_sug7=100&rsv_btype=t&inputT=14749&rsv_sug4=14838
|
||||
// import jsPDF from 'jspdf';
|
||||
// const ctx = uni.createCanvasContext('myCanvas', this);
|
||||
// // 假设你有一个图片的临时路径，例如从uni.chooseImage获取
|
||||
// const imagePath = '/path/to/your/image.jpg';
|
||||
// ctx.drawImage(imagePath, 0, 0, 300, 300); // 绘制图片到Canvas上
|
||||
// ctx.draw(false, () => {
|
||||
// // 获取Canvas内容并转换为PDF
|
||||
// const contentWidth = 300; // Canvas宽度
|
||||
// const contentHeight = 300; // Canvas高度
|
||||
// const pdf = new jsPDF('p', 'pt', [contentWidth, contentHeight]); // A4 size page format
|
||||
// pdf.addImage(imagePath, 'JPEG', 0, 0, contentWidth, contentHeight); // 这里需要确保图片路径正确，或者在绘制后使用ctx.toTempFilePath获取图片路径
|
||||
// pdf.save('converted-image.pdf'); // 保存PDF文件
|
||||
// });
|
||||
// ctx.toTempFilePath({
|
||||
// success: (res) => {
|
||||
// console.log('图片路径：', res.tempFilePath);
|
||||
// },
|
||||
// fail: (err) => {
|
||||
// console.error('导出失败：', err);
|
||||
// }
|
||||
// });
|
||||
// uni.chooseImage({
|
||||
// count: 1, // 默认9，设置图片的最大数量为1张
|
||||
// sizeType: ['original'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
// sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
||||
// success: function(res) {
|
||||
// // 获取到图片的本地文件路径列表
|
||||
// const tempFilePaths = res.tempFilePaths;
|
||||
// // 获取文件管理器
|
||||
// console.log('获取临时文件路径',res)
|
||||
// const fs = uni.getFileSystemManager();
|
||||
// // 读取文件内容并转换为Base64
|
||||
// fs.readFile({
|
||||
// filePath: tempFilePaths[0], // 选择图片返回的本地文件路径列表的第一个路径
|
||||
// encoding: 'base64', // 指定编码格式为base64
|
||||
// success: function(res) {
|
||||
// const base64Data = res.data; // 读取到的Base64数据
|
||||
// console.log(base64Data,'二进制文件base64格式'); // 输出或使用base64Data
|
||||
// },
|
||||
// fail: function(err) {
|
||||
// console.error('读取文件失败', err);
|
||||
// }
|
||||
// });
|
||||
// // fs.readFile({
|
||||
// // filePath: tempFilePaths[0], // 第一个图片的路径
|
||||
// // encoding: 'binary', // 以二进制形式读取
|
||||
// // success: function(res) {
|
||||
// // console.log(res,'图片的二进制数据：', res.data); // 这里的res.data就是图片的二进制数据
|
||||
// // }
|
||||
// // })
|
||||
// }
|
||||
// })
|
||||
}
|
||||
|
||||
/**
|
||||
* 跳转到设置营业状态页面
|
||||
*/
|
||||
function jumpBusinessStatus() {
|
||||
uni.navigateTo({
|
||||
url: '/subPages/merchantChild/setBusinessStatus/setBusinessStatus'
|
||||
})
|
||||
}
|
||||
|
||||
/*************************************************
|
||||
* 做收尾工作
|
||||
*/
|
||||
onBeforeUnmount(() => {
|
||||
clearTimeout(onPullDownRefreshTimer)
|
||||
clearTimeout(goLoginTime)
|
||||
})
|
||||
|
||||
|
||||
return {
|
||||
storeInfo, // 用户信息
|
||||
businessHours, // 营业时间段
|
||||
goLogin, // 退出登录
|
||||
switchStore, // 切换门店
|
||||
switchOpenTime, // 门店休息到那天
|
||||
setTime, // 去修改营业时间
|
||||
jumpBusinessStatus, // 跳转到营业状态页面
|
||||
downApp,
|
||||
store
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export default userInfo
|
||||
97
src/pages/merchant/userInfo/userInfo.vue
Normal file
97
src/pages/merchant/userInfo/userInfo.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<view class="merchant-root">
|
||||
<view class="store-timer" :class="{ 'store-active': switchOpenTime != '' }">
|
||||
<text class="text">{{ switchOpenTime }}</text>
|
||||
</view>
|
||||
<view class="info-root">
|
||||
<view class="user-infor-root">
|
||||
<image
|
||||
@longtap=""
|
||||
:src="storeInfo.avatar"
|
||||
mode="scaleToFill"
|
||||
@tap="previewImage(storeInfo.avatar)"
|
||||
/>
|
||||
<view class="storeName-style-timer">
|
||||
<view class="name">{{ storeInfo.storeName }}</view>
|
||||
|
||||
<view class="state">
|
||||
<view class="tip" @tap="jumpBusinessStatus">
|
||||
<view class="title">营业状态：</view>
|
||||
<view
|
||||
class="do-business-root business-active"
|
||||
>
|
||||
<text class="text">{{store.getters['storeInfo/storeStatus'] === 1?'营业中':store.getters['storeInfo/storeStatus'] === 0?'临时休息':store.getters['storeInfo/storeStatus'] === -1?'休息':store.getters['storeInfo/storeStatus'] === -2?'禁用':'未知'}}</text>
|
||||
<jx-icon icon="shuxie" color="#fff"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 营业时间段 -->
|
||||
<view
|
||||
class="timer-root"
|
||||
v-if="
|
||||
businessHours.timer1 != '00:00' && businessHours.timer2 != '00:00'
|
||||
"
|
||||
@tap="setTime"
|
||||
>
|
||||
<view class="timer">
|
||||
营业时间段{{ businessHours.timer1 }}至{{ businessHours.timer2 }}
|
||||
<jx-icon icon="shuxie" color="#fff" />
|
||||
</view>
|
||||
|
||||
<view
|
||||
class="timer"
|
||||
v-if="
|
||||
businessHours.timer3 != '00:00' &&
|
||||
businessHours.timer4 != '00:00'
|
||||
"
|
||||
>
|
||||
营业时间段{{ businessHours.timer3 }}至{{ businessHours.timer4 }}
|
||||
<jx-icon icon="shuxie" color="#fff" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 退出登录 -->
|
||||
<view class="esc-switchSoter">
|
||||
<button class="esc-btn" @tap="goLogin">退出登录</button>
|
||||
<button class="swithcStore-btn" @tap="switchStore">切换门店</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- app下载通告栏 -->
|
||||
<uni-notice-bar
|
||||
:speed="50"
|
||||
show-icon
|
||||
scrollable
|
||||
background-color="#fcefee"
|
||||
color="#e70808"
|
||||
moreColor="#e70808"
|
||||
showGetMore
|
||||
@click="downApp"
|
||||
text="京西菜市商家版App全新上架，系统更加稳定，功能更加齐全，订单通知更加及时，请往手机自带应用商店搜索【京西菜市】进行安装使用！"
|
||||
/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import userInfo from './userInfo'
|
||||
import useGlobalFunc from '@/composables/useGlobalFunc'
|
||||
const { previewImage } = useGlobalFunc()
|
||||
const {
|
||||
storeInfo, // 用户信息
|
||||
businessHours, // 营业时间段
|
||||
goLogin, // 退出登录
|
||||
switchStore, // 切换门店
|
||||
switchOpenTime, // 门店休息到哪天
|
||||
setTime, // 去修改营业时间
|
||||
jumpBusinessStatus, // 跳转到营业状态页面
|
||||
downApp,
|
||||
store
|
||||
} = userInfo()
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import './userInfo.scss';
|
||||
</style>
|
||||
Reference in New Issue
Block a user