OfficeApp/pages/oaHome/oaHome.vue

<template>
	<view class="box">
		<view class="" style="background-color: #2B63E3;height: var(--status-bar-height);" />
		<view class="head">
			<view class="" style="float: right;margin-top: 20rpx;">
				<Myindex url='/pages/oaHome/oaHome' />
			</view>
			<view class="head-content ">
				<view class="identity">
					工作证：{{ myOaInfo.nickname }}
				</view>
				<view class="avatar">
					<u--image :showLoading="true" width="134rpx" height="134rpx"
						:src="myOaInfo.avatar || '../../static/img/public/avatar.png'" shape="circle"></u--image>
				</view>
				<view class="identity">
					身份：{{ myOaInfo.user_role_name}}
				</view>

			</view>
		</view>
		<view class="deposit">
			<view class="deposit-l">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/YJ.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						押金
					</view>
					<view class="deposit-value">
						{{myOaInfo.deposit}}
					</view>
				</view>
			</view>
			<view class="deposit-l">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/GLHS.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						管理户数
					</view>
					<view class="deposit-value">
						{{myOaInfo.user_information_count}}户
					</view>
				</view>
			</view>
			<!-- 工程 -->
			<!-- <view class="">
				<uqrcode ref="uqrcode" canvas-id="qrcode" value="https://uqrcode.cn/doc" :options="{ margin: 10 }">
				</uqrcode>
			</view> -->
			<!-- <view class="deposit-l">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/ZCYHS.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						注册用户数
					</view>
					<view class="deposit-value">
						{{myOaInfo.register_num}}
					</view>
				</view>
			</view> -->
			<!-- <view class="deposit-l">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/RZSHS.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						入驻商户数
					</view>
					<view class="deposit-value">
						{{myOaInfo.merchant_num }}
					</view>
				</view>
			</view> -->
			<!-- <view class="deposit-l">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/JYJE.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						交易金额
					</view>
					<view class="deposit-value">
						￥{{myOaInfo.trade_amount }}
					</view>
				</view>
			</view> -->
			<view class="deposit-l" @click="showCode=true">
				<u--image :showLoading="true" width="81rpx" height="78rpx" :src="'../../static/newWork/index/YQM.png'"
					shape="circle"></u--image>
				<view class="" style="margin-left:20rpx ;">
					<view class="">
						邀请码
					</view>
					<view class="deposit-value">
						{{myOaInfo.invite_code}}
					</view>
				</view>
			</view>
		</view>
		<!--追加功能 -->
		<view class="" v-if='taskList.length==0'>
			<u-empty icon="/static/newWork/index/empty.png" iconSize='200' width='300' height="300" marginTop='50'
				textColor='#BFD7FF' text="等待任务下发"></u-empty>
		</view>
		<view class="task" v-else>
			<view class="tit">
				我的任务
			</view>

			<view class="task-li" v-for="item,index in taskList" :key='index'>
				<view class="task-li-top">
					<view class="" style="display: flex;align-items: center;">
						<u--image :showLoading="true" width="30rpx" height="29rpx"
							:src="'../../static/newWork/index/RW.png'"></u--image>
						<view class="" style="margin-left: 10rpx;font-size: 28rpx;">
							{{item.title}}
						</view>
					</view>
					<view class="detail-btn" @click="navgo(`/pages/oaHome/homeTaskDetail?id=${item.id}`)">
						查看详情
					</view>
				</view>
				<view class="task-content">
					任务描述: {{item.content}}
				</view>
			</view>
		</view>
		<u-overlay :show="showCode" @click="showCode=false" :opacity="0.1">
			<view class="code" id='code'>
				<view class="code-img">
					<view class="" style="margin: 0 auto;width: 440rpx;">
						<uqrcode ref="uqrcode" canvas-id="qrcode"
							:value="`https://shop.lihaink.cn/download/index.html?code=${myOaInfo.invite_code}`"
							:size=440 sizeUnit='rpx'>
						</uqrcode>
					</view>

					<view class="code-text" @click='copyCode'>
						<view class="" style="color: #4D4D4D;font-size: 28rpx;">
							{{myOaInfo.invite_code}}
						</view>
						<view style="display: flex;font-size: 28rpx;align-items: center;">
							<u--image :showLoading="true" width="23.75rpx" height="25.75rpx"
								:src="'../../static/newWork/index/FZ.png'"
								style="transform: translateY(3rpx);"></u--image>
							<view class="" style="margin-left: 10rpx;">
								复制
							</view>
						</view>
					</view>
					<view class="code-foot">
						<view class="code-foot-btn" style="background-color: #F5F5F5;color: #616161;">
							取消
						</view>
						<view class="code-foot-btn" @click="saveCode">
							保存
						</view>
					</view>
				</view>
			</view>
		</u-overlay>



		<!-- 旧版供销 -->
		<view class="oa_home" style="oaColor" v-if="false">

			<view class="home_header" :class="!ApproveList.length > 0 ? 'home_header_no_data' : ''">
				<view style="
		         position: absolute;
		         bottom: 0;
		         left: 0;
		         overflow: hidden;
		         border-radius: 0 0 30rpx 30rpx;
		       ">
					<hx-lottie :options="options" ref="lottie" style="
		           width: 100vw;
		           height: 440rpx;
		           transform: scale(1.2);
		           background-color: #0122c7;
		         " />
				</view>
				<!-- #ifdef APP-PLUS||H5 -->
				<view style="height: var(--status-bar-height)"></view>

				<view style="height: 30rpx"></view>
				<!-- <view v-if="uniMP" style="height: 44px;"></view> -->
				<!-- #endif -->
				<view class="my_info">

					<view class="head_img">
						<view class="img_box">
							<u--image :showLoading="true" width="131.43rpx" height="131.43rpx" class="img_box_img"
								:src="myOaInfo.avatar || '../../static/img/public/avatar.png'"
								shape="circle"></u--image>
						</view>

						<text class="head_text">工作证: {{ myOaInfo.nickname }}</text>
						<text class="head_text" style="flex-shrink: 0">身份: {{ myOaInfo.user_role_name}}</text>
					</view>
				</view>

				<!-- 占位 -->
				<view style="height: 50rpx"></view>

				<view class="" style="background-color: white;position: relative;padding: 20rpx;border-radius: 20rpx;">

					<view class="" style="display: flex;justify-content: space-around;">
						<view class="" style="display: flex;flex-direction: column;align-items: center;">
							<view style="color: #FF7C32;">押金</view>
							<view style="margin-top: 30rpx;font-size: 40rpx;">{{myOaInfo.deposit}} </view>
						</view>
						<view class="" style="display: flex;flex-direction: column;align-items: center;">
							<view style="color: #FF7C32;">管理户数</view>
							<view style="margin-top: 30rpx;font-size: 40rpx;">{{myOaInfo.user_information_count}} <text
									style="font-size: 30rpx;margin-left: 5rpx;">户</text> </view>
						</view>
					</view>

				</view>
			</view>
			<u-empty text="等待任务下发">
			</u-empty>

			<!-- 	<view class="fast_track">
					<block v-for="(item, index) in oaHomeData" :key="item.id">
						<view class="track_item" @click="navTwo(item.paths, index)">
							<image :src="item.icon" mode="aspectFit" style="width: 77rpx;height: 77rpx;">
							</image>
							<view class="title">{{ item.name }}</view>
						</view>
					</block>
				</view>
		-->



		</view>


	</view>
</template>

<script>
	import Myindex from '@/components/return/index.vue';
	// import {
	// 	getList
	// } from "@/api/logistics.js";
	import {
		Toast
	} from "@/libs/uniApi.js";
	import {
		oaHomeData
	} from "@/static/server/server.js";
	// import {
	// 	noticeList
	// } from "@/api/notice.js";
	// import {
	// 	getAreaManagerApi
	// } from "@/api/bussness.js"
	import {
		taskListApi
	} from "@/api/task.js"
	import {
		getTradeTaskInfo
	} from "@/api/newTask.js"
	// import tabbar from '../components/tabbar'
	import {
		// getIndexListAPI,
		// getTaskListAPI,
		// getMyTaskListAPI,
		// getApproveListAPI,
		getUserIndexAPI,
	} from "@/api/oaApi.js";
	import {
		mapState
	} from 'vuex';
	import bj from "@/static/animation/home.json"
	import {
		userInfo
	} from "@/api/oaUser.js"
	//#ifdef APP-PLUS
	var jpushModule = uni.requireNativePlugin("JG-JPush");
	// #endif
	export default {
		components: {
			Myindex
		},
		data() {
			return {
				showCode: false,
				showCode1: false,
				brange: 0,
				options: {
					data: '',
				},
				status: "loadmore",
				page_num: 1,
				flag: false,
				uniMP: false,
				managerInfo: {},
				id: "",
				is_captain: 0,
				notArr: [],
				orderList: [],
				oaHomeData: [],
				taskList: [],
				src: "https://cdn.uviewui.com/uview/album/1.jpg",
				assessData: [{
						num: "0",
						name: "任务",
					},
					{
						num: "0",
						name: "已完成",
					},
					{
						num: "0",
						name: "未完成",
					},
					{
						num: "0%",
						name: "完成率",
					},
				],
				project: {},
				task: {},
				page: 1,
				myTaskList: [],
				flowState: "#47B347", // 任务状态
				priority: "", // 任务紧急度
				myOaInfo: {
					avatar: "",
					nickname: "",
					mobile: "",
					did_name: "",
					label_name: "",
				},
				ApproveList: [],
				showOaHomeData: false, //更新首页计算的值
				chartData: {},
				progress: 0,
				//您可以通过修改 config-ucharts.js 文件中下标为 ['arcbar'] 的节点来配置全局默认参数，如都是默认参数，此处可以不传 opts 。实际应用过程中 opts 只需传入与全局默认参数中不一致的【某一个属性】即可实现同类型的图表显示不同的样式，达到页面简洁的需求。
				opts: {

					title: {

						fontSize: 16,
						color: "#2fc25b"
					},
					subtitle: {
						name: "",
						fontSize: 12,
						color: "#666666"
					},
					extra: {
						arcbar: {
							type: "circle",
							width: 12,
							backgroundColor: "#E9E9E9",
							startAngle: 1.5,
							endAngle: 0.25,
							gap: 2
						}
					}
				}


			};
		},
		async onLoad() {
			// console.log('asdashg')
			if (uni.getStorageSync('USER_INFO')) {
				let userData = JSON.parse(uni.getStorageSync('USER_INFO'))

				this.initUserInfo(userData);
				// console.log(545)
			}
			await this.$onLaunched;
			this.is_captain = JSON.parse(uni.getStorageSync("USER_INFO") || '{}')?.is_captain
			this.options.data = bj;
			// this.initTask()
		},
		async onShow() {
			this.initTask()
			await this.$onLaunched;
			if (uni.getStorageSync('uniMP')) this.uniMP = true;
			userInfo().then(({
				data
			}) => {
				this.$store.commit('setUserInfo', data);
				this.initUserInfo(data);
				this.$store.dispatch('initConfig');
			});
			this.initUserInfo();
			if (this.oaHomeData.length == 0) {
				this.$nextTick(() => {
					this.$store.dispatch('initConfig');
				})
			}
		},



		computed: {
			// oaHomeData() {
			//   const route = '/pages/oaHome/oaHome';
			//   let arr = [];
			//   this.$store.state.config?.config?.menu?.forEach((item) => {
			//     if (item.paths.includes(route)) {
			//       arr = item.children;
			//     }
			//   })
			//   if (arr.length >= 8) {
			//     arr = arr.slice(0, 7);
			//     let obj = this.$store.state.config?.config?.menu?.find(item => item.paths.includes(
			//       '/pages/moreFun/moreFun'));
			//     arr.push(obj);
			//   }
			//   return arr;
			// },
		},
		watch: {
			'$store.state.app.token': {
				handler: function(n, o) {
					userInfo().then(({
						data
					}) => {
						// console.log(data);
						this.$store.commit('setUserInfo', data);
						this.initUserInfo(data);
						this.$store.dispatch('initConfig');
					});
				}
			},
			'$store.state.config.config.menu': {
				immediate: true,
				deep: true,
				handler: function(n, o) {
					const route = '/pages/oaHome/oaHome';
					let arr = [];
					n.forEach((item) => {

						if (item.paths.includes(route)) {
							arr = item.children;
						}
					})
					if (arr.length >= 7) {
						arr = arr.slice(0, 3);
						let obj = n.find(item => item.paths.includes(
							'/pages/moreFun/moreFun'));
						arr.push(obj);
					}
					this.oaHomeData = arr;
				}
			}
		},
		methods: {
			copyCode() {
				let that = this
				uni.setClipboardData({
					data: that.myOaInfo.invite_code,
					success: function() {
						console.log('success');
					}
				});
			},
			saveCode() {
				this.$refs.uqrcode.save({
					success: () => {
						uni.showToast({
							icon: 'success',
							title: '保存成功'
						});
					}
				});
				// var pages = getCurrentPages();
				// var page = pages[pages.length - 1];
				// console.log("当前页" + pages.length - 1);
				// var bitmap = null;
				// var currentWebview = page.$getAppWebview();
				// bitmap = new plus.nativeObj.Bitmap('amway_img');
				// // 将webview内容绘制到Bitmap对象中  
				// currentWebview.draw(bitmap, function() {
				// 	console.log('截屏绘制图片成功');
				// 	bitmap.save("_doc/a.jpg", {}, function(i) {
				// 		console.log('保存图片成功：' + JSON.stringify(i));
				// 		uni.saveImageToPhotosAlbum({
				// 			filePath: i.target,
				// 			success: function() {
				// 				bitmap.clear(); //销毁Bitmap图片  
				// 				uni.showToast({
				// 					title: '保存图片成功',
				// 					mask: false,
				// 					duration: 1500
				// 				});
				// 			}
				// 		});
				// 	}, function(e) {
				// 		console.log('保存图片失败：' + JSON.stringify(e));
				// 	});
				// }, function(e) {
				// 	console.log('截屏绘制图片失败：' + JSON.stringify(e));
				// });
				// //currentWebview.append(amway_bit);    
			},

			leftClick(e) {
				console.log("发送给宿主")
				uni.sendHostEvent('closeApp', e, (ret) => {
					//发送消息成功回调
					console.log('关闭应用' + JSON.stringify(ret));
				});
			},
			async initTask() {
				let res = await taskListApi()
				this.taskList = res.data
				console.log(this.taskList)

			},

			initUserInfo(data = null) {
				if (data) return this.myOaInfo = data;
				this.$store.state.app.userInfo ?
					(this.myOaInfo = this.$store.state.app.userInfo) :
					(this.myOaInfo.avatar = "");
			},
			navgo(url) {
				uni.navigateTo({
					url
				})
			},
			navTo(url) {
				if (url) {
					uni.showLoading({
						title: '加载中',
						mask: true
					});
					uni.navigateTo({
						url: url,
						success() {
							uni.hideLoading()
						},
						fail() {
							uni.switchTab({
								url: url,
								success() {
									uni.hideLoading()
								},
								fail() {
									uni.hideLoading()
								}
							});
						},
					})
				} else Toast('暂未开放')
			},
			navTwo(url, key) {
				// let role_id = this.$store.state.app?.userInfo?.admin?.role_id || null;
				// var arr = [3, 6];

				// if (role_id && role_id[0] == 9) {
				//   if (arr.indexOf(key) == -1) {
				//     Toast("请先成立公司后开放");
				//     return false;
				//   }
				// }
				this.navTo(url);
			},
			// 点击公告
			clickNotice(e) {
				uni.navigateTo({
					url: `/pages/oaNews/oaNews?id=${e}`,
				});
			},



			async getUserIndex() {
				const res = await getUserIndexAPI();

				console.log(res, "res")
				this.myOaInfo = res;
			},
		},
		async onPullDownRefresh() {
			this.initTask()

			await this.$store.dispatch('initConfig');

			uni.stopPullDownRefresh();
		},
	};
</script>

<style lang="scss">
	.box {
		min-height: 100vh;
		background-color: #F9FBFF;
	}

	.head {
		width: 750rpx;
		background-image: url('/static/newWork/index/SYBG.png');
		background-size: 100% 100%;
		height: 378.78rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #2B63E2;
		position: relative;

		.head-content {
			// box-shadow: 0.5rpx 0.5rpx 100rpx 0.5rpx rgba(0, 0, 0, 0.1);
			width: 690rpx;
			margin: 0 auto;
			position: absolute;
			bottom: -10rpx;
			left: 50%;
			transform: translateX(-50%);
			display: flex;
			justify-content: space-between;
			padding: 0 30rpx;
			box-sizing: border-box;
			align-items: center;
			height: 128rpx;
			background-image: linear-gradient(to bottom, #D8EAFF 30%, #FFFFFF 100%);
			border-radius: 64rpx 64rpx 64rpx 64rpx;

			.avatar {
				position: absolute;
				left: 50%;
				transform: translateX(-50%);
				top: -160rpx;
			}

			.identity {
				max-width: 250rpx;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}


	}

	.deposit {
		margin-top: 40rpx;
		display: flex;
		width: 750rpx;
		justify-content: space-between;
		flex-wrap: wrap;
		box-sizing: border-box;
		padding: 0 30rpx;


		.deposit-l {
			width: 335rpx;
			height: 128rpx;
			background-color: white;
			border-radius: 20rpx;
			display: flex;
			font-size: 30rpx;
			box-shadow: 0.5rpx 0.5rpx 200rpx 0.5rpx rgba(0, 0, 0, 0.1);
			box-sizing: border-box;
			padding: 30rpx 29rpx;
			font-weight: 500;
			margin-bottom: 20rpx;

			.deposit-value {
				color: #336AE7;
				margin-top: 5rpx;
			}
		}

	}

	.transition {
		position: absolute;
		top: 60%;
		left: 50%;
		transform: translate(-50%, -50%);

	}

	.tit {
		position: relative;
		padding-left: 20rpx;
		font-size: 30rpx;
		margin-bottom: 20rpx;
		color: #1A1A1A;
	}

	.tit::before {
		content: "";
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		left: 0;
		width: 6rpx;
		/* 左边框的宽度 */
		height: 25rpx;
		border-radius: 20rpx;
		background-color: #2B63E3;
	}

	.task {
		width: 690rpx;
		margin: 0 auto;

		.task-li {
			background-color: white;
			padding: 30rpx;
			box-shadow: 0.5rpx 0.5rpx 200rpx 0.5rpx rgba(0, 0, 0, 0.1);
			border-radius: 20rpx;
			margin-bottom: 20rpx;
		}

		.task-li-top {
			display: flex;
			justify-content: space-between;

			.detail-btn {
				color: #2B63E3;
				font-size: 24rpx;
				width: 144rpx;
				height: 44rpx;
				text-align: center;
				line-height: 40rpx;
				border: 1px solid #2B63E3;
				border-radius: 22rpx 22rpx 22rpx 22rpx;

			}
		}

		.task-content {
			width: 630rpx;
			margin: 0 auto;
			background-color: #F7F7F7;
			// padding: 20rpx;
			height: 80rpx;
			line-height: 80rpx;
			padding: 0 20rpx;
			margin-top: 20rpx;
			border-radius: 20rpx 20rpx 20rpx 20rpx;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;


		}


	}

	.code {
		width: 634rpx;
		height: 795rpx;
		background-image: url('/static/newWork/index/EWMBG.png');
		background-size: 100% 100%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);

		.code-img {
			position: absolute;
			top: 140rpx;
			left: 50%;
			transform: translateX(-50%);
			width: 100%;

			.code-text {
				margin-left: 20rpx;
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 0 40rpx;
				color: #3972F4;
				width: 440rpx;
				margin: 0 auto;
				margin-top: 30rpx;
			}

		}

		.code-foot {
			display: flex;
			justify-content: space-between;
			width: 520rpx;
			margin: 0 auto;
			margin-top: 30rpx;

			.code-foot-btn {
				width: 200rpx;
				height: 78rpx;
				line-height: 78rpx;
				text-align: center;
				border-radius: 39rpx 39rpx 39rpx 39rpx;
				background-color: #3972F4;
				color: white;
				font-size: 28rpx;

			}

			// width: 500rpx;
		}
	}

	// .oa_home {
	// 	padding-bottom: 100rpx;
	// }

	// .header_bg {
	// 	position: absolute;
	// 	width: 100%;
	// }

	// .home_header {
	// 	position: relative;
	// 	padding: 28rpx;
	// 	width: 100%;
	// 	margin-bottom: 110rpx;
	// 	background-color: $theme-oa-color;
	// 	border-radius: 0 0 30rpx 30rpx;

	// 	.head_img {
	// 		position: relative;
	// 		background-color: #ff7c32;
	// 		width: 100%;
	// 		height: 105.14rpx;
	// 		line-height: 105.14rpx;
	// 		border-radius: 35.05rpx 35.05rpx 35.05rpx 35.05rpx;
	// 		display: flex;
	// 		justify-content: space-between;
	// 		padding-right: 28rpx;
	// 		color: white;
	// 		font-size: 34rpx;
	// 		padding-left: 150rpx;
	// 		box-sizing: border-box;

	// 		.img_box {
	// 			position: absolute;

	// 			left: -10rpx;
	// 			top: -15rpx;
	// 			width: 140rpx;
	// 			height: 140rpx;
	// 			background-color: white;
	// 			border-radius: 140rpx;

	// 			.img_box_img {
	// 				position: absolute;
	// 				top: 50%;
	// 				left: 50%;
	// 				transform: translate(-50%, -50%);
	// 			}
	// 		}

	// 		.head_text {
	// 			font-size: 33rpx;
	// 			text-overflow: ellipsis;
	// 			white-space: nowrap;
	// 			overflow: hidden;
	// 		}

	// 		// font-we
	// 	}

	// 	.my_info {
	// 		.mesg_box {
	// 			color: #fff;
	// 			margin-left: 31.58rpx;

	// 			.nickname {
	// 				font-size: 32rpx;
	// 				font-weight: 500;
	// 				margin-right: 30rpx;
	// 			}

	// 			.duty {
	// 				margin-top: 10.53rpx;
	// 			}
	// 		}
	// 	}

	// 	.task_panel {
	// 		color: #fff;
	// 		display: flex;
	// 		justify-content: space-between;
	// 		flex-wrap: wrap;
	// 		align-content: space-between;
	// 		text-align: center;
	// 		padding-bottom: 110rpx;

	// 		.task_item {
	// 			margin-top: 42.11rpx;

	// 			.plan {
	// 				width: 173.68rpx;
	// 				font-size: 38.6rpx;
	// 				margin-bottom: 21.05rpx;
	// 			}
	// 		}
	// 	}

	// 	.backlog {
	// 		position: absolute;
	// 		left: 50%;
	// 		bottom: -101.75rpx;
	// 		transform: translate(-50%);
	// 		width: 694.74rpx;
	// 		background: #ffffff;
	// 		border-radius: 12px;
	// 		padding: 28.07rpx;
	// 		display: flex;
	// 		flex-direction: column;
	// 		justify-content: space-between;
	// 		font-size: 25rpx;
	// 		font-weight: 400;

	// 		.title {
	// 			font-size: 32rpx;
	// 			font-weight: 500;
	// 		}

	// 		&_item {
	// 			margin-top: 19.3rpx;
	// 			color: #666666;

	// 			.text {
	// 				font-size: 28.04rpx;
	// 				white-space: nowrap;
	// 				/* 禁止换行 */
	// 				overflow: hidden;
	// 				/* 溢出隐藏 */
	// 				text-overflow: ellipsis;
	// 				/* 使用省略号代表被截断的文本 */
	// 				width: 580rpx;

	// 				/* 设置元素宽度，根据需要进行调整 */
	// 				.text_time {
	// 					display: inline-block;
	// 					background-color: #ff7c32;
	// 					color: white;
	// 					padding: 5rpx 10rpx;
	// 					margin-right: 10rpx;
	// 					border-radius: 15rpx;
	// 				}

	// 				// &::before {
	// 				// 	content: "公告";
	// 				// 	display: inline-block;
	// 				// 	color: #ff8c1a;
	// 				// 	padding: 2px 8px;
	// 				// 	border-radius: 4px;
	// 				// 	border: 1px solid #ff8c1a;
	// 				// 	margin-right: 14.04rpx;
	// 				// }
	// 			}
	// 		}

	// 		&_no {
	// 			margin-top: 19.3rpx;
	// 			color: #666666;

	// 			.text {
	// 				font-size: 28.04rpx;
	// 				white-space: nowrap;
	// 				/* 禁止换行 */
	// 				overflow: hidden;
	// 				/* 溢出隐藏 */
	// 				text-overflow: ellipsis;
	// 				/* 使用省略号代表被截断的文本 */
	// 				width: 580rpx;
	// 				/* 设置元素宽度，根据需要进行调整 */

	// 				&::before {
	// 					content: none;
	// 				}
	// 			}
	// 		}
	// 	}


	// }

	// .home_header_no_data {
	// 	margin-bottom: 93.33rpx;
	// }

	// .fast_track {
	// 	width: 694rpx;
	// 	// height: 331rpx;
	// 	display: flex;
	// 	flex-wrap: wrap;
	// 	justify-content: left;
	// 	align-content: space-between;
	// 	margin: 0 auto;
	// 	padding: 15rpx 38.6rpx;
	// 	background-color: #fff;
	// 	border-radius: 12px;

	// 	.track_item {
	// 		width: 154.39rpx;
	// 		font-size: 24.56rpx;
	// 		margin: 25rpx 0;
	// 		display: flex;
	// 		flex-direction: column;
	// 		align-items: center;

	// 		.title {
	// 			margin-top: 14.04rpx;
	// 		}
	// 	}
	// }

	// .my_task {
	// 	width: 694.74rpx;
	// 	margin: 0 auto;
	// 	// margin-top: 31.58rpx;
	// 	// background-color: #fff;
	// 	border-radius: 12px;
	// 	// padding: 28.07rpx;

	// 	.no_task {
	// 		width: 694rpx;
	// 		height: 140rpx;
	// 		padding: 28rpx;
	// 		background: #ffffff;
	// 		border-radius: 21rpx 21rpx 21rpx 21rpx;
	// 		display: flex;
	// 		flex-direction: column;
	// 		justify-content: space-evenly;

	// 		.title {
	// 			font-size: 28rpx;
	// 			font-weight: 500;
	// 			color: #000000cc;
	// 			line-height: 35rpx;
	// 		}

	// 		.tips {
	// 			font-size: 25rpx;
	// 			font-weight: 400;
	// 			color: #333333ff;
	// 			line-height: 35rpx;
	// 		}
	// 	}

	// 	.task_title {
	// 		font-size: 25rpx;
	// 		font-weight: 400;
	// 		padding: 28rpx;

	// 		.title {
	// 			font-size: 32rpx;
	// 			font-weight: 500;
	// 		}
	// 	}

	// 	.task_list {
	// 		height: 196.49rpx;
	// 		border-bottom: 1px solid #cccccc;
	// 		padding: 21.05rpx 0;
	// 		display: flex;
	// 		flex-direction: column;
	// 		justify-content: space-between;

	// 		.title {
	// 			.tag {
	// 				color: #f24848;
	// 				font-size: 24.56rpx;
	// 				padding: 0 7.02rpx;
	// 				margin-right: 14.04rpx;
	// 				background: #ffe4e4;
	// 				border-radius: 4px;
	// 			}

	// 			.tag1 {
	// 				color: #3274f9;
	// 				font-size: 24.56rpx;
	// 				padding: 0 7.02rpx;
	// 				margin-right: 14.04rpx;
	// 				background: #e4edff;
	// 				border-radius: 4px;
	// 			}

	// 			.text {
	// 				font-size: 28.07rpx;
	// 				width: 403.51rpx;
	// 				white-space: nowrap;
	// 				overflow: hidden;
	// 				text-overflow: ellipsis;
	// 			}

	// 			.if_take {
	// 				font-size: 28.07rpx;
	// 				text-align: center;
	// 				line-height: 49.12rpx;
	// 				width: 115.79rpx;
	// 				height: 49.12rpx;
	// 				border-radius: 100px;
	// 			}

	// 			.take1 {
	// 				color: #47b347;
	// 				background: #dffcdf;
	// 			}

	// 			.take2 {
	// 				color: #3274f9;
	// 				background: #e4edff;
	// 			}

	// 			.take3 {
	// 				color: #999999;
	// 				background: #f5f5f5;
	// 			}
	// 		}

	// 		.describe {
	// 			font-size: 24.56rpx;
	// 		}

	// 		.task_deta {
	// 			color: #999;
	// 			font-size: 24.56rpx;
	// 		}
	// 	}
	// }

	// .no_login {
	// 	position: fixed;
	// 	left: 0;
	// 	bottom: 0;
	// 	width: 100vw;
	// 	height: 112rpx;
	// 	/* #ifdef H5 */
	// 	height: 212rpx;
	// 	/* #endif */
	// 	background: rgba(#333333, 0.4);
	// 	border-radius: 14rpx 14rpx 0rpx 0rpx;
	// 	padding: 28rpx 28rpx;

	// 	.view {
	// 		width: 100%;
	// 		display: flex;
	// 		justify-content: space-between;
	// 		align-items: center;

	// 		.text {
	// 			font-size: 28rpx;
	// 			font-weight: 500;
	// 			color: #ffffff;
	// 		}

	// 		.btn {
	// 			width: 158rpx;
	// 			height: 60rpx;
	// 			background: #3274f9;
	// 			border-radius: 30rpx 30rpx 30rpx 30rpx;
	// 			font-size: 28rpx;
	// 			font-weight: 500;
	// 			color: #ffffff;
	// 			display: flex;
	// 			justify-content: center;
	// 			align-items: center;
	// 		}
	// 	}
	// }

	// .chat {
	// 	margin-top: 1000px;
	// 	// margin-top: 2000rpx;
	// 	width: 694.74rpx;
	// 	margin: 0 auto;
	// 	background-color: white;
	// 	border-radius: 12px;
	// 	padding: 20rpx;
	// 	// padding-top: 10rpx;
	// 	padding-right: 24rpx;
	// 	display: flex;
	// 	justify-content: space-between;
	// 	align-items: center;

	// 	.chat-l {
	// 		display: flex;
	// 		align-items: center;
	// 	}
	// }

	// .brange {
	// 	color: white;
	// 	background-color: red;
	// 	width: 40rpx;
	// 	height: 40rpx;
	// 	border-radius: 40rpx;
	// 	font-size: 12px;
	// 	text-align: center;
	// 	lighting-color: 40rpx;
	// }
</style>