云广播

2022-06-09 14:10:23 +08:00
parent 51fb3d0c6a
commit 164d1d1b0e
55 changed files with 13 additions and 5 deletions
--- a/src/apps/AppBroadcast1/AppResourcesManage/detail.vue
+++ b/src/apps/AppBroadcast1/AppResourcesManage/detail.vue
@@ -0,0 +1,96 @@
+<template>
+  <div class="detail">
+    <div class="header">
+      <img :src="`${$cdn}video/play-icon.png`" alt="">
+      <div class="right">
+        <h2>五一活动唱红歌.mp3</h2>
+        <p>2022-06-09 09:43:45</p>
+      </div>
+    </div>
+    <div class="content"></div>
+    <div class="footer-bottom"></div>
+    <div class="footer">
+      <div>删除素材</div>
+      <div class="confirm">发布广播</div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "detail"
+}
+</script>
+<style lang="scss" scoped>
+.detail {
+  padding-top: 8px;
+  .header {
+    margin: 0 0 32px 0;
+    width: 100%;
+    padding: 20px 30px 16px 30px;
+    box-sizing: border-box;
+    background: #FFF;
+    box-shadow: inset 0px 0px 0px 0px #D8DDE6;
+    display: flex;
+    img {
+      width: 56px;
+      height: 56px;
+      margin-right: 16px;
+    }
+    .right {
+      width: calc(100% - 72px);
+      font-family: PingFang-SC-Medium, PingFang-SC;
+      h2{
+        width: 100%;
+        font-size: 34px;
+        font-weight: 500;
+        color: #333;
+        line-height: 48px;
+        word-break: break-all;
+        margin-bottom: 8px;
+      }
+      p{
+        font-size: 26px;
+        font-weight: 500;
+        color: #999;
+        line-height: 36px;
+      }
+    }
+  }
+  .content{
+    padding: 32px;
+    font-size: 32px;
+    font-family: PingFangSC-Regular, PingFang SC;
+    color: #333;
+    line-height: 44px;
+    word-break: break-all;
+    background-color: #fff;
+  }
+
+  .footer-bottom{
+    height: 120px;
+  }
+
+  .footer {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 112px;
+    line-height: 112px;
+    display: flex;
+    div{
+      flex: 1;
+      font-size: 36px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #F46;
+      background-color: #fff;
+      text-align: center;
+    }
+    .confirm{
+      background: #3975C6;
+      color: #fff;
+    }
+  }
+}
+</style>