<!--首頁管理--> <template><div><el-card><h1>等待處理</h1><div style="width: 100%;height: 200px"><swiper ref="mySwiper" ><swiper-slide v-for="(item,index) in task"><el-button style="float: right" type="primary" @click="ListClick">查看更多</el-button><h1>訂單名稱:{{item.name}}</h1><p>創建時間:{{item.created_at}}</p><p>賬號:{{item.name}}</p><p>狀態:{{item.status_name}}</p><el-button type="primary" style="float: right" @click="ListClick">審核</el-button><!-- Add Pagination --></swiper-slide><hr><div class="swiper-pagination" slot="pagination"></div></swiper></div></el-card><el-card><h1 style="float: left">我的訂單</h1><el-button style="float: right" type="primary" @click="ListClick" >訂單列表</el-button><ul style="display: flex;justify-content: center"><li style="float: left;list-style: none"><p>待審核:</p><h1>{{task_status.completed}}</h1></li><li style="float: left;list-style: none"><p>待修改:</p><h1>{{task_status.release}}</h1></li><li style="float: left;list-style: none"><p>進行中:</p><h1>{{task_status.returned}}</h1></li><li style="float: left;list-style: none"><p>待結算:</p><h1>{{task_status.underway}}</h1></li><li style="float: left;list-style: none"><p>已完成:</p><h1>{{task_status.wait_confirm}}</h1></li><li style="float: left;list-style: none"><p>已取消:</p><h1>{{task_status.wait_relevance}}</h1></li></ul><!-- <div style="float: left"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div><div style="float: left"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div><div style="float: left;"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div>--></el-card><el-card><h1 style="float: left">我的訂單</h1><el-button style="float: right" type="primary" @click="TaskClick">任務列表</el-button><ul style="display: flex;justify-content: center"><li style="float: left;list-style: none"><p>待審核:</p><h1>{{task_status.completed}}</h1></li><li style="float: left;list-style: none"><p>待修改:</p><h1>{{task_status.release}}</h1></li><li style="float: left;list-style: none"><p>進行中:</p><h1>{{task_status.returned}}</h1></li><li style="float: left;list-style: none"><p>待結算:</p><h1>{{task_status.underway}}</h1></li><li style="float: left;list-style: none"><p>已完成:</p><h1>{{task_status.wait_confirm}}</h1></li><li style="float: left;list-style: none"><p>已取消:</p><h1>{{task_status.wait_relevance}}</h1></li></ul><!-- <div style="float: left"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div><div style="float: left"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div><div style="float: left;"><img src="./geyao.png" style="width: 40px;height: 40px" alt=""><p>hi暖視頻</p></div>--></el-card></div> </template><script> import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper' // import style (>= Swiper 6.x) import 'swiper/swiper-bundle.css' // import style (<= Swiper 5.x) import 'swiper/swiper.scss' import {getAction} from "@/api";export default {name: "Home",components: {Swiper,SwiperSlide},directives: {swiper: directive},data(){return{task:[],task_status:{}}},methods:{ListClick(){this.$router.push('/order')},TaskClick(){this.$router.push('/task')}},created() {getAction("/home/business").then(res=>{console.log(res)this.task=res.data.taskthis.task_status=res.data.task_status})} }; </script> <style scoped></style>

?

總結

以上是生活随笔為你收集整理的工作108:swiper使用的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。