OfficeApp/pages/oaHome/oaHome.vue
2024-01-30 18:10:55 +08:00

1254 lines
28 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="box">
<!-- <view class=""
style="background-color: red;height: var(--status-bar-height);position: fixed;top: 0;z-index: 9999;" /> -->
<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" @click="navgo('/pages/test/choseIdentity') "> -->
<view class="identity">
身份{{ myOaInfo.user_role_name}}
</view>
</view>
</view>
<view class="deposit" v-if="myOaInfo.group_id !=20">
<view class="deposit-l" v-for="(item,index) in depositLIst" :key='index' @click='item.event'>
<u--image :showLoading="true" width="81rpx" height="78rpx"
:src="`../../static/newWork/index/${item.icon}.png`"></u--image>
<view class="" style="margin-left:20rpx ;">
<view class="" style="font-size: 28rpx;">
{{item.title}}
</view>
<view class="deposit-value">
{{item.unit||''}}{{myOaInfo[item.value]}}
</view>
</view>
</view>
</view>
<view class="deposit" v-else>
<view class="deposit-l" v-for="(item,index) in depositCouriersLIst" :key='index' @click='item.event'>
<u--image :showLoading="true" width="81rpx" height="78rpx"
:src="`../../static/newWork/index/${item.icon}.png`"></u--image>
<view class="" style="margin-left:20rpx ;">
<view class="" style="font-size: 28rpx;">
{{item.title}}
</view>
<view class="deposit-value">
{{item.unit||''}}{{myOaInfo[item.value]}}
</view>
</view>
</view>
</view>
<!--追加功能 -->
<view class="" v-if='taskList.length==0&& myOaInfo.group_id!=20 '>
<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" style="margin-bottom: 20rpx;" v-if="myOaInfo.group_id!=20">
我的任务
</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>
<view class="logisti task" v-if="myOaInfo.group_id==20">
<view class="logisti-head">
<view class="tit">
配送信息
</view>
<view class="" style="display: flex;">
<u--input placeholder="搜索" class='serch' prefixIcon="search"
prefixIconStyle="font-size: 22px;color: #909399" @blur='serchWidth=170' @focus='serchWidth=400'
:style="`width:${serchWidth}rpx`" v-model='keywords'></u--input>
<u-button
style="width: 100rpx;height: 60rpx;background-color: #2B63E3;color: white;border-radius: 20rpx;"
text="搜索" @click="getOrderList"></u-button>
</view>
</view>
<logistiBriefCard v-for="(item, index) in orderList" :key="index" :goodsInfo="item">
</logistiBriefCard>
<u-loadmore :status="status" v-if='orderList.length>0' />
<u-empty v-else icon="/static/newWork/index/empty.png" iconSize='200' width='300' height="300"
marginTop='50' textColor='#BFD7FF' text="没有更多订单了~"></u-empty>
</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="myOaInfo.share_url" :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 logistiBriefCard from "@/components/logistiComptent/logistiCard/logistiBriefCard.vue";
import {
userInfo
} from "@/api/oaUser.js"
//#ifdef APP-PLUS
var jpushModule = uni.requireNativePlugin("JG-JPush");
// #endif
export default {
components: {
Myindex,
logistiBriefCard
},
data() {
return {
depositLIst: [{
icon: "YJ",
title: "押金",
value: "deposit",
event: () => {
return
}
},
{
icon: "GLHS",
title: "管理户数",
value: "user_information_count"
},
{
icon: "ZCYHS",
title: "成功邀请人数",
value: "register_num"
},
// {
// icon: "RZSHS",
// title: "入驻商户数",
// value: "merchant_num"
// },
// {
// icon: "JYJE",
// title: "交易金额",
// value: "trade_amount",
// unit: "¥"
// },
// {
// icon: "RZSHS",
// title: "成功邀请人数",
// value: "merchant_num"
// },
{
icon: "RZSHS",
title: "总计首单金额",
value: "trade_amount",
unit: "¥",
event: () => {
uni.navigateTo({
url: `/pages/oaHome/FirstOrderLog?money=${this.myOaInfo.trade_amount}`
})
}
},
{
icon: "RZSHS",
title: "收益",
value: "user_money",
unit: "¥",
event: () => {
uni.navigateTo({
url: `/pages/oaHome/accountLog?money=${this.myOaInfo.user_money}`
})
}
},
{
icon: "YQM",
title: "邀请码",
value: "invite_code",
event: () => {
this.showCode = true
},
},
],
keywords: "",
depositCouriersLIst: [{
icon: "RZSHS",
title: "收益",
value: "user_money",
unit: "¥",
event: () => {
uni.navigateTo({
url: '/pages/oaHome/accountLog'
})
}
},
{
icon: "YQM",
title: "邀请码",
value: "invite_code",
event: () => {
this.showCode = true
},
},
],
showCode: false,
showCode1: false,
serchWidth: 150,
status: "loadmore",
options: {
data: '',
},
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",
project: {},
task: {},
page: 1,
priority: "", // 任务紧急度
myOaInfo: {
avatar: "",
nickname: "",
mobile: "",
did_name: "",
label_name: "",
},
ApproveList: [],
};
},
async onLoad() {
// console.log('asdashg')
if (uni.getStorageSync('USER_INFO')) {
let userData = JSON.parse(uni.getStorageSync('USER_INFO'))
this.initUserInfo(userData);
}
this.is_captain = JSON.parse(uni.getStorageSync("USER_INFO") || '{}')?.is_captain
this.options.data = bj;
await this.$onLaunched;
},
async onShow() {
this.initTask()
this.getOrderList()
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
},
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) {
this.navTo(url);
},
async getOrderList() {
this.id = this.myOaInfo.id;
let res = await getList({
user_id: this.id,
user_type: this.is_captain,
keywords: this.keywords,
status: '0,1,2,3'
});
this.orderList = res.data.data;
},
async getUserIndex() {
const res = await getUserIndexAPI();
this.myOaInfo = res;
},
goOrderList() {
uni.navigateTo({
url: "/pages/logistics/index",
});
},
},
async onPullDownRefresh() {
this.initTask()
this.getOrderList()
await this.$store.dispatch('initConfig');
uni.stopPullDownRefresh();
},
onReachBottom() {
if (this.flag) return
let that = this
this.status = "loading"
this.page_num += 1
this.flag = true
getList({
status: this.curNow,
user_id: this.id,
keywords: this.keywords,
user_type: this.is_captain,
page_num: this.page_num,
status: '0,1,2,3'
}).then(res => {
that.orderList = that.orderList.concat(res.data.data)
this.flag = false
if (!res.data.data.length) {
this.status = "nomore"
this.flag = true
}
})
},
};
</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;
}
}
.logisti {
.logisti-head {
display: flex;
justify-content: space-between;
align-items: center;
.serch {
background-color: #EDF0F6;
height: 60rpx;
border-radius: 29rpx 29rpx 29rpx 29rpx;
transition: 500ms;
}
}
}
// .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>