<!--首页管理--> <template> <div> <!--market--> <el-card v-if="task1.length!=0" style="width: 100%;height: 300px;"> <el-carousel :interval="3000" indicator-position="outside"> <el-carousel-item v-for="(item,index) in task1" :key="index"> <div style="display: flex;justify-content: space-between;"> <span style="float:left;margin-top: 40px;width: 86px;font-size: 16px;margin-left: 10%">等待处理</span> <el-link type="primary" @click="ListClick" style="margin-right: 10%">查看更多>></el-link> </div> <div style="clear: both"> <h1 style="margin-top:10px;float:left;margin-left:32px;width: 423px;height: 26px;;font-weight: bold;font-size: 20px;margin-left: 10%">订单名称:{{item.id}}</h1> <p style="margin-top: 20px;font-size: 21px;margin-left:32px;font-size: 16px;float: right;margin-right: 10%;">状态:{{item.status_name}}</p> </div> <div style="clear: both"> <p style="float:left;width: 275px;height: 21px;font-size: 14px;color: #707070;margin-left: 10%;">创建时间:{{item.created_at}}</p> </div> <div style="clear: both;display: flex;justify-content: space-between;"> <p style="float:left;width: 275px;height: 21px;font-size: 16px;margin-left:10%;">账号:{{item.account.name}}</p> <el-button type="primary" style="width: 98px;margin-right: 10%;" @click="ListClick" >去审核</el-button> </div > </el-carousel-item> </el-carousel> </el-card> <el-card v-if="order1.length!=0" style="width: 100%;height: 300px;"> <el-carousel :interval="3000" indicator-position="outside"> <el-carousel-item v-for="(item,index) in order1" :key="index"> <div style="display: flex;justify-content: space-between;"> <span style="float:left;margin-top: 40px;width: 86px;font-size: 16px;margin-left: 10%">等待处理</span> <el-link type="primary" @click="ListClick" style="margin-right: 10%">查看更多>></el-link> </div> <div style="clear: both"> <h1 style="margin-top:10px;float:left;margin-left:32px;width: 423px;height: 26px;;font-weight: bold;font-size: 20px;margin-left: 10%">订单名称:{{item.id}}</h1> <p style="margin-top: 20px;font-size: 21px;margin-left:32px;font-size: 16px;float: right;margin-right: 10%;">状态:{{item.status_name}}</p> </div> <div style="clear: both"> <p style="float:left;width: 275px;height: 21px;font-size: 14px;color: #707070;margin-left: 10%;">创建时间:{{item.created_at}}</p> </div> <div style="clear: both;display: flex;justify-content: space-between;"> <p style="float:left;width: 275px;height: 21px;font-size: 16px;margin-left:10%;">账号:{{item.name}}</p> <el-button type="primary" style="width: 98px;margin-right: 10%;" @click="ListClick" >去审核</el-button> </div > </el-carousel-item> </el-carousel> </el-card> <el-card v-if="task_status"> <div style="display: flex;justify-content: space-between"> <h1 style="float: left;margin-top: 34px;margin-left: 32px;">我的订单</h1> <el-button type="primary" @click="ListClick" >订单列表</el-button> </div> <div style="width: 100%;clear: both;display: flex;justify-content: center"> <ul style="float:left;width: 100%;"> <li style="float:left;list-style: none;border-right:1px solid #000000;;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.completed}}</h1><h1 style="font-size:20px;text-align: center;">待审核</h1></li> <li style="float:left;list-style: none;border-right:1px solid #000000;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.release}}</h1><h1 style="font-size:20px;text-align: center;">待修改</h1></h1></li> <li style="float:left;list-style: none;border-right:1px solid #000000;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.returned}}</h1><h1 style="font-size:20px;text-align: center;">进行中</h1></h1></li> <li style="float:left;list-style: none;border-right:1px solid #000000;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.underway}}</h1><h1 style="font-size:20px;text-align: center;">待结算</h1></h1></li> <li style="float:left;list-style: none;border-right:1px solid #000000;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.wait_confirm}}</h1><h1 style="font-size:20px;text-align: center;">已完成</h1></li> <li style="float:left;list-style: none;border-right:none;width: 16%;text-align: center"><h1 style="font-size:30px;text-align: center">{{task_status.wait_relevance}}</h1><h1 style="font-size:20px;text-align: center;">已取消</h1></li> </ul> </div> </el-card> <el-card v-if="order_status&&this.ModeEevent==0"> <div style="display: flex;justify-content: space-between"> <h1 style="float: left;margin-top: 34px;margin-left: 32px;">我的任务</h1> <el-button type="primary" @click="TaskClick" >任务列表</el-button> </div> <div style="width: 100%;clear: both;display: flex;justify-content: center"> <ul style="float:left;width: 100%;"> <li style="float:left;list-style: none;width: 16%;border-right:1px solid #000000;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.completed}}</h1><h1 style="font-size:20px;text-align: center;">已完成</h1></li> <li style="float:left;list-style: none;width: 16%;border-right:1px solid #000000;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.for_the}}</h1><h1 style="font-size:20px;text-align: center;">待修改</h1></li> <li style="float:left;list-style: none;width: 16%;border-right:1px solid #000000;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.modify}}</h1><h1 style="font-size:20px;text-align: center;">进行中</h1></li> <li style="float:left;list-style: none;width: 16%;border-right:1px solid #000000;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.underway}}</h1><h1 style="font-size:20px;text-align: center;">待结算</h1></li> <li style="float:left;list-style: none;width: 16%;border-right:1px solid #000000;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.wait_confirm}}</h1><h1 style="font-size:20px;text-align: center;">已完成</h1></li> <li style="float:left;list-style: none;width: 16%;border-right:none;;text-align: center"><h1 style="font-size:30px;text-align: center">{{order_status.underway}}</h1><h1 style="font-size:20px;text-align: center;">已取消</h1></li> </ul> </div> </el-card> </div> </template> <script> import 'swiper/swiper-bundle.css' // import style (<= Swiper 5.x) import 'swiper/swiper.scss' import {getAction} from "@/api"; import {SET_MODE} from "@/store/mutation-types"; import Vue from "vue"; export default { name: "Home", data(){ return{ task1:[], task_status:{ }, order_status:{ }, order1:[], ModeEeventCheck:-1, } }, computed:{ ModeEevent(){ return this.$store.state.mode } }, methods:{ ListClick(){ this.$router.push('/order') }, TaskClick(){ this.$router.push('/task') }, }, created() { console.log(this.ModeEevent) if(this.ModeEevent==0) { getAction("/home/market").then(res => { this.order1=res.data.order this.task_status=res.data.task_status this.order_status=res.data.order_status this.ModeEeventCheck=this.ModeEevent console.log(res.data.order) for(var item in this.order1){ console.log(this.order1[item].id) } }) }else{ getAction("/home/business").then(res=>{ /*console.log(res)*/ this.task1=res.data.task this.task_status=res.data.task_status this.ModeEeventCheck=this.ModeEevent console.log(res.data.task) for(var item in this.task1){ console.log(this.task1[item].id) } }) } } }; </script> <style scoped> .el-carousel__item h3 { color: #475669; font-size: 18px; opacity: 0.75; line-height: 300px; margin: 0; } .el-button{ height: 40px; } .el-carousel__item:nth-child(2n) { background-color: white; } .el-carousel__item:nth-child(2n+1) { background-color: white; } </style>