|
@@ -0,0 +1,712 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="workBench">
|
|
|
|
+ <div class="topBody">
|
|
|
|
+ <p class="breadcrumb">工作台</p>
|
|
|
|
+ <div class="bottom">
|
|
|
|
+ <div class="touxiang">
|
|
|
|
+ <img src="@/assets/touxiang.png" alt="">
|
|
|
|
+ </div>
|
|
|
|
+ <div class='tip'>
|
|
|
|
+ <p class="greet">{{getTimeState()}},{{roleInfo.realname}},祝你开心每一天!</p>
|
|
|
|
+ <p class="descPosition">
|
|
|
|
+ <span>{{roleInfo.roleName}}</span>
|
|
|
|
+ <a-divider type="vertical" />
|
|
|
|
+ <span>{{roleInfo.area}}地区-{{roleInfo.departName}}</span>
|
|
|
|
+ </p>
|
|
|
|
+ </div>
|
|
|
|
+ <a-button type='primary' class="mybtn" @click="sendOrder">
|
|
|
|
+ <a-icon type="plus" />
|
|
|
|
+ 发起订单
|
|
|
|
+ </a-button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="section">
|
|
|
|
+ <div class="sectionBody">
|
|
|
|
+ <div class="sectionLeftBox">
|
|
|
|
+ <div class="leftTop">
|
|
|
|
+ <div class="sectionHead">
|
|
|
|
+ 我的工作内容
|
|
|
|
+ </div>
|
|
|
|
+ <div class="zhanshiBox">
|
|
|
|
+
|
|
|
|
+ <div class="item" @click="goOrderList(1)">
|
|
|
|
+ <div class="title">
|
|
|
|
+ <img src="@/assets/work.png" alt="" class="iconImg">
|
|
|
|
+ <span>我发起的订单</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="itemBody">
|
|
|
|
+ <p class="count">{{countInfo.newOrder || 0}} <span>个</span></p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="item" @click="goMaterialList(1)">
|
|
|
|
+ <div class="title">
|
|
|
|
+ <img src="@/assets/work.png" alt="" class="iconImg">
|
|
|
|
+ <span>待审核的物料</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="itemBody">
|
|
|
|
+ <p class="count">{{countInfo.toAuditMaterial || 0}}<span>个</span></p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="item" @click="goOrderList(2)">
|
|
|
|
+ <div class="title">
|
|
|
|
+ <img src="@/assets/work.png" alt="" class="iconImg">
|
|
|
|
+ <span>已完成的订单</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="itemBody">
|
|
|
|
+ <p class="count">{{countInfo.finishOrder ||0}}<span>个</span></p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="item" @click="goOrderList(3)">
|
|
|
|
+ <div class="title">
|
|
|
|
+ <img src="@/assets/work.png" alt="" class="iconImg">
|
|
|
|
+ <span>被驳回的订单</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="itemBody">
|
|
|
|
+ <p class="count">{{countInfo.rejectOrder || 0}} <span>个</span></p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- <div class="item" @click="goOrderList(4)">
|
|
|
|
+ <div class="title">
|
|
|
|
+ <img src="@/assets/work.png" alt="" class="iconImg">
|
|
|
|
+ <span>全部订单</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="itemBody">
|
|
|
|
+ <p class="count">{{countInfo.allOrder}}<span>个</span></p>
|
|
|
|
+ </div>
|
|
|
|
+ </div> -->
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="leftBottom">
|
|
|
|
+ <div class="sectionHead">
|
|
|
|
+ 订单进度
|
|
|
|
+ <!-- <a-button type="link" class="allOrder" @click="goOrderList(1)">全部订单</a-button> -->
|
|
|
|
+ </div>
|
|
|
|
+ <a-spin :spinning="orderProgressSpinning">
|
|
|
|
+ <div class="orderProgress">
|
|
|
|
+
|
|
|
|
+ <ul class="orderProgress-list" v-if="orderProgressList.length>0">
|
|
|
|
+ <li v-for="(item,index) in orderProgressList" :key="index" >
|
|
|
|
+ <!-- <span style="display:block;width:100%"> -->
|
|
|
|
+ <div style="display:flex;align-items: center;" class="orderProgress-list-item" @click="orderDetail(item)">
|
|
|
|
+ <div style="display:flex;width:80%; align-items: center;" >
|
|
|
|
+ <span class="item-icon"></span>
|
|
|
|
+ <div class="content">
|
|
|
|
+ <p class="name">{{item.orderTitle}}</p>
|
|
|
|
+ <p class="desc">{{item.orderRemark}}</p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ <div class="progress" v-if="item.orderStatus==1||item.orderStatus==3">
|
|
|
|
+ <a-progress type="circle" :percent="(item.materialFinishAmount/item.materialAmount)*100" :width='30' :showInfo='false' :strokeWidth='10' />
|
|
|
|
+ <span style="margin-left:15px">{{(item.materialFinishAmount/item.materialAmount)*100}}%</span>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="progress" v-else>
|
|
|
|
+ {{item.orderStatus|handleOrderStatus}}
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- </span> -->
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ <div v-else style="width:100%;height:585px;line-height:585px;text-align:center">
|
|
|
|
+
|
|
|
|
+ <img src="@/assets/nodata.png" alt="" style="width:300px;text-align:center">
|
|
|
|
+ </div>
|
|
|
|
+ <!-- hideOnSinglePage -->
|
|
|
|
+ <a-pagination size="small" :total="totalPage" :current='currentPage' :pageSize='8' class="fenye" @change='pageChange' show-quick-jumper />
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </a-spin>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="sectionRightBox">
|
|
|
|
+ <div class="rightTop">
|
|
|
|
+ <div class="sectionHead">
|
|
|
|
+ 操作记录
|
|
|
|
+ </div>
|
|
|
|
+ <a-spin :spinning="spinning">
|
|
|
|
+ <div class="optionRecordList">
|
|
|
|
+
|
|
|
|
+ <a-timeline >
|
|
|
|
+ <a-timeline-item color='#F0F2F5' style="height:46px" v-for="(item,index) in operateRecordList" :key="index">
|
|
|
|
+ <p style="margin-bottom:0px">
|
|
|
|
+ <span class="content-item">{{item.userName}}{{item.operate}}{{item.materialName||item.orderTitle}}</span>
|
|
|
|
+ <span class="time">{{item.time}}</span>
|
|
|
|
+ </p>
|
|
|
|
+ </a-timeline-item>
|
|
|
|
+
|
|
|
|
+ </a-timeline>
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </a-spin>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- <div class="rightBottom">
|
|
|
|
+ <div class="sectionHead">
|
|
|
|
+ 本周项目燃尽图
|
|
|
|
+ </div>
|
|
|
|
+ <div class="burnDown">
|
|
|
|
+ <a-progress type="circle" :percent="75" :width='150' :strokeWidth='6' />
|
|
|
|
+ <div class="tip">
|
|
|
|
+ <p class="done">
|
|
|
|
+ <span class="item-icon"></span>
|
|
|
|
+ <span>已完成订单:{{}}个</span>
|
|
|
|
+ </p>
|
|
|
|
+ <p class="all">
|
|
|
|
+ <span class="item-icon"></span>
|
|
|
|
+ <span>未完成订单:{{}}个</span>
|
|
|
|
+ </p>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div> -->
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import moment from 'moment';
|
|
|
|
+import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
|
|
|
|
+
|
|
|
|
+export default {
|
|
|
|
+ name:'operator-platform',
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ moment,
|
|
|
|
+ roleInfo:{},
|
|
|
|
+ todayGreet:moment(),
|
|
|
|
+ orderProgressSpinning:false,
|
|
|
|
+ countInfo:{},
|
|
|
|
+
|
|
|
|
+ spinning:false,
|
|
|
|
+ touxiang:'@/assets/touxiang.png',
|
|
|
|
+ // 订单进度
|
|
|
|
+ orderProgressList:[
|
|
|
|
+
|
|
|
|
+ ],
|
|
|
|
+
|
|
|
|
+ // 操作记录
|
|
|
|
+ optionRecord:[],
|
|
|
|
+
|
|
|
|
+ // 本周项目燃尽图
|
|
|
|
+ burnDownChart:[],
|
|
|
|
+
|
|
|
|
+ // 分页参数
|
|
|
|
+ totalPage:0,
|
|
|
|
+ currentPage:1,
|
|
|
|
+
|
|
|
|
+ userInfo:{},
|
|
|
|
+ roleCode:'',
|
|
|
|
+
|
|
|
|
+ operateRecordList:[],
|
|
|
|
+
|
|
|
|
+ TimerObj:null,
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ goOrderList(val){
|
|
|
|
+ console.log(val);
|
|
|
|
+ // console.log(this.$parent)
|
|
|
|
+ this.$parent.currentTabComponent='orderList';
|
|
|
|
+ this.$parent.orderStatus=val
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ goMaterialList(val){
|
|
|
|
+ this.$parent.currentTabComponent='materialList';
|
|
|
|
+ this.$parent.materialStatus=val
|
|
|
|
+ },
|
|
|
|
+ orderDetail(item){
|
|
|
|
+ console.log(item)
|
|
|
|
+ this.$parent.currentTabComponent='orderDetail';
|
|
|
|
+ this.$parent.orderId=item.id
|
|
|
|
+ },
|
|
|
|
+ // 分页页码改变
|
|
|
|
+ pageChange(page, pageSize){
|
|
|
|
+ this.currentPage=page;
|
|
|
|
+ // console.log(page,pageSize)
|
|
|
|
+ this.getOrderList()
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 发起订单
|
|
|
|
+ sendOrder(){
|
|
|
|
+ this.$parent.currentTabComponent='placeOrder';
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ // 获取订单列表
|
|
|
|
+ getOrderList(){
|
|
|
|
+
|
|
|
|
+ let params={
|
|
|
|
+ createBy:this.userInfo.id,
|
|
|
|
+ pageNo:this.currentPage,
|
|
|
|
+ pageSize:8,
|
|
|
|
+ }
|
|
|
|
+ this.orderProgressSpinning=true;
|
|
|
|
+ getAction('/platform/order/listByCreatorOrDesignLeader',params).then(res=>{
|
|
|
|
+ console.log(res);
|
|
|
|
+ this.loading=false;
|
|
|
|
+ this.orderProgressSpinning=false;
|
|
|
|
+ if(res.success){
|
|
|
|
+
|
|
|
|
+ this.orderProgressList=res.result.list;
|
|
|
|
+ this.totalPage=res.result.total;
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 操作记录
|
|
|
|
+ getOperationRecord(){
|
|
|
|
+ this.spinning=true;
|
|
|
|
+ getAction('/platform/operateRecord/createDesc').then(res=>{
|
|
|
|
+ console.log(res)
|
|
|
|
+ this.spinning=false;
|
|
|
|
+ if(res.success){
|
|
|
|
+ this.operateRecordList=res.result.list.map((item,index)=>{
|
|
|
|
+
|
|
|
|
+ let time='';
|
|
|
|
+ let startTime=moment(item.createTime)
|
|
|
|
+ console.log(startTime)
|
|
|
|
+ if(moment().diff(startTime,'hours')>24){
|
|
|
|
+ time=item.createTime.split(/[ ]+/)[0]
|
|
|
|
+ return {
|
|
|
|
+ ...item,
|
|
|
|
+ time,
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ else if(moment().diff(startTime,'minutes')>60){
|
|
|
|
+ time=item.createTime.split(/[ ]+/)[1]
|
|
|
|
+ return {
|
|
|
|
+ ...item,
|
|
|
|
+ time,
|
|
|
|
+ }
|
|
|
|
+ }else if(moment().diff(startTime,'minutes')>=1){
|
|
|
|
+ time=moment().diff(startTime,'minutes')+'分钟前'
|
|
|
|
+ return {
|
|
|
|
+ ...item,
|
|
|
|
+ time,
|
|
|
|
+ }
|
|
|
|
+ }else if(moment().diff(startTime,'minutes')==0){
|
|
|
|
+ time=moment().diff(startTime,'seconds')+'秒前'
|
|
|
|
+ return {
|
|
|
|
+ ...item,
|
|
|
|
+ time,
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ });
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ scrollRecord(){
|
|
|
|
+ console.log(this.$refs.scrollRecord);
|
|
|
|
+ this.TimerObj=setInterval(()=>{
|
|
|
|
+ this.getOperationRecord()
|
|
|
|
+
|
|
|
|
+ },60000)
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ // 获取工作台内容
|
|
|
|
+ getPlantformInfo(){
|
|
|
|
+ getAction('/platform/query/jobContent').then(res=>{
|
|
|
|
+ console.log(res)
|
|
|
|
+ if(res.success){
|
|
|
|
+ if(this.$parent.role=='operator'){
|
|
|
|
+ this.countInfo=res.result.operatorJobContent
|
|
|
|
+ }else if(this.$parent.role=='design'){
|
|
|
|
+ this.countInfo=res.result.designJobContent
|
|
|
|
+ }else if(this.$parent.role=='designLeader'){
|
|
|
|
+ this.countInfo=res.result.designLeaderJobContent
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ getTimeState () {
|
|
|
|
+ // 获取当前时间
|
|
|
|
+ let timeNow = new Date();
|
|
|
|
+ // 获取当前小时
|
|
|
|
+ let hours = timeNow.getHours();
|
|
|
|
+ // 设置默认文字
|
|
|
|
+ let text = ``;
|
|
|
|
+ // 判断当前时间段
|
|
|
|
+ if (hours >= 0 && hours <= 5) {
|
|
|
|
+ text = `凌晨好`;
|
|
|
|
+ }else if(hours >= 6 && hours <= 9){
|
|
|
|
+ text = `早上好`;
|
|
|
|
+ } else if(hours > 9 && hours <= 12){
|
|
|
|
+ text = `上午好`;
|
|
|
|
+ }else if (hours > 12 && hours <= 14) {
|
|
|
|
+ text = `中午好`;
|
|
|
|
+ } else if (hours > 14 && hours <= 18) {
|
|
|
|
+ text = `下午好`;
|
|
|
|
+ } else if (hours > 18 && hours <= 24) {
|
|
|
|
+ text = `晚上好`;
|
|
|
|
+ }
|
|
|
|
+ // 返回当前时间段对应的状态
|
|
|
|
+ return text
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ getidentity(){
|
|
|
|
+ getAction('/platform/query/identity',{}).then(res=>{
|
|
|
|
+ console.log(res);
|
|
|
|
+ if(res.success){
|
|
|
|
+ this.roleInfo=res.result
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ mounted(){
|
|
|
|
+ let userInfo=localStorage.getItem('pro__Login_Userinfo');
|
|
|
|
+ if(userInfo){
|
|
|
|
+ this.userInfo=JSON.parse(userInfo).value
|
|
|
|
+ }
|
|
|
|
+ this.roleCode=localStorage.getItem('roleCode')
|
|
|
|
+ this.getOrderList()
|
|
|
|
+ this.getOperationRecord()
|
|
|
|
+ this.scrollRecord()
|
|
|
|
+ this.getPlantformInfo()
|
|
|
|
+ this.getidentity()
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ activated(){
|
|
|
|
+ let userInfo=localStorage.getItem('pro__Login_Userinfo');
|
|
|
|
+ if(userInfo){
|
|
|
|
+ this.userInfo=JSON.parse(userInfo).value
|
|
|
|
+ }
|
|
|
|
+ this.roleCode=localStorage.getItem('roleCode')
|
|
|
|
+ this.getOrderList()
|
|
|
|
+ this.getOperationRecord()
|
|
|
|
+
|
|
|
|
+ this.getPlantformInfo()
|
|
|
|
+ this.getidentity()
|
|
|
|
+ },
|
|
|
|
+ beforeDestroy(){
|
|
|
|
+ clearInterval(this.TimerObj)
|
|
|
|
+ },
|
|
|
|
+ filters:{
|
|
|
|
+ handleOrderStatus(val){
|
|
|
|
+ let text
|
|
|
|
+ switch (val) {
|
|
|
|
+ case 0:
|
|
|
|
+ text='待接单'
|
|
|
|
+ break;
|
|
|
|
+ case 1:
|
|
|
|
+ text='制作中'
|
|
|
|
+ break;
|
|
|
|
+ case 2:
|
|
|
|
+ text='已驳回'
|
|
|
|
+ break;
|
|
|
|
+ case 3:
|
|
|
|
+ text='已完成'
|
|
|
|
+ break;
|
|
|
|
+ case -1:
|
|
|
|
+ text='已撤回'
|
|
|
|
+ break;
|
|
|
|
+
|
|
|
|
+ default:
|
|
|
|
+ text='出错'
|
|
|
|
+ break;
|
|
|
|
+ }
|
|
|
|
+ return text
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.workBench{
|
|
|
|
+ ul,li{
|
|
|
|
+ margin: 0;
|
|
|
|
+ padding: 0;
|
|
|
|
+ }
|
|
|
|
+ width: 100%;
|
|
|
|
+ .topBody{
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 146px;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ margin-bottom: 12px;
|
|
|
|
+ padding: 20px;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ .breadcrumb{
|
|
|
|
+ width: 42px;
|
|
|
|
+ height: 22px;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: #000000;
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ }
|
|
|
|
+ .bottom{
|
|
|
|
+ display: flex;
|
|
|
|
+ position: relative;
|
|
|
|
+ // padding: 20px;
|
|
|
|
+ .touxiang{
|
|
|
|
+ width: 72px;
|
|
|
|
+ height: 72px;
|
|
|
|
+ margin-right: 20px;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ img{
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .tip{
|
|
|
|
+ .greet{
|
|
|
|
+ height: 28px;
|
|
|
|
+ font-size: 20px;
|
|
|
|
+ font-family: PingFangSC-Medium, PingFang SC;
|
|
|
|
+ font-weight: 500;
|
|
|
|
+ color: rgba(0, 0, 0, 0.85);
|
|
|
|
+ line-height: 28px;
|
|
|
|
+ }
|
|
|
|
+ .descPosition{
|
|
|
|
+ height: 22px;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: rgba(0, 0, 0, 0.45);
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ .mybtn{
|
|
|
|
+ position: absolute;
|
|
|
|
+ // top: 50%;
|
|
|
|
+ // margin-left: -18px;
|
|
|
|
+ right: 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ .section{
|
|
|
|
+ .sectionBody{
|
|
|
|
+ display: flex;
|
|
|
|
+ .sectionHead{
|
|
|
|
+ padding: 15px 20px;
|
|
|
|
+ // height: 24px;
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ font-family: PingFangSC-Medium, PingFang SC;
|
|
|
|
+ font-weight: 500;
|
|
|
|
+ color: rgba(0, 0, 0, 0.85);
|
|
|
|
+ line-height: 24px;
|
|
|
|
+ border-bottom: 1px solid #E9E9E9;;
|
|
|
|
+ position: relative;
|
|
|
|
+ .allOrder{
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 5px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .sectionLeftBox{
|
|
|
|
+ width: 70%;
|
|
|
|
+
|
|
|
|
+ .leftTop{
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ background: white;
|
|
|
|
+ }
|
|
|
|
+ .zhanshiBox{
|
|
|
|
+ display: flex;
|
|
|
|
+ flex-wrap: wrap;
|
|
|
|
+ .item{
|
|
|
|
+ width: 33.33%;
|
|
|
|
+ // background: brown;
|
|
|
|
+ padding: 20px ;
|
|
|
|
+ border-right: 1px solid #E9E9E9;
|
|
|
|
+ border-bottom: 1px solid #E9E9E9;
|
|
|
|
+ .title{
|
|
|
|
+ padding-bottom: 34px;
|
|
|
|
+ color: #000000;
|
|
|
|
+ .iconImg{
|
|
|
|
+ width: 24px;
|
|
|
|
+ margin-right: 8px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .itemBody{
|
|
|
|
+ text-align: center;
|
|
|
|
+ .count{
|
|
|
|
+
|
|
|
|
+ font-size: 24px;
|
|
|
|
+ font-family: PingFangSC-Medium, PingFang SC;
|
|
|
|
+ font-weight: 500;
|
|
|
|
+ color: #000000;
|
|
|
|
+ line-height: 32px;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ span{
|
|
|
|
+ font-size: 16px;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .count:hover{
|
|
|
|
+ color: #1890FF;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .item:nth-child(3n){
|
|
|
|
+ border-right: 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .leftBottom{
|
|
|
|
+ margin-top: 12px;
|
|
|
|
+ background: white;
|
|
|
|
+ .orderProgress{
|
|
|
|
+ padding: 0 20px;
|
|
|
|
+ height: 585px;
|
|
|
|
+ position: relative;
|
|
|
|
+ .orderProgress-list-item{
|
|
|
|
+ padding: 10px 0;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ border-bottom: 1px solid #E9E9E9;;
|
|
|
|
+ justify-content:space-between;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ .item-icon{
|
|
|
|
+ width: 8px;
|
|
|
|
+ height: 8px;
|
|
|
|
+ background: #3BA0FF;
|
|
|
|
+ margin-right: 15px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ }
|
|
|
|
+ .content{
|
|
|
|
+ width: 70%;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ .name{
|
|
|
|
+ height: 22px;
|
|
|
|
+ color: rgba(0, 0, 0, 0.65);
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ margin-bottom: 0px;
|
|
|
|
+ }
|
|
|
|
+ .desc{
|
|
|
|
+ height: 22px;
|
|
|
|
+ color: rgba(0, 0, 0, 0.25);
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ margin-bottom: 0px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .progress{
|
|
|
|
+ float: right;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .fenye{
|
|
|
|
+ padding: 20px 0;
|
|
|
|
+ text-align: right;
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 20px;
|
|
|
|
+ bottom: 0px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .sectionRightBox{
|
|
|
|
+ width: 29.5%;
|
|
|
|
+ background: white;
|
|
|
|
+ margin-left: 12px;
|
|
|
|
+ height: 1023px;
|
|
|
|
+ .rightTop{
|
|
|
|
+
|
|
|
|
+ .optionRecordList{
|
|
|
|
+ margin: 20px;
|
|
|
|
+ padding: 10px 0;
|
|
|
|
+ box-sizing: border-box;
|
|
|
|
+ height: 928px;
|
|
|
|
+ // overflow: auto;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ position: relative;
|
|
|
|
+ p{
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
|
|
+ .content-item{
|
|
|
|
+ width: 70%;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ }
|
|
|
|
+ .time{
|
|
|
|
+ width: 30%;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
+ white-space: nowrap;
|
|
|
|
+ text-align: right;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .rightBottom{
|
|
|
|
+ margin-top: 12px;
|
|
|
|
+ background: white;
|
|
|
|
+ .burnDown{
|
|
|
|
+ padding: 30px 20px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ .tip{
|
|
|
|
+ margin-top: 40px;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-around;
|
|
|
|
+
|
|
|
|
+ height: 22px;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ color: rgba(0, 0, 0, 0.65);
|
|
|
|
+ line-height: 22px;
|
|
|
|
+ .done{
|
|
|
|
+ .item-icon{
|
|
|
|
+ width: 8px;
|
|
|
|
+ height: 8px;
|
|
|
|
+ background: #3BA0FF;
|
|
|
|
+ margin-right: 15px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .all{
|
|
|
|
+ .item-icon{
|
|
|
|
+ width: 8px;
|
|
|
|
+ height: 8px;
|
|
|
|
+ background: #F0F2F5;
|
|
|
|
+ margin-right: 15px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|
|
|
|
+
|
|
|
|
+<style lang="less">
|
|
|
|
+ .workBench{
|
|
|
|
+ .ant-timeline-item-head{
|
|
|
|
+ background: rgb(240,242,245);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+</style>
|