Merge branch 'master' of http://git.dayaedu.com/lex/dy-admin-live

src/components/live-broadcast/preview.tsx

@@ -3,6 +3,7 @@ import { ElButton, ElFormItem, ElForm, ElRadio } from 'element-plus'
 import runtime, * as RuntimeUtils from './runtime'
 import styles from './preview.module.less'
 import vueQr from 'vue-qr/src/packages/vue-qr.vue'
+
 export default defineComponent({
     name: 'LiveBroadcastSharePreview',
     props: ['form'],
@@ -16,6 +17,7 @@ export default defineComponent({
             url: "http://www.baidu.com",
         }
     },
+
     methods: {
         copyText() {
 
@@ -26,79 +28,84 @@ export default defineComponent({
     },
     render() {
         return (
-            <div>
-                <div class="first" v-if={this.form.preTemplate == 1}>
-                    <h2>{this.form.roomTitle}</h2>
-                    <p class="teacher">主讲人：{this.form.teacherName}</p>
-                    <img src="./images/icon1.png" class="icon" alt="" />
-                    <div class="preCore">
-                        <img src="./images/start.png" class="start" alt="" />
-                        <p class="title">开播时间</p>
-                        <p class="time">{this.form.liveStartTime}</p>
-                        <p class="title">直播内容</p>
-                        <div class="content">
-                            <img class="pre" src="./images/icon5.png" alt="" />
-                            <img class="end" src="./images/icon4.png" alt="" />
-                            {this.form.liveRemark}
-                        </div>
-                    </div>
-                    <div class="bottom">
-                        <img class="logo" src="./images/logo.png" alt="" />
-                        <div class="code">
-                            <div>
-                                <vue-qr text={this.url} style="width: 100%; margin='0'"></vue-qr>
+            <div id="preview">
+                {this.form.preTemplate === '1' ?
+                    <div class="first">
+                        <h2>{this.form.roomTitle}</h2>
+                        <p class="teacher">主讲人：{this.form.teacherName}</p>
+                        <img src="./images/icon1.png" class="icon" alt="" />
+                        <div class="preCore">
+                            <img src="./images/start.png" class="start" alt="" />
+                            <p class="title">开播时间</p>
+                            <p class="time">{this.form.liveStartTime}</p>
+                            <p class="title">直播内容</p>
+                            <div class="content">
+                                <img class="pre" src="./images/icon5.png" alt="" />
+                                <img class="end" src="./images/icon4.png" alt="" />
+                                {this.form.liveRemark}
                             </div>
                         </div>
-                    </div >
-                </div>
-                <div class="second" v-if={this.form.preTemplate == 2}>
-                    <h2>{this.form.roomTitle}</h2>
-                    <p class="teacher">主讲人：{this.form.teacherName}</p>
-                    <img src="./images/icon2.png" class="icon" alt="" />
-                    <div class="preCore">
-                        <img src="./images/start.png" class="start" alt="" />
-                        <p class="title">开播时间</p>
-                        <p class="time">{this.form.liveStartTime}</p>
-                        <p class="title">直播内容</p>
-                        <div class="content">
-                            <img class="pre" src="./images/icon5.png" alt="" />
-                            <img class="end" src="./images/icon4.png" alt="" />
-                            {this.form.liveRemark}
+                        <div class="bottom">
+                            <img class="logo" src="./images/logo.png" alt="" />
+                            <div class="code">
+                                <div>
+                                    <vue-qr text={this.url} style="width: 100%; margin='0'"></vue-qr>
+                                </div>
+                            </div>
+                        </div >
+                    </div> : null}
+                {this.form.preTemplate === '2' ?
+                    <div class="second" >
+                        <h2>{this.form.roomTitle}</h2>
+                        <p class="teacher">主讲人：{this.form.teacherName}</p>
+                        <img src="./images/icon2.png" class="icon" alt="" />
+                        <div class="preCore">
+                            <img src="./images/start.png" class="start" alt="" />
+                            <p class="title">开播时间</p>
+                            <p class="time">{this.form.liveStartTime}</p>
+                            <p class="title">直播内容</p>
+                            <div class="content">
+                                <img class="pre" src="./images/icon5.png" alt="" />
+                                <img class="end" src="./images/icon4.png" alt="" />
+                                {this.form.liveRemark}
+                            </div>
                         </div>
-                    </div>
-                    <div class="bottom">
-                        <img class="logo" src="./images/logo.png" alt="" />
-                        <div class="code">
-                            <div>
-                                <vue-qr text={this.url} style="width: 100%;margin='0'"></vue-qr>
+                        <div class="bottom">
+                            <img class="logo" src="./images/logo.png" alt="" />
+                            <div class="code">
+                                <div>
+                                    <vue-qr text={this.url} style="width: 100%;margin='0'"></vue-qr>
+                                </div>
                             </div>
                         </div>
-                    </div>
-                </div>
-                <div class="third" v-if={this.form.preTemplate == 3}>
-                    <h2>{this.form.roomTitle }</h2>
-                    <p class="teacher">主讲人：{ this.form.teacherName }</p>
-                    <img src="./images/icon3.png" class="icon" alt="" />
-                    <div class="preCore">
-                        <img src="./images/start.png" class="start" alt="" />
-                        <p class="title">开播时间</p>
-                        <p class="time">{ this.form.liveStartTime }</p>
-                        <p class="title">直播内容</p>
-                        <div class="content">
-                            <img class="pre" src="./images/icon5.png" alt="" />
-                            <img class="end" src="./images/icon4.png" alt="" />
-                            {this.form.liveRemark }
+                    </div> : null
+                }
+                {this.form.preTemplate === '3' ?
+                    <div class="third" >
+                        <h2>{this.form.roomTitle}</h2>
+                        <p class="teacher">主讲人：{this.form.teacherName}</p>
+                        <img src="./images/icon3.png" class="icon" alt="" />
+                        <div class="preCore">
+                            <img src="./images/start.png" class="start" alt="" />
+                            <p class="title">开播时间</p>
+                            <p class="time">{this.form.liveStartTime}</p>
+                            <p class="title">直播内容</p>
+                            <div class="content">
+                                <img class="pre" src="./images/icon5.png" alt="" />
+                                <img class="end" src="./images/icon4.png" alt="" />
+                                {this.form.liveRemark}
+                            </div>
                         </div>
-                    </div>
-                    <div class="bottom">
-                        <img class="logo" src="./images/logo.png" alt="" />
-                        <div class="code">
-                            <div>
-                                <vue-qr text={this.url} style="width: 100% margin:0"></vue-qr>
+                        <div class="bottom">
+                            <img class="logo" src="./images/logo.png" alt="" />
+                            <div class="code">
+                                <div>
+                                    <vue-qr text={this.url} style="width: 100% margin:0"></vue-qr>
+                                </div>
+                            </div>
                         </div>
-                    </div>
-                </div>
-            </div>
+                    </div> : null
+                }
             </div >
         )
     },

src/components/live-broadcast/share.module.less

@@ -0,0 +1,38 @@
+.shareWrap {
+    background: #f9f9f9;
+    padding: 16px;
+    h2 {
+      font-size: 18px;
+      font-family: PingFangSC-Semibold, PingFang SC;
+      font-weight: 600;
+      color: #333333;
+      line-height: 25px;
+      margin-bottom: 18px;
+    }
+    h4 {
+      font-size: 16px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #333333;
+      line-height: 28px;
+    }
+    p {
+      font-size: 16px;
+      font-family: PingFangSC-Medium, PingFang SC;
+      font-weight: 500;
+      color: #333333;
+      line-height: 30px;
+    }
+  }
+  .shareBtn {
+    height: 48px;
+    background: var(--color-primary);
+    border-radius: 32px;
+    width: 192px;
+    color: #fff;
+    margin: 24px auto 0;
+    text-align: center;
+    line-height: 48px;
+    font-size: 20px;
+    cursor: pointer;
+  }

src/components/live-broadcast/share.tsx

@@ -2,11 +2,14 @@ import { defineComponent } from 'vue'
 import { ElButton, ElFormItem, ElForm, ElRadio } from 'element-plus'
 import runtime, * as RuntimeUtils from './runtime'
 import styles from './share.module.less'
+import request from "/src/helpers/request";
+// import groupChat from './'
+import Preview from './preview'
 export default defineComponent({
     name: 'LiveBroadcastShare',
     data() {
         return {
-            form: { shareType: 1 },
+            form: { shareType: '2' },
             detail: {
                 roomTitle: '',
                 liveStartTime: '',
@@ -14,45 +17,67 @@ export default defineComponent({
             }
         }
     },
+    async mounted() {
+        let details:any = JSON.parse(sessionStorage.getItem('details')||'')
+        if (!details) {
+            const roomUid = sessionStorage.getItem('roomUid')
+            const details: any = await request.get('/api-web/imLiveBroadcastRoom/queryRoom', {
+                params: {
+                    roomUid: roomUid
+                }
+            })
+            sessionStorage.setItem('details', details.data)
+            this.detail = {... details.data} 
+        }else{
+            this.detail = {...details}
+        }
+    },
     methods: {
         copyText() {
 
         },
         shareImage() {
 
+        },
+        changeRafdio(value:string){
+            this.form.shareType = value;
         }
     },
     render() {
         return (
-            <div class={styles.header}>
-                <ElForm model={this.form} ref="form" class="form">
+            <div >
+                <ElForm model={this.form} ref="form" class={styles.form}>
                     <ElFormItem label="分享方式" >
-                        <ElRadio modelValue={this.form.shareType} label="1">链接分享</ElRadio>
-                        <ElRadio modelValue={this.form.shareType} label="2">二维码分享</ElRadio>
-                        <ElRadio modelValue={this.form.shareType} label="3">群聊分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("1")}} label="1">链接分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("2")}}label="2" >二维码分享</ElRadio>
+                        <ElRadio modelValue={this.form.shareType} onChange={()=>{this.changeRafdio("3")}}label="3">群聊分享</ElRadio>
                     </ElFormItem>
                 </ElForm>
                 <div>
-                    <div class="linkWrap" v-if="this.form.shareType == 1">
-                        <div class="shareWrap">
+                    {this.form.shareType === '1' ? <div class="linkWrap">
+
+                        <div class={styles.shareWrap}>
                             <h2>乐团老师邀请您参与直播课！</h2>
-                            <h4>{this.detail.roomTitle}111</h4>
+                            <h4>{this.detail.roomTitle}</h4>
                             <p>直播时间:{this.detail.liveStartTime}</p>
                             <p>直播内容:{this.detail.liveRemark}</p>
                             <p>直播地址:</p>
                         </div>
-                        <div class="shareBtn" onClick={this.copyText}>复制分享内容</div>
-                    </div>
+                        <div class={styles.shareBtn} onClick={this.copyText}>复制分享内容</div>
+                    </div> : null}
                 </div >
-                <div class="codeWrap" v-if="this.form.shareType == 2">
-                    <div class="shareWrap">
-                        <preview form={this.detail} id="preview" />
+                {this.form.shareType === '2' ? <div class={styles.codeWrap} >
+                    <div class={styles.shareWrap}>
+                        <Preview form={this.detail}/>
                     </div>
-                    <div class="shareBtn" onClick={this.shareImage}>复制分享内容</div>
-                </div>
-                <div class="groupWrap" v-if="this.form.shareType == 3">
-                    <groupChat />
-                </div>
+                    <div class={styles.shareBtn} onClick={this.shareImage}>复制分享内容</div>
+                </div> : null
+                }
+                {this.form.shareType == '3' ?
+                    <div class={styles.groupWrap} >
+                        {/* <GroupChat /> */}
+                    </div> : null
+                }
             </div>
         )
     }

src/pages/login/index.tsx

@@ -109,17 +109,18 @@ export default defineComponent({
                 clientSecret: clientType
               }
             })
-            console.log(res, 'res');
             let token: string = res?.data.authentication.token_type + ' ' + res?.data.authentication.access_token;
             console.log(token);
             setToken(token)
 
             const roomUid = sessionStorage.getItem('roomUid')
-            await request.get('/api-web/imLiveBroadcastRoom/queryRoom', {
+            const details:any =  await  request.get('/api-web/imLiveBroadcastRoom/queryRoom', {
               params: {
                 roomUid: roomUid
               }
             })
+          
+            sessionStorage.setItem('details',JSON.stringify(details.data))
             ElMessage.success('登录成功')
             this.$router.push(this.redirect || '/')
           } catch (error) {