chuangte_bike_newxcx/page_shanghu/guanli/admin_worke.vue
2026-03-16 10:03:51 +08:00

978 lines
26 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="page">
<view class="bj"></view>
<view class="toptit" @click="btnqh"><!-- @click="topage(4)" -->
<image @click.stop="topage(4)" style="width: 36rpx;height: 36rpx;margin-right: 10rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uEQLkI1vDF4PTy44DTXH" mode=""></image> {{areaname}} <u-icon style="margin-left: 10rpx;" name="arrow-down" color="#fff" size="28"></u-icon>
</view>
<view class="" style="width: 718rpx;
height: 258rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
box-sizing: border-box;
margin: auto;margin-top: 36rpx;">
<view class="" style="display: flex;justify-content: space-between;width: 100%;padding: 0 32rpx;padding-top: 24rpx;">
<view class="" style="font-weight: 600;font-size: 32rpx;color: #3D3D3D;">
运营状况
</view>
<view class="" style="font-size: 24rpx;color: #4297F3;display: flex;align-items: center;" @click="btnchakan">
查看更多 <u-icon style="margin-left: 6rpx;" name="arrow-right" color="#4297F3" size="28"></u-icon>
</view>
</view>
<view class="leiji">
<view class="li">
<view class="top">
{{yunyingobj.orderCount == null ? 0 : yunyingobj.orderCount}} <text style="font-size: 26rpx;"></text>
</view>
<view class="bot">
今日订单
</view>
</view>
<view class="li">
<view class="top">
{{yunyingobj.orderActualAmount == null ? 0 : yunyingobj.orderActualAmount}} <text style="font-size: 26rpx;"></text>
</view>
<view class="bot">
今日营收
</view>
</view>
<view class="li">
<view class="top">
{{yunyingobj.finishedOrderCount == null ? 0 : yunyingobj.finishedOrderCount}} <text style="font-size: 26rpx;"></text>
</view>
<view class="bot">
已完成订单
</view>
</view>
<view class="li">
<view class="top">
{{yunyingobj.orderStatusMap.PROCESSING == null ? 0 : yunyingobj.orderStatusMap.PROCESSING}} <text style="font-size: 26rpx;"></text>
</view>
<view class="bot">
进行中订单
</view>
</view>
</view>
</view>
<view class="newtop">
<view class="" @click="topage(11)">
<image src="https://api.ccttiot.com/smartmeter/img/static/uReMugbnooJ4SSlLyF13" mode=""></image>
<text>运营配置</text>
</view>
<view class="" @click="toMap">
<image src="https://api.ccttiot.com/smartmeter/img/static/utuqX8JbqxLHn3nymdWo" mode=""></image>
<text>电子围栏</text>
</view>
<view class="" @click="topage(12)">
<image src="https://api.ccttiot.com/smartmeter/img/static/ux863IEYVBkbjwqa9jf2" mode=""></image>
<text>运营区域</text>
</view>
<view class="" @click="btnts">
<image src="https://api.ccttiot.com/smartmeter/img/static/urvqyh17Uuoql0lXDdq0" mode=""></image>
<text>用户投诉</text>
</view>
<view class="" @click="btnreturnbike">
<image src="https://api.ccttiot.com/smartmeter/img/static/uJ4x8uTOMd7pmTeBiX8p" mode=""></image>
<text>订单审核</text>
</view>
</view>
<view class="gonggao" @click="btntopgg">
<image style="width: 28rpx;height: 28rpx;" src="https://api.ccttiot.com/smartmeter/img/static/urVdfzier4Q54s6u8Upl" mode=""></image>
<view class="container">
<view class="scroll-text">
<view class="scroll-item">
{{announcements.title == null ? '暂无最新公告!!!' : announcements.title}}
</view>
</view>
</view>
<u-icon name="arrow-right" color="#373737" style="position: absolute;right: 10rpx;" size="32"></u-icon>
</view>
<!-- 常用工具 -->
<view class="newtit">
常用工具
</view>
<view class="" style="display: flex;justify-content: space-between;padding: 0 22rpx;margin-top: 12rpx;">
<image @click="btnjs" style="width: 164rpx;height: 200rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uehKZhQD3xZFCecZSJf2" mode=""></image> <!-- //门店管理 -->
<image @click="topage(10)" style="width: 164rpx;height: 200rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uRkGGK4bIWnMsosA5Zu1" mode=""></image> <!-- 收费模版 -->
<image @click="topage(9)" style="width: 164rpx;height: 200rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uBsnPWXwpmwhuaDB6BMF" mode=""></image> <!-- 车辆型号 -->
<image @click="topage(2)" style="width: 164rpx;height: 200rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uPXA0S6p7NZ3FEoklU95" mode=""></image> <!-- 车辆管理 -->
</view>
<!-- 其他工具 -->
<view class="newtit" style="margin-top: 32rpx;">
其他工具
</view>
<view class="" style="width: 718rpx;height: 680rpx;background: #FFFFFF;border-radius: 14rpx 14rpx 14rpx 14rpx;margin: auto;margin-top: 12rpx;">
<view class="" style="display: flex;justify-content: space-between;padding:0 42rpx;padding-top: 40rpx;">
<image @click="btnjm" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uffolC81XnKNgE9Uc7uB" mode=""></image> <!-- 加盟伙伴 -->
<image @click="btnywry" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u1ZIXf7JVPNtZVtArR4E" mode=""></image> <!-- 运维人员 -->
<image @click="btnkefu" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uxy4PyvtlQ1qA3VgOVIm" mode=""></image> <!-- 客服设置 -->
<image @click="btnhy" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/umIo5c86JDdswIhamRAD" mode=""></image> <!-- 会员中心 -->
</view>
<view class="" style="display: flex;justify-content: space-between;padding:0 42rpx;margin-top: 40rpx;">
<image @click="btnyunwei" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uc8BWB6V2AG1u6Rv7RJr" mode=""></image>
<!-- 换电工单 -->
<!-- 换电记录 -->
<!-- 批量调度 -->
<image @click="btndiaodujl" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u8pqPmRzOO7xfH0zFKJE" mode=""></image>
<!-- 调度记录 -->
<image @click="topage(7)" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uvLQbL993lGQMU5T1WGc" mode=""></image> <!-- 故障审核 -->
<image @click="btnggsz" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u5ASdG202aRlfiKJqxbG" mode=""></image> <!-- 公告协议 -->
</view>
<view class="" style="display: flex;padding:0 42rpx;margin-top: 40rpx;gap: 74rpx;">
<image @click="btnsp" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u9Ia1oZv3dvWOuIvxNZd" mode=""></image> <!-- 视频教程 -->
<image @click="btnewm" style="width: 84rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uAlHiuCxL9vVQsc1m0pz" mode=""></image> <!-- 二维码 -->
<image @click="btnInvoice" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/u7FWEOjQE6vSYjLYryQt" mode=""></image> <!-- 电子发票 -->
<image @click="btntuiguang" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uB6MeUkD1cSFiBujgYt6" mode=""></image> <!-- 推广 -->
</view>
<view class="" style="display: flex;padding:0 42rpx;margin-top: 40rpx;gap: 56rpx;">
<image @click="btnkjpw" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/ukU5dVsJRl0LjuGvV0m8" mode=""></image> <!-- 卡劵配额 -->
<image @click="btnyy" style="width: 112rpx;height: 122rpx;" src="https://api.ccttiot.com/smartmeter/img/static/uJ7TUS8111sj8b2M6jcv" mode=""></image> <!-- 语音同步 -->
</view>
</view>
<!-- 公告弹窗 -->
<view class="noticetc" style="width: 100%;" v-if="gonggaoflag">
<view class="name">
公告
</view>
<view class="biaoti">
{{announcements.title}}
</view>
<!-- <view class="cont" v-html="gonggaoxq.noticeContent"></view> -->
<u-parse :html="announcements.content" style="width: 100%;height: 60vh;padding: 10rpx;box-sizing: border-box;margin-top: 20rpx;"></u-parse>
<view class="btn" @click="btnggtc">
我知道了
</view>
</view>
<view class="mask" v-if="gonggaoflag"></view>
<u-select v-model="show" :list="list" title='选择运营区' @confirm="confirm" v-if="list.length <= 5"></u-select>
<!-- 自定义选择器 -->
<view class="custom-select" v-if="show && list.length > 5">
<view class="mask" @click="show = false"></view>
<view class="select-content">
<view class="select-header">
<text>选择运营区</text>
<text class="close" @click="show = false">×</text>
</view>
<view class="search-box">
<input type="text" v-model="searchKey" placeholder="搜索运营区" @input="handleSearch" />
</view>
<scroll-view scroll-y class="select-list">
<view class="select-item" v-for="item in displayList" :key="item.value" @click="selectItem(item)"
:class="{ 'highlight': searchKey && item.label.includes(searchKey) }">
{{ item.label }}
<view style="font-size: 24rpx;color: #999;margin-left: auto;"> {{ item.deptName }}</view>
</view>
</scroll-view>
</view>
</view>
<view class="fuwuewm" v-if="fuwuewm">
<image src="https://api.ccttiot.com/qrcode_for_gh_25c71c637dbc_344%20(2)-1753329225290.jpg" show-menu-by-longpress @longpress="handleLongPress" mode=""></image>
<text class="" style="width: 100%;text-align: center;margin-top: 20rpx;display: block;color: #fff;">
长按关注公众号,租车信息不错过!
</text>
<view class="" @click="fuwuewm = false">
关闭
</view>
</view>
<view class="mask" style="background-color: rgba(0, 0, 0, 0.5);" v-if="fuwuewm"></view>
<TabBar :indexs='0' style=""></TabBar>
</view>
</template>
<script>
import TabBar from '@/page_shanghu/components/tab-bar/tab-bar.vue'
var xBlufi = require("@/components/blufi/xBlufi.js")
export default {
components: { TabBar },
data() {
return {
bgc: {
backgroundColor: "#FFFFFF",
},
sn: '',
areaId: '',
areaInfo: {},
list: [],
show: false,
info: {},
userinfo: {},
deptId: null,
menuList: [],
searchKey: '',
displayList: [], // 用于显示的列表
gonggaoxq:{},
gonggaoflag:false,
announcements: {},
yyqid:'',
userId:'',
fuwuewm:false,
weinum:0,
areaname:'',
yunyingobj:{},
kstime:'',
jstime:'',
}
},
onLoad(option) {
this.yyqid = option.id
wx.openBluetoothAdapter({
success: function (res) {
console.log('蓝牙适配器初始化成功')
xBlufi.initXBlufi(1)
},
fail: function (err) {
console.error('蓝牙适配器初始化失败,可能是因为没有权限', err)
}
})
},
onShow() {
this.$store.dispatch('jiance');
this.getCurrentDate(0)
this.getgonggao()
this.getareaList()
this.deptId = uni.getStorageSync('deptId')
if (uni.getStorageSync('adminAreaid')) {
this.areaId = uni.getStorageSync('adminAreaid')
console.log(this.areaId);
// this.getArea()
this.getinfo()
this.getweicl()
}
if (uni.getStorageSync('adminname')) {
this.areaname = uni.getStorageSync('adminname')
}
},
computed: {
// 添加过滤后的列表计算属性
filteredList() {
if (!this.searchKey) return this.list
return this.list.filter(item =>
item.label.toLowerCase().includes(this.searchKey.toLowerCase())
)
}
},
methods: {
// 点击配置语音
btnyy(){
uni.navigateTo({
url:'/page_shanghu/gongzuotai/yuyin/index?areaId=' + this.areaId
})
},
// 点击查看运营状况
btnchakan(){
uni.navigateTo({
url:'/page_shanghu/guanli/yunying'
})
},
// 请求全部运营统计数据
gettongji() {
let StatKeys = 'order_actual_amount,order_count,order_end_status_count,order_status_count,bonus_actual_amount,order_ridding_fee,order_deduction_fee,order_dispatch_fee,order_manage_fee,order_refund_amount'
this.$u.get(`/dashboard/revenueStat?keys=${StatKeys}&dateRange=${this.kstime + ',' + this.jstime}&userId=${this.userinfo.userId}&areaId=${this.areaId}`).then(res => {
if (res.code == 200) {
this.yunyingobj = res.data
}
})
},
// 一开始就获取当前年月日
getCurrentDate(num) {
const currentDate = new Date()
const year = currentDate.getFullYear()
const month = currentDate.getMonth() + 1
const day = currentDate.getDate()
const formatDate = (year, month, day) => {
const formattedMonth = month < 10 ? `0${month}` : month
const formattedDay = day < 10 ? `0${day}` : day
return `${year}-${formattedMonth}-${formattedDay}`
}
const getFirstDayOfMonth = (year, month) => {
return new Date(year, month - 1, 1)
}
const getLastDayOfMonth = (year, month) => {
return new Date(year, month, 0)
}
switch (num) {
case 0:
this.kstime = formatDate(year, month, day)
this.jstime = formatDate(year, month, day)
break
}
},
// 点击切换运营区
btnqh(){
this.show = true
},
// 点击菜单图标
handleMenuClick(){
// 可以在这里添加菜单功能,比如显示更多选项
uni.showToast({
title: '功能开发中',
icon: 'none',
duration: 2000
})
},
getareaList() {
this.$u.get('/bst/area/list?pageNunm=1&pageSize=9999').then((res) => {
if (res.code == 200) {
this.list = res.rows.map(item => ({
value: item.id,
label: item.name,
deptName: item.userName
}))
this.displayList = this.list; // 重置显示列表
}
})
},
// 点击跳转到调度记录
btndiaodujl(){
uni.navigateTo({
url:'/page_shanghu/gongzuotai/diaodujl?areaId=' + this.areaId
})
},
// 点击跳转到换电工单
btnyunwei(){
uni.navigateTo({
url:'/page_shanghu/yunwei/index?areaId=' + this.areaId
})
},
// 点击生成二维码
btnewm(){
uni.navigateTo({
url:'/page_shanghu/guanli/Qrcode?areaId=' + this.areaId + '&type=1'
})
},
// 查询商户未处理订单
getweicl(){
this.$u.get(`/dashboard/complaint/statusMap?areaId=${this.areaId}`).then(res => {
if (res.code== 200) {
const key = "1";
this.weinum = res.data[key]
}
})
},
// 点击绑定服务号
btnfuwuewm(){
let that = this
wx.login({
success(res) {
if (res.code) {
that.$u.put(`/app/user/bindUnionId?jsCode=${res.code}`).then((res) => {
if (res.code == 200) {
that.fuwuewm = true
}else{
uni.showModal({
title: '提示',
content: res.msg,
showCancel:false,
})
}
})
}
},
})
},
// 点击跳转到投诉列表
btnts(){
uni.navigateTo({
url:'/page_fenbao/tousu/shlist?areaId='+this.areaId
})
},
// 点击跳转到会员列表
btnhy(){
uni.navigateTo({
url:'/page_fenbao/huiyuan/huiyuanlist?areaId='+this.areaId
})
},
// 点击进入视频教程
btnsp(){
uni.navigateTo({
url:'/page_user/shiping/index'
})
},
// 点击跳转到运维人员
btnywry(){
uni.navigateTo({
url:'/page_fenbao/yunwei/index?areaId=' + this.areaId
})
},
// 点击跳转到电子围栏
toMap(){
uni.navigateTo({
url:'/page_shanghu/guanli/msp_set?areaId='+this.areaId
})
},
// 点击跳转客服
btnkefu(){
uni.navigateTo({
url:'/page_user/shanghugl/ggsz?id=' + this.areaId
})
},
// 点击跳转公告协议
btnggsz(){
uni.navigateTo({
url:'/page_shanghu/gonggaolist?areaId=' + this.areaId
})
},
// 点击跳转到电子发票列表
btnInvoice(){
uni.navigateTo({
url:'/page_shanghu/guanli/invoice_list?userId=' + this.userinfo.userId
})
},
// 点击跳转到推广列表
btntuiguang(){
uni.navigateTo({
url:'/page_shanghu/guanli/tuiguang_list?areaId=' + this.areaId
})
},
// // 点击跳转免责协议
// btnmz(){
// uni.navigateTo({
// url:'/page_user/shanghugl/mianze'
// })
// },
// // 点击跳转公告管理
// btngggl(){
// uni.navigateTo({
// url:'/page_user/shanghugl/index'
// })
// },
// 点击跳转到收款账户
btnskzh(){
if(this.userinfo.isReal == true){
uni.navigateTo({
url:'/page_user/shoukuan/index'
})
}else{
uni.showModal({
title: '提示',
content: '您还未通过实名认证,是否前往?',
showCancel: true,
success: function (res) {
if (res.confirm) {
uni.navigateTo({
url:'/page_user/shiming'
})
} else if (res.cancel) {
console.log('取消'); // 用户点击取消
}
}
})
}
},
// 点击跳转到还车审核
btnreturnbike(){
uni.navigateTo({
url:'/page_user/returnbike?areaId=' + this.areaId
})
},
// 点击头部滚动通知
btntopgg(){
uni.navigateTo({
url:'/page_user/guzhang/gonggaolist'
})
// if(this.announcements.content){
// this.gonggaoflag = true
// }
},
// 点击公告我知道了
btnggtc(){
this.gonggaoflag = false
uni.setStorageSync('noticeIds', this.announcements.id)
},
// 获取最新公告
getgonggao(){
this.$u.get(`/app/article/first?code=MCH_NOTICE&appId=${this.$store.state.appid}`).then(res =>{
if(res.code == 200){
this.announcements = res.data
if(res.data.id != uni.getStorageSync('noticeIds')){
this.gonggaoflag = true
}
}
})
},
// 点击提示功能完善中
btnjs(){
uni.showToast({
title: '功能完善中',
icon: 'none',
duration: 2000
})
},
// 点击跳转到加盟伙伴
btnjm(){
uni.navigateTo({
url:'/page_fenbao/jiameng/index?areaId=' + this.areaId
})
},
handleSearch(e) {
const value = e.detail.value
if (!value) {
// 搜索框为空时显示全部数据
this.displayList = this.list
} else {
// 有搜索内容时过滤数据
this.displayList = this.list.filter(item => {
const label = String(item.label || '').toLowerCase();
const deptName = String(item.deptName || '').toLowerCase();
const searchValue = String(value || '').toLowerCase();
return label.includes(searchValue) || deptName.includes(searchValue);
});
}
},
selectItem(item) {
this.confirm([item])
this.show = false
this.searchKey = '' // 选择后清空搜索框
this.displayList = this.list // 重置显示列表
this.gettongji()
},
getinfo() {
this.$u.get("/getInfo").then((res) => {
if (res.code == 200) {
this.userinfo = res.user
this.gettongji()
}
})
},
shows() {
if (this.list.length < 2) {
} else {
this.show = true
}
},
confirm(e) {
console.log(e);
uni.setStorageSync('adminAreaid', e[0].value)
uni.setStorageSync('adminname', e[0].label)
this.areaname = e[0].label
this.areaId = e[0].value
this.getArea()
},
getArea() {
let id = this.areaId
this.$u.get(`/bst/area/${id}`).then((res) => {
if (res.code == 200) {
this.areaInfo = res.data
} else {
uni.showToast({
title: res.msg,
icon: 'none',
duration: 2000
})
}
})
},
topage(num) {
if (num == 0) {
uni.navigateTo({
url: '/page_shanghu/gongzuotai/worke_Operation'
})
} else if (num == 1) {
uni.navigateTo({
url: '/pages_admin/worke/worke_income'
})
} else if (num == 2) { //设备管理
uni.reLaunch({
url:'/page_shanghu/qbcheliang'
})
// uni.navigateTo({
// url: '/page_shanghu/gongzuotai/woke_deviceMgmt'
// })
} else if (num == 3) {
uni.navigateTo({
url: '/pages_admin/worke/worke_user'
})
} else if (num == 4) { //用户页面
uni.switchTab({
url: '/pages/my'
})
} else if (num == 5) {
uni.navigateTo({
url: '/pages_admin/worke/bind_sn'
})
} else if (num == 6) {
uni.navigateTo({
url: '/page_shanghu/gongzuotai/AccountDetails'
})
} else if (num == 7) { //故障审核
uni.navigateTo({
url: '/page_shanghu/gongzuotai/shgl?areaId=' + this.areaId
})
} else if (num == 8) {
uni.navigateTo({
url: '/pages_adminSet/financialStatement'
})
} else if (num == 9) {
uni.navigateTo({
url: '/page_shanghu/gongzuotai/CarModel?userId=' + this.userinfo.userId
})
} else if (num == 10) {
uni.navigateTo({
url: '/page_shanghu/gongzuotai/ChargingTemplate'
})
} else if (num == 11) {
uni.navigateTo({
url: '/page_shanghu/gongzuotai/sysSet'
})
} else if (num == 12) { //区域设置
uni.navigateTo({
url: '/page_shanghu/gongzuotai/ParkIngList'
})
}
},
// 点击跳转到卡券配额
btnkjpw(){
uni.navigateTo({
url:'/page_shanghu/guanli/kajuan_peie_list?areaId=' + this.areaId
})
}
}
}
</script>
<style lang="scss">
.newtit{
font-weight: 600;
font-size: 36rpx;
color: #3D3D3D;
margin-top: 28rpx;
padding-left: 22rpx;
}
.newtop{
width: 718rpx;
height: 214rpx;
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
margin: auto;
margin-top: 28rpx;
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 38rpx;
view{
width: 120rpx;
text-align: center;
image{
width: 94rpx;
height: 92rpx;
}
text{
display: block;
font-size: 26rpx;
color: #3D3D3D;
margin-top: 14rpx;
}
}
}
.leiji{
width: 718rpx;
height: 178rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
display: flex;
justify-content: space-between;
padding: 38rpx 44rpx;
box-sizing: border-box;
margin: auto;
.li{
text-align: center;
.top{
font-weight: 600;
font-size: 40rpx;
color: #3D3D3D;
margin-top: 12rpx;
}
.bot{
margin-top: 12rpx;
font-weight: 400;
font-size: 28rpx;
color: #AFAFAF;
}
}
}
.fuwuewm{
position: fixed;
top: 30%;
left: 50%;
transform: translateX(-50%);
z-index: 10;
image{
width: 600rpx;
height: 600rpx;
}
view{
width: 200rpx;
height: 70rpx;
background-color: #4297F3;
color: #fff;
font-size: 32rpx;
text-align: center;
line-height: 70rpx;
margin: auto;
margin-top: 50rpx;
border-radius: 10rpx;
}
}
.fuwuhao{
width: 100%;
text-align: center;
text-underline-offset: 4px;
margin-top: 30rpx;
color: #4297F3;
padding-left: 50rpx;
box-sizing: border-box;
height: 60rpx;
line-height: 60rpx;
font-size: 32rpx;
text-decoration: underline;
text-decoration-color: #4297F3;
text-decoration-thickness: 1px;
}
.mask{
width: 100%;
height: 100vh;
position: fixed;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.3);
z-index: 9;
}
.gonggao{
width: 718rpx;
height: 66rpx;
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
position: relative;
display: flex;
align-items: center;
margin-bottom: 10rpx;
margin: auto;
margin-top: 30rpx;
padding: 0 32rpx;
}
.container {
width: 560rpx;
height: 60rpx; /* 根据需要调整高度 */
display: flex;
align-items: center;
margin: auto;
overflow: hidden;
position: relative;
color: #373737;
box-sizing: border-box;
}
.scroll-text {
width: 100%;
overflow: hidden;
box-sizing: border-box;
display: inline-block;
white-space: nowrap;
animation: scroll 8s linear infinite;
}
.scroll-item {
display: inline-block;
padding: 0 10px;
font-size: 16px;
}
@keyframes scroll {
0% {
transform: translateX(100%);
}
100% {
transform: translateX(-100%);
}
}
.noticetc{
width: 680rpx;
height: 80vh;
background-color: #fff;
border-radius: 20rpx;
padding: 0 20rpx;
box-sizing: border-box;
position: fixed;
// top: 340rpx;
left: 50%;
bottom: 0;
transform: translateX(-50%);
z-index: 10;
.btn{
width: 600rpx;
height: 100rpx;
line-height: 100rpx;
text-align: center;
border-radius: 50rpx;
background-color: #4297F3;
color: #fff;
font-size: 32rpx;
font-weight: 600;
margin: auto;
margin-top: 30rpx;
}
.name{
width: 100%;
text-align: center;
font-size: 36rpx;
font-weight: 600;
margin-top: 30rpx;
}
.biaoti{
font-size: 32rpx;
margin-top: 20rpx;
}
.cont{
width: 100%;
height: 620rpx;
overflow: scroll;
background-color: #ececec;
margin-top: 20rpx;
padding: 20rpx;
box-sizing: border-box;
}
}
page {
}
.bj{
}
.custom-select {
.mask {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 999;
}
.select-content {
position: fixed;
left: 0;
right: 0;
bottom: 0;
background: #fff;
border-radius: 20rpx 20rpx 0 0;
z-index: 1000;
height: 50vh; // 最大高度
display: flex;
flex-direction: column;
padding-bottom: 20rpx;
.select-header {
padding: 20rpx 30rpx;
display: flex;
justify-content: space-between;
align-items: center;
border-bottom: 1px solid #eee;
.close {
font-size: 40rpx;
color: #999;
}
}
.search-box {
padding: 15rpx 20rpx;
border-bottom: 1px solid #eee;
input {
width: 100%;
height: 60rpx;
background: #f5f5f5;
border-radius: 30rpx;
padding: 0 30rpx;
font-size: 28rpx;
}
}
.select-list {
flex: 1;
max-height: calc(50vh - 140rpx);
min-height: 260rpx; // 为列表添加最小高度
.select-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx 30rpx;
border-bottom: 1px solid #eee;
font-size: 28rpx;
&.highlight {
background-color: #f0f9ff;
color: #2d8cf0;
}
&:active {
background: #f5f5f5;
}
}
}
}
}
.page {
width: 750rpx;
background: linear-gradient( 180deg, #4886F1 0%, #F7F7F7 60%);
overflow: scroll;
height: 91vh;
.toptit {
display: flex;
align-items: center;
margin-top: 114rpx;
margin-left: 22rpx;
font-size: 32rpx;
color: #FFFFFF;
}
.cont_box {
padding: 46rpx 50rpx;
margin: 30rpx auto;
width: 680rpx;
background: #FFFFFF;
box-shadow: 0rpx 4rpx 22rpx 0rpx rgba(0, 0, 0, 0.07);
border-radius: 24rpx 24rpx 24rpx 24rpx;
height: 72vh;
overflow: scroll;
padding-bottom: 200rpx;
.top {
width: 100%;
display: flex;
flex-wrap: nowrap;
align-items: center;
margin-top: 40rpx;
font-weight: 600;
image {
margin-right: 16rpx;
width: 32rpx;
height: 32rpx;
}
font-size: 32rpx;
color: #3D3D3D;
}
.app_box {
display: flex;
flex-wrap: wrap;
margin-top: 20rpx;
.cont:nth-child(4n) {
margin-right: 0;
}
.cont {
margin-right: 60rpx;
margin-top: 20rpx;
width: 96rpx;
display: flex;
flex-wrap: wrap;
justify-content: center;
image {
width: 80rpx;
height: 80rpx;
}
.text {
margin-top: 8rpx;
font-weight: 400;
font-size: 24rpx;
color: #3D3D3D;
}
}
}
}
}
</style>