From 95a27fe55990ca151cbe08f99cbeb669b4cb9dd8 Mon Sep 17 00:00:00 2001 From: ZhangXianQiang <1135831638@qq.com> Date: 星期四, 20 六月 2024 17:07:16 +0800 Subject: [PATCH] fix:修改在线培训 --- src/views/train/data-list/index.vue | 98 +++++++++++++++++++++++++++++++++--------------- 1 files changed, 67 insertions(+), 31 deletions(-) diff --git a/src/views/train/data-list/index.vue b/src/views/train/data-list/index.vue index 965749d..a3e3a16 100644 --- a/src/views/train/data-list/index.vue +++ b/src/views/train/data-list/index.vue @@ -1,38 +1,40 @@ <template> <div class="list-container w-full h-full"> - <div class="list-content w-full overflow-x-hidden"> - <el-row :gutter="20"> - <el-col :span="6" v-for="item in dataList" class="mb-5"> - <el-card shadow="hover" class="list-card cursor-pointer" :body-style="{ padding: 0 }"> - <div class="img-container w-full"> - <img src="@/assets/list-card-bg.jpg" class="w-full"> + <div class="list-content w-full overflow-x-hidden"> + <el-row :gutter="20"> + <el-col :span="6" v-for="item in dataList" class="margin-col"> + <el-card shadow="hover" class="list-card cursor-pointer" :body-style="{ padding: 0 }"> + <div class="img-container w-full"> + <img src="@/assets/list-card-bg.jpg" class="width-img"> + </div> + <div class="item-info p-3"> + <div class="info-title">{{ item.title }}</div> + <div class="info-teacher"> + <div class="info-label">涓昏:</div> + <div class="info-text">{{ item.teacher }}</div> </div> - <div class="item-info p-3"> - <div class="info-title font-bold">{{ item.title }}</div> - <div class="info-teacher flex text-sm text-gray-500"> - <div class="info-label">涓昏:</div> - <div class="info-text">{{ item.teacher }}</div> - </div> - <div class="info-time flex text-sm text-gray-500"> - <div class="info-label">寮�濮嬫椂闂�:</div> - <div class="info-text">{{ item.startTime }}</div> - </div> - <div class="info-time flex text-sm text-gray-500"> - <div class="info-label">缁撴潫鏃堕棿:</div> - <div class="info-text">{{ item.endTime }}</div> - </div> + <div class="info-time"> + <div class="info-label">寮�濮嬫椂闂�:</div> + <div class="info-text">{{ item.startTime }}</div> </div> - <el-button size="mini" @click="start" >寮�濮嬩笂璇�</el-button> - </el-card> - </el-col> - </el-row> - </div> + <div class="info-time"> + <div class="info-label">缁撴潫鏃堕棿:</div> + <div class="info-text">{{ item.endTime }}</div> + </div> + <div class="button-container"> + <el-button @click="start">寮�濮嬩笂璇�</el-button> + </div> + </div> + </el-card> + </el-col> + </el-row> + </div> </div> </template> <script> export default { - data () { + data() { return { dataList: [ { @@ -71,15 +73,18 @@ roomName: 'test' } ] - } + }; }, methods: { - start(){ - // this.$router.push({path:'/train/meet/index'}) - window.open('https://ycl.easyblog.vip:8443/test'); + start () { + let routeUrl = this.$router.resolve({ + path: "/meet", + }) + window.open(routeUrl.href, '_blank') + // window.open('https://ycl.easyblog.vip:8443/test'); } } -} +}; </script> <style lang="scss" scoped> @@ -103,4 +108,35 @@ .list-card { border-radius: 10px; } + +.item-info { + padding: 12px; + color: #8a8a8a; +} + +.info-title { + font-weight: bold; +} + +.info-teacher { + display: flex; + font-size: 14px; +} + +.info-time { + display: flex; +} + +.margin-col { + margin-bottom: 20px; +} + +.width-img { + width: 100%; +} + +.button-container { + display: flex; + margin-top: 10px; +} </style> -- Gitblit v1.8.0