Browse Source

直播课堂 部分页面

bzkf3 2 years ago
parent
commit
fcd3c4003d

+ 1 - 0
package.json

@@ -9,6 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@element-plus/icons-vue": "^2.0.9",
     "@vueuse/core": "^9.1.0",
     "axios": "^0.27.2",
     "dayjs": "^1.11.5",

+ 2 - 0
pnpm-lock.yaml

@@ -1,6 +1,7 @@
 lockfileVersion: 5.4
 
 specifiers:
+  '@element-plus/icons-vue': ^2.0.9
   '@iconify/json': ^2.1.92
   '@vitejs/plugin-vue': ^3.0.3
   '@vueuse/core': ^9.1.0
@@ -18,6 +19,7 @@ specifiers:
   windicss: ^3.5.6
 
 dependencies:
+  '@element-plus/icons-vue': 2.0.9_vue@3.2.37
   '@vueuse/core': 9.1.0_vue@3.2.37
   axios: 0.27.2
   dayjs: 1.11.5

src/assets/直播课堂/理财知识@2x.png → src/assets/zbkt/bar.png


src/assets/直播课堂/卡通校园小学生课程表海报展板模板-02@2x.png → src/assets/zbkt/kcb.png


src/assets/直播课堂/多人,团队,用户_jurassic@2x.png → src/assets/zbkt/ssys.png


src/assets/直播课堂/fill_直播@2x.png → src/assets/zbkt/wlzb.png


src/assets/直播课堂/UI_icon2_专题图1@2x.png → src/assets/zbkt/ztzb.png


BIN
src/assets/zbktssys/1.png


BIN
src/assets/zbktssys/2.png


BIN
src/assets/zbktssys/3.png


BIN
src/assets/zbktssys/bar.png


BIN
src/assets/zbktssys/tx.png


BIN
src/assets/直播课堂/UI_icon2_专题图1.png


BIN
src/assets/直播课堂/fill_直播.png


BIN
src/assets/直播课堂/卡通校园小学生课程表海报展板模板-02.png


BIN
src/assets/直播课堂/多人,团队,用户_jurassic.png


BIN
src/assets/直播课堂/理财知识.png


BIN
src/assets/直播课堂/矩形.png


BIN
src/assets/直播课堂/矩形@2x.png


+ 11 - 9
src/pages/zbkt/index.vue

@@ -1,9 +1,9 @@
 <script setup>
-import img_lczs from '~/assets/直播课堂/理财知识@2x.png';
-import img_ssys from '~/assets/直播课堂/多人,团队,用户_jurassic@2x.png';
-import img_wlzb from '~/assets/直播课堂/fill_直播@2x.png';
-import img_ztzb from '~/assets/直播课堂/UI_icon2_专题图1@2x.png';
-import img_kcb1 from '~/assets/直播课堂/卡通校园小学生课程表海报展板模板-02@2x.png';
+import img_lczs from '~/assets/zbkt/bar.png';
+import img_ssys from '~/assets/zbkt/ssys.png';
+import img_wlzb from '~/assets/zbkt/wlzb.png';
+import img_ztzb from '~/assets/zbkt/ztzb.png';
+import img_kcb1 from '~/assets/zbkt/kcb.png';
 
 const router = useRouter()
 function routeTo(url) {
@@ -17,7 +17,7 @@ function routeTo(url) {
   <div class="flex flex-col w-full items-center">
     <div class="w-full mb-20"><img :src="img_lczs" alt="" class="w-full" /></div>
 
-    <div class="flex justify-between w-1200px mb-20">
+    <div class="flex justify-between w-1400px mb-20">
 
       <div @click="routeTo('/zbkt/ssys')"
         class=" flex shadow-md w-350px h-140px cursor-pointer transform hover:-translate-y-2 rounded-md px-6 py-12">
@@ -32,7 +32,8 @@ function routeTo(url) {
 
 
 
-      <div class=" flex shadow-md w-350px h-140px cursor-pointer transform hover:-translate-y-2 rounded-md px-6 py-12">
+      <div @click="routeTo('/zbkt/wlzb')"
+        class=" flex shadow-md w-350px h-140px cursor-pointer transform hover:-translate-y-2 rounded-md px-6 py-12">
         <div class="w-8 mr-8">
           <img :src="img_wlzb" alt="">
         </div>
@@ -44,7 +45,8 @@ function routeTo(url) {
 
 
 
-      <div class=" flex shadow-md w-350px h-140px cursor-pointer transform hover:-translate-y-2 rounded-md px-6 py-12">
+      <div @click="routeTo('/zbkt/ztzb')"
+        class=" flex shadow-md w-350px h-140px cursor-pointer transform hover:-translate-y-2 rounded-md px-6 py-12">
         <div class="w-8 mr-8">
           <img :src="img_ztzb" alt="">
         </div>
@@ -55,7 +57,7 @@ function routeTo(url) {
       </div>
     </div>
 
-    <div class="w-1200px flex justify-center mb-20">
+    <div class="w-1400px flex justify-center mb-20">
       <el-carousel class="w-1133px h-637px" height="637px">
         <el-carousel-item v-for="item in 3" :key="item">
           <img :src="img_kcb1" />

+ 91 - 8
src/pages/zbkt/ssys/index.vue

@@ -1,4 +1,11 @@
 <script setup>
+import img_lczs1 from '~/assets/zbktssys/1.png';
+import img_lczs2 from '~/assets/zbktssys/2.png';
+import img_lczs3 from '~/assets/zbktssys/3.png';
+import img_lczs from '~/assets/zbktssys/bar.png';
+import img_tx from '~/assets/zbktssys/tx.png';
+
+import { View as IconView, Histogram as IconHistogram, Search as IconSearch } from '@element-plus/icons-vue';
 const activeTab = $ref('first')
 function handleClick() {
 
@@ -28,12 +35,21 @@ const fc = [
   { n: '下册', v: '' },
 ]
 
+const data = $ref([
+  { img: img_lczs1, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '1' },
+  { img: img_lczs2, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+])
+
 
+function hrefTo(href) {
+  window.open(href, '_blank')
+}
 </script>
 
 <template>
   <div class="w-full flex items-center justify-center shadow-sm h-60px">
-    <div class="w-1200px flex items-center">
+    <div class="w-1400px flex items-center">
       <div class="text-lg text-hex-050026">双师一生</div>
       <el-divider direction="vertical" />
       <div class="text-sm">
@@ -43,10 +59,25 @@ const fc = [
     </div>
   </div>
 
+  <div class="w-full relative h-200px">
+    <img :src="img_lczs" alt="" class="w-full h-full">
+    <div class="w-full h-full absolute top-0 z-2 flex flex-col items-center justify-evenly">
+      <div class="text-hex-fff text-5xl">双师一生</div>
+      <el-input class="input w-500px h-50px rounded-md" placeholder="搜索关键字">
+        <template #suffix>
+          <div class="w-26px h-26px bg-hex-00A3FF rounded-md flex justify-center items-center">
+            <el-icon size="13" color="#fff">
+              <IconSearch />
+            </el-icon>
+          </div>
+        </template>
+      </el-input>
+    </div>
+  </div>
 
-  <div class="w-full flex items-center justify-center ">
-    <div class="w-1200px flex flex-col">
-      <div class="w-full bg-hex-fff">
+  <div class="w-full flex items-center justify-center mt-4">
+    <div class="w-1400px flex flex-col">
+      <div class="w-full">
         <el-tabs v-model="activeTab" @tab-click="handleClick">
           <el-tab-pane label="待开始" name="first"></el-tab-pane>
           <el-tab-pane label="已结束" name="second"></el-tab-pane>
@@ -57,8 +88,8 @@ const fc = [
       <div>
         <div class="flex">
           <div class="font-bold mr-4">年级</div>
-          <div>
-            <label v-for="i in nj" :for="i.v" class="text-hex-949494 mx-2 px-4px py-px rounded cursor-pointer"
+          <div class="flex-auto flex-wrap">
+            <label v-for="i in nj" :for="i.v" class="text-hex-949494 mx-3 px-4px py-px rounded cursor-pointer"
               :class="i.v && 'text-hex-00A3FF bg-hex-00A3FF bg-opacity-10'">
               <span>{{ i.n }}</span>
             </label>
@@ -68,8 +99,8 @@ const fc = [
 
         <div class="flex">
           <div class="font-bold mr-4">分册</div>
-          <div>
-            <label v-for="i in fc" :for="i.v" class="text-hex-949494 mx-2 px-4px py-px rounded cursor-pointer"
+          <div class="flex-auto">
+            <label v-for="i in fc" :for="i.v" class="text-hex-949494 mx-3 px-4px py-px rounded cursor-pointer"
               :class="i.v && 'text-hex-00A3FF bg-hex-00A3FF bg-opacity-10'">
               <span>{{ i.n }}</span>
             </label>
@@ -77,6 +108,53 @@ const fc = [
           </div>
         </div>
       </div>
+
+      <div class="flex flex-wrap justify-between">
+        <div class="w-647px h-155px rounded-xl shadow-lg my-7 flex overflow-hidden" v-for="i in data">
+          <div class="w-264px h-full flex-none">
+            <img :src="i.img" alt="" class="w-full h-full">
+          </div>
+          <div class="p-2 pr-6 flex-auto flex flex-col">
+            <div class="flex justify-between w-full items-center py-1">
+              <div class="font-bold">{{ i.title }}</div>
+              <div class="text-hex-949494 text-sm flex justify-between items-center">
+                <el-icon :size="14" color="#949494">
+                  <icon-view />
+                </el-icon>
+                <span class="ml-1">{{ i.bfl }}</span>
+              </div>
+            </div>
+
+            <div class="text-sm text-hex-949494 py-1">
+              {{ i.desc }}
+            </div>
+
+            <div class="text-sm py-1 flex-auto">
+              <span>{{ i.nj }}</span>
+              <span class="mx-2">|</span>
+              <span>{{ i.xk }}</span>
+            </div>
+
+            <div class="flex text-sm justify-between items-center">
+              <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxb&stream=18_2')"
+                class="cursor-pointer flex items-center">
+                <el-avatar :size="16" :src="i.tx" /><span class="ml-1">{{ i.ls }}</span>
+              </div>
+              <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxa&stream=18')"
+                class="h-26px rounded-14px px-2 flex items-center text-hex-0083C5 cursor-pointer"
+                :class="i.zt && 'border border-hex-f00 text-hex-f00'">
+                <el-icon :color="i.zt ? '#FF0000' : '#949494'">
+                  <icon-histogram />
+                </el-icon>
+                <span class="ml-2 "> {{ i.zt ? '已开始' : '未开始' }}</span>
+              </div>
+              <div class="h-26px leading-26px px-4 bg-gradient-to-l from-green-400 to-blue-500 text-white rounded-14px">
+                讲义</div>
+            </div>
+
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -89,4 +167,9 @@ const fc = [
 :deep(.el-tabs__nav-wrap::after) {
   background-color: transparent;
 }
+
+.input {
+  height: 50px;
+  width: 500px;
+}
 </style>

+ 184 - 0
src/pages/zbkt/wlzb/index.vue

@@ -0,0 +1,184 @@
+<script setup>
+import img_lczs1 from '~/assets/zbktssys/1.png';
+import img_lczs2 from '~/assets/zbktssys/2.png';
+import img_lczs3 from '~/assets/zbktssys/3.png';
+import img_lczs from '~/assets/zbktssys/bar.png';
+import img_tx from '~/assets/zbktssys/tx.png';
+import { View as IconView, Histogram as IconHistogram, Search as IconSearch } from '@element-plus/icons-vue';
+const activeTab = $ref('first')
+function handleClick() {
+
+}
+
+const nj = [
+  { n: '全部', v: '1' },
+  { n: '幼儿园', v: '' },
+  { n: '一年级', v: '' },
+  { n: '二年级', v: '' },
+  { n: '三年级', v: '' },
+  { n: '四年级', v: '' },
+  { n: '五年级', v: '' },
+  { n: '六年级', v: '' },
+  { n: '初一', v: '' },
+  { n: '初二', v: '' },
+  { n: '初三', v: '' },
+  { n: '高一', v: '' },
+  { n: '高二', v: '' },
+  { n: '高三', v: '' },
+  { n: '其他', v: '' },
+]
+
+const fc = [
+  { n: '全部', v: '1' },
+  { n: '上册', v: '' },
+  { n: '下册', v: '' },
+]
+
+const data = $ref([
+  { img: img_lczs1, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '1' },
+  { img: img_lczs2, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '1' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '领略生肖传奇,品味传统文化!', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '1' },
+])
+
+
+function hrefTo(href) {
+  window.open(href, '_blank')
+}
+</script>
+
+<template>
+  <div class="w-full flex items-center justify-center shadow-sm h-60px">
+    <div class="w-1400px flex items-center">
+      <div class="text-lg text-hex-050026">网络直播</div>
+      <el-divider direction="vertical" />
+      <div class="text-sm">
+        <span class="text-hex-949494">直播课堂</span>
+        <span> - 网络直播</span>
+      </div>
+    </div>
+  </div>
+
+  <div class="w-full relative h-200px">
+    <img :src="img_lczs" alt="" class="w-full h-full">
+    <div class="w-full h-full absolute top-0 z-2 flex flex-col items-center justify-evenly">
+      <div class="text-hex-fff text-5xl">网络直播</div>
+      <el-input class="input w-500px h-50px rounded-md overflow-hidden" placeholder="搜索关键字">
+        <template #suffix>
+          <div class="w-26px h-26px bg-hex-00A3FF rounded-md flex justify-center items-center">
+            <el-icon size="13" color="#fff">
+              <IconSearch />
+            </el-icon>
+          </div>
+        </template>
+      </el-input>
+    </div>
+  </div>
+
+  <div class="w-full flex items-center justify-center mt-4">
+    <div class="w-1400px flex flex-col">
+      <div>
+        <div class="flex">
+          <div class="font-bold mr-4">年级</div>
+          <div class="flex-auto flex-wrap">
+            <label v-for="i in nj" :for="i.v" class="text-hex-949494 mx-3 px-4px py-px rounded cursor-pointer"
+              :class="i.v && 'text-hex-00A3FF bg-hex-00A3FF bg-opacity-10'">
+              <span>{{ i.n }}</span>
+            </label>
+            <div class="border_b my-4"></div>
+          </div>
+        </div>
+
+        <div class="flex">
+          <div class="font-bold mr-4">分册</div>
+          <div class="flex-auto">
+            <label v-for="i in fc" :for="i.v" class="text-hex-949494 mx-3 px-4px py-px rounded cursor-pointer"
+              :class="i.v && 'text-hex-00A3FF bg-hex-00A3FF bg-opacity-10'">
+              <span>{{ i.n }}</span>
+            </label>
+            <div class="border_b my-4"></div>
+          </div>
+        </div>
+      </div>
+
+
+      <div class="text-lg font-bold mt-7 mb-3">正在直播</div>
+      <div class="flex flex-wrap justify-between">
+        <div class="w-647px h-155px rounded-xl shadow-lg mb-7 flex" v-for="i in data">
+          <div class="w-264px h-full flex-none">
+            <img :src="i.img" alt="" class="w-full h-full">
+          </div>
+          <div class="p-2 pr-6 flex-auto flex flex-col">
+            <div class="flex justify-between w-full items-center py-1">
+              <div class="font-bold">{{ i.title }}</div>
+              <div class="text-hex-949494 text-sm flex justify-between items-center">
+                <el-icon :size="14" color="#949494">
+                  <icon-view />
+                </el-icon>
+                <span class="ml-1">{{ i.bfl }}</span>
+              </div>
+            </div>
+
+            <div class="text-sm text-hex-949494 py-1">
+              {{ i.desc }}
+            </div>
+
+            <div class="text-sm py-1 flex-auto">
+              <span>{{ i.nj }}</span>
+              <span class="mx-2">|</span>
+              <span>{{ i.xk }}</span>
+            </div>
+
+            <div class="flex text-sm justify-between items-center">
+              <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxb&stream=18_2')"
+                class="cursor-pointer flex items-center">
+                <el-avatar :size="16" :src="i.tx" /><span class="ml-1">{{ i.ls }}</span>
+              </div>
+              <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxa&stream=18')"
+                class="h-26px rounded-14px px-2 flex items-center text-hex-0083C5 cursor-pointer"
+                :class="i.zt && 'border border-hex-f00 text-hex-f00'">
+                <el-icon :color="i.zt ? '#FF0000' : '#949494'">
+                  <icon-histogram />
+                </el-icon>
+                <span class="ml-2 "> {{ i.zt ? '直播中' : '未开始' }}</span>
+              </div>
+              <!-- <div class="h-26px leading-26px px-4 bg-gradient-to-l from-green-400 to-blue-500 text-white rounded-14px">
+                讲义</div> -->
+            </div>
+
+          </div>
+        </div>
+      </div>
+
+
+      <div class="flex w-full justify-between">
+        <div class="flex-auto mr-8">
+          <div class="text-lg font-bold mt-7 mb-3">推荐直播</div>
+          <div class="flex flex-wrap justify-between">
+            <div class="w-318px h-263px rounded-xl shadow-lg mb-7 flex flex-col overflow-hidden" v-for="i in data">
+              <div class="w-full flex-none">
+                <img :src="i.img" alt="" class="w-full h-full">
+              </div>
+              <div class="p-2">
+                {{ i.title }}
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div class="w-320px shadow flex-none"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.border_b {
+  border-bottom: 1px solid #E4E6E8;
+}
+
+
+.input {
+  height: 50px;
+  width: 500px;
+}
+</style>

+ 121 - 0
src/pages/zbkt/ztzb/index.vue

@@ -0,0 +1,121 @@
+<script setup>
+import { View as IconView, Histogram as IconHistogram, Search as IconSearch } from '@element-plus/icons-vue';
+
+import img_lczs1 from '~/assets/zbktssys/1.png';
+import img_lczs2 from '~/assets/zbktssys/2.png';
+import img_lczs3 from '~/assets/zbktssys/3.png';
+import img_lczs from '~/assets/zbktssys/bar.png';
+import img_tx from '~/assets/zbktssys/tx.png';
+
+function hrefTo(href) {
+  window.open(href, '_blank')
+}
+
+const data = $ref([
+  { img: img_lczs1, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '1' },
+  { img: img_lczs2, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+  { img: img_lczs3, title: '走进生肖文化——寅虎卯兔', bfl: 100, desc: '主讲人(单位):桐乡市艺术网校', desc1: '直播时间:2022-06-14', nj: '四年级', xk: '美术', ls: '尚老师', tx: img_tx, zt: '' },
+])
+</script>
+
+<template>
+  <div class="w-full flex items-center justify-center shadow-sm h-60px">
+    <div class="w-1400px flex items-center">
+      <div class="text-lg text-hex-050026">专题直播</div>
+      <el-divider direction="vertical" />
+      <div class="text-sm">
+        <span class="text-hex-949494">直播课堂</span>
+        <span> - 专题直播</span>
+      </div>
+    </div>
+  </div>
+  <div class="w-full relative h-200px">
+    <div class="w-full h-full bg_linear" />
+    <div class="w-full h-full absolute top-0 z-2 flex flex-col items-center justify-evenly">
+      <div class="text-5xl">专题直播, 搜索一下</div>
+      <el-input class="input w-500px h-50px rounded-md" placeholder="搜索关键字">
+        <template #suffix>
+          <div class="w-26px h-26px bg-hex-00A3FF rounded-md flex justify-center items-center">
+            <el-icon size="13" color="#fff">
+              <IconSearch />
+            </el-icon>
+          </div>
+        </template>
+      </el-input>
+      <div class="flex text-dark-200 divide-dark-200 divide-x">
+        <div class="px-2">微课</div>
+        <div class="px-2">课件</div>
+        <div class="px-2">教案</div>
+        <div class="px-2">微视频</div>
+        <div class="px-2">网络资源</div>
+      </div>
+    </div>
+  </div>
+
+  <div class="flex justify-center">
+    <div class="flex flex-wrap justify-between w-1400px">
+      <div class="w-647px h-155px rounded-xl shadow-lg my-7 flex overflow-hidden" v-for="i in data">
+        <div class="w-264px h-full flex-none">
+          <img :src="i.img" alt="" class="w-full h-full">
+        </div>
+        <div class="p-2 pr-6 flex-auto flex flex-col">
+          <div class="flex justify-between w-full items-center py-1">
+            <div class="font-bold">{{ i.title }}</div>
+            <div class="text-hex-949494 text-sm flex justify-between items-center">
+              <el-icon :size="14" color="#949494">
+                <icon-view />
+              </el-icon>
+              <span class="ml-1">{{ i.bfl }}</span>
+            </div>
+          </div>
+
+          <div class="text-sm text-hex-949494 py-1">
+            <div> {{ i.desc }}</div>
+            <div> {{ i.desc1 }}</div>
+          </div>
+
+
+          <div class="text-sm py-1 flex-auto">
+            课程介绍: 蓝印花布 蓝印花布 蓝印花布 蓝印花布……
+          </div>
+
+
+          <div class="flex text-sm justify-between items-center">
+            <!-- <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxb&stream=18_2')"
+              class="cursor-pointer flex items-center">
+              <el-avatar :size="16" :src="i.tx" /><span class="ml-1">{{ i.ls }}</span>
+            </div>
+            <div @click="hrefTo('https://rtc.bozedu.net/index.html?uroom=18&uname=txsxnxxa&stream=18')"
+              class="h-26px rounded-14px px-2 flex items-center text-hex-0083C5 cursor-pointer"
+              :class="i.zt && 'border border-hex-f00 text-hex-f00'">
+              <el-icon :color="i.zt ? '#FF0000' : '#949494'">
+                <icon-histogram />
+              </el-icon>
+              <span class="ml-2 "> {{ i.zt ? '已开始' : '未开始' }}</span>
+            </div> -->
+            <div class="h-26px leading-26px px-4 bg-gradient-to-l from-green-400 to-blue-500 text-white rounded-14px">
+              观看回放</div>
+          </div>
+
+        </div>
+      </div>
+    </div>
+  </div>
+
+</template>
+
+<style scoped>
+.input {
+  height: 50px;
+  width: 500px;
+}
+
+.bg_linear {
+  opacity: 0.59;
+  background: linear-gradient(72deg, rgba(0, 163, 255, 0.00) 18%, rgba(221, 254, 238, 0.57) 64%, rgba(255, 247, 228, 0.89) 100%);
+  filter: blur(50px);
+}
+</style>

+ 18 - 0
src/router/index.js

@@ -23,6 +23,24 @@ export default createRouter({
 							component: () => import("~/pages/zbkt/ssys/index.vue"),
 						},
 					]
+				},
+				{
+					path: 'wlzb',
+					children: [
+						{
+							path: '',
+							component: () => import("~/pages/zbkt/wlzb/index.vue"),
+						},
+					]
+				},
+				{
+					path: 'ztzb',
+					children: [
+						{
+							path: '',
+							component: () => import("~/pages/zbkt/ztzb/index.vue"),
+						},
+					]
 				}
 			]
 		},

+ 5 - 2
vite.config.js

@@ -42,7 +42,9 @@ export default defineConfig({
         'src/store',
         'src/utils',
       ],
-      resolvers: [ElementPlusResolver()],
+      resolvers: [
+        ElementPlusResolver(),
+      ],
       vueTemplate: true,
     }),
     Components({
@@ -52,7 +54,7 @@ export default defineConfig({
       extensions: ['vue', 'md'],
       // allow auto import and register components used in markdown
       include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
-      resolvers: [IconsResolver(),ElementPlusResolver()],
+      resolvers: [IconsResolver(), ElementPlusResolver()],
     }),
     Icons({
       compiler: 'vue3',
@@ -63,6 +65,7 @@ export default defineConfig({
     host: true
   },
   build: {
+    assetsInlineLimit: 1024 * 1000,
     rollupOptions: {
       output: {
         manualChunks: {