init
- 框架初始化 - 安装插件 - 修复PHP8.4报错
This commit is contained in:
134
application/admin/view/shopro/app/mplive/room/add.html
Normal file
134
application/admin/view/shopro/app/mplive/room/add.html
Normal file
@@ -0,0 +1,134 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.desc {
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.qrcode-img {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="addEdit" class="molive-form" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-main>
|
||||
<el-scrollbar height="100%">
|
||||
<el-form :model="form.model" :rules="form.rules" ref="formRef" label-width="120px">
|
||||
<el-form-item label="直播类型" prop="type">
|
||||
<div>
|
||||
<el-radio-group v-model="form.model.type">
|
||||
<el-radio :label="0">手机直播</el-radio>
|
||||
<el-radio :label="1">推流设备直播</el-radio>
|
||||
</el-radio-group>
|
||||
<div class="desc" v-if="form.model.type === 0">通过“小程序直播”小程序开播</div>
|
||||
<div class="desc" v-if="form.model.type === 1">通过第三方推流设备发起直播，请自行定义画面宽高比</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="直播间标题" prop="name">
|
||||
<el-input v-model="form.model.name" placeholder="请输入直播间标题"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="背景图" prop="cover_img">
|
||||
<sa-uploader v-model="form.model.cover_img" fileType="image"></sa-uploader>
|
||||
<div class="desc"> 直播间背景图，图片建议像素1080*1920，大小不超过2M </div>
|
||||
</el-form-item>
|
||||
<el-form-item label="分享图" prop="share_img">
|
||||
<sa-uploader v-model="form.model.share_img" fileType="image"></sa-uploader>
|
||||
<div class="desc"> 直播间分享图，图片建议像素800*640，大小不超过1M </div>
|
||||
</el-form-item>
|
||||
<el-form-item label="封面图" prop="feeds_img">
|
||||
<sa-uploader v-model="form.model.feeds_img" fileType="image"></sa-uploader>
|
||||
<div class="desc">
|
||||
购物直播频道封面图，图片建议像素800*800，大小不超过100KB
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="开播时间" prop="date_time">
|
||||
<div>
|
||||
<el-date-picker v-model="form.model.date_time" type="datetimerange"
|
||||
value-format="YYYY-MM-DD HH:mm:ss" format="YYYY-MM-DD HH:mm:ss"
|
||||
:default-time="defaultTime"
|
||||
range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间"
|
||||
prefix-icon="Calendar" :editable="false" :disabled-date="disabledDate" />
|
||||
</div>
|
||||
<div class="desc">
|
||||
开播时间需要在当前时间的30分钟后 并且 开始时间不能在 6 个月后<br />
|
||||
开播时间和结束时间间隔不得短于30分钟，不得超过72小时<br />
|
||||
开播时间段仅供参考，不是实际直播间可以开播的时间。<br />
|
||||
直播间在开始时间前也可以开播，并且到结束时间后不会强制结束。<br />
|
||||
若到结束时间仍未开播，则直播间无法再开播。
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="主播昵称" prop="anchor_name">
|
||||
<el-input v-model="form.model.anchor_name" placeholder="请输入主播昵称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="主播微信账号" prop="anchor_wechat">
|
||||
<div>
|
||||
<el-input v-model="form.model.anchor_wechat" placeholder="请输入主播微信账号"></el-input>
|
||||
<div class="desc">
|
||||
每个直播间需要绑定一个用作核实主播身份，不会展示给观众。<br />
|
||||
主播微信号，如果未实名认证，需要先前往“小程序直播”小程序进行实名验证。
|
||||
</div>
|
||||
|
||||
<el-popover :width="180" trigger="click">
|
||||
<template #reference>
|
||||
<el-button class="is-link" type="primary">小程序认证</el-button>
|
||||
</template>
|
||||
<img class="qrcode-img" src="/assets/addons/shopro/img/live-qrcode.png" />
|
||||
</el-popover>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="主播副号" prop="sub_anchor_wechat">
|
||||
<el-input v-model="form.model.sub_anchor_wechat" placeholder="请输入主播副号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="官方收录">
|
||||
<div>
|
||||
<el-switch v-model="form.model.is_feeds_public" :active-value="1"
|
||||
:inactive-value="0"></el-switch>
|
||||
<div class="desc">
|
||||
开启后本场直播将有可能被官方推荐。<br />
|
||||
此项设置在直播间创建完成后可以在控制台内修改。
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="允许点赞">
|
||||
<el-radio-group v-model="form.model.close_like">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="展示商品货架">
|
||||
<el-radio-group v-model="form.model.close_goods">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="允许评论">
|
||||
<el-radio-group v-model="form.model.close_comment">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="允许回放">
|
||||
<el-radio-group v-model="form.model.close_replay">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="打开客服">
|
||||
<el-radio-group v-model="form.model.close_kf">
|
||||
<el-radio :label="0">开启</el-radio>
|
||||
<el-radio :label="1">关闭</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" @click="onConfirm">确定</el-button>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
68
application/admin/view/shopro/app/mplive/room/playback.html
Normal file
68
application/admin/view/shopro/app/mplive/room/playback.html
Normal file
@@ -0,0 +1,68 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.program {
|
||||
width: 360px;
|
||||
height: 260px;
|
||||
background: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.path {
|
||||
width: 360px;
|
||||
height: 260px;
|
||||
background: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: var(--sa-subtitle);
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: var(--sa-subfont);
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="playback" class="mplive-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<!-- v-loading="loading" -->
|
||||
<el-main class="sa-p-0">
|
||||
<el-table :data="table.data" class="sa-table" stripe>
|
||||
<template #empty>
|
||||
<sa-empty />
|
||||
</template>
|
||||
<el-table-column label="回放片段" min-width="140">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{ '片段' + scope.row.index || '-' }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建时间" min-width="140">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{
|
||||
dayjs(scope.row.create_time).format('YYYY-MM-DD HH:mm:ss') || '-'
|
||||
}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="过期时间" min-width="140">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{
|
||||
dayjs(scope.row.expire_time).format('YYYY-MM-DD HH:mm:ss') || '-'
|
||||
}}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column fixed="right" label="操作" min-width="120">
|
||||
<template #default="scope">
|
||||
<el-button class="is-link" type="primary" @click="play(scope.row.media_url)">播放</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</div>
|
||||
61
application/admin/view/shopro/app/mplive/room/push_url.html
Normal file
61
application/admin/view/shopro/app/mplive/room/push_url.html
Normal file
@@ -0,0 +1,61 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.title {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
color: var(--sa-title);
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sa-m-b-4 {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.sa-m-r-4 {
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.sa-m-b-16 {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.sa-m-b-40 {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: var(--sa-subtitle);
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.subtitle {
|
||||
color: var(--sa-subfont);
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="pushUrl" class="mplive-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<!-- v-loading="loading" -->
|
||||
<el-main class="sa-p-0">
|
||||
<div class="title">推流地址</div>
|
||||
<div class="sa-flex copy-box sa-m-b-4">
|
||||
<div class="desc sa-m-r-4">在第三方推流应用中，以下地址进行推流</div>
|
||||
<el-button class="is-link sa-m-b-4" type="primary" @click="onClipboard(state.pushUrl)">复制链接</el-button>
|
||||
</div>
|
||||
<div class="desc sa-m-b-16">{{ state.pushUrl }}</div>
|
||||
<div class="subtitle sa-m-b-40">此地址为当前直播间唯一推流地址，不要泄露给第三方。</div>
|
||||
<div class="title sa-m-b-16">备注</div>
|
||||
<div class="desc sa-m-b-4">服务器地址：{{ state.serverAddress }}</div>
|
||||
<div class="desc sa-m-b-16">串流密钥：{{ state.key }}</div>
|
||||
<div class="sa-flex">
|
||||
<div class="subtitle sa-m-r-4">推流直播操作详见</div>
|
||||
<el-button class="is-link sa-m-b-4" type="primary" @click="onJump">指引</el-button>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</div>
|
||||
64
application/admin/view/shopro/app/mplive/room/qrcode.html
Normal file
64
application/admin/view/shopro/app/mplive/room/qrcode.html
Normal file
@@ -0,0 +1,64 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<style>
|
||||
.program {
|
||||
width: 360px;
|
||||
height: 260px;
|
||||
background: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
padding: 16px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.path {
|
||||
width: 360px;
|
||||
height: 260px;
|
||||
background: #f5f5f5;
|
||||
border-radius: 4px;
|
||||
padding: 16px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
color: var(--sa-subtitle);
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
|
||||
.desc {
|
||||
color: var(--sa-subfont);
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
word-break: break-all;
|
||||
word-wrap: break-word;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div id="qrcode" class="mplive-index panel panel-default panel-intro" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<!-- v-loading="loading" -->
|
||||
<el-main >
|
||||
<div class="sa-flex sa-flex-wrap sa-row-between">
|
||||
<div class="program sa-flex sa-col-top sa-row-between">
|
||||
<div>
|
||||
<div class="title">直播间小程序码</div>
|
||||
<div class="desc ">小程序码不带参数</div>
|
||||
<el-button type="primary" @click="saveImg">保存图片</el-button>
|
||||
</div>
|
||||
<sa-image class="" :url="state.cdnUrl" size="120"></sa-image>
|
||||
</div>
|
||||
<div class="path">
|
||||
<div class="title">直播间页面路径</div>
|
||||
<div class="desc ">{{ state.path }}</div>
|
||||
<el-button type="primary" @click="onClipboard(state.path)">复制链接</el-button>
|
||||
<div class="desc">链接是直播间原始页面路径，如需加入参数,详见<el-button class="is-link" type="primary"
|
||||
@click="onJump">使用方法</el-button></div>
|
||||
</div>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</div>
|
||||
79
application/admin/view/shopro/app/mplive/room/select.html
Normal file
79
application/admin/view/shopro/app/mplive/room/select.html
Normal file
@@ -0,0 +1,79 @@
|
||||
{include file="/shopro/common/script" /}
|
||||
|
||||
<div id="select" class="room-select" v-cloak>
|
||||
<el-container class="panel-block">
|
||||
<el-main>
|
||||
<el-table height="100%" class="sa-table" :data="state.data" stripe @selection-change="onSelectionChange">
|
||||
<el-table-column type="selection" :selectable="isSelectable" width="48"></el-table-column>
|
||||
<el-table-column label="房间ID" min-width="120" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{ scope.row.roomid }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="直播类型" min-width="120" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{ scope.row.type_text }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="直播间标题" min-width="200" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{ scope.row.name }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="主播昵称" min-width="120" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1">{{ scope.row.anchor_name }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" min-width="120" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-table-line-1" :class="
|
||||
scope.row.status === 101
|
||||
? 'sa-color--success'
|
||||
: scope.row.status === 102
|
||||
? 'sa-color--warning'
|
||||
: scope.row.status === 105
|
||||
? 'sa-color--info'
|
||||
: 'sa-color--danger'
|
||||
">{{ scope.row.status_text }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="背景图" min-width="80" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-flex sa-row-center">
|
||||
<sa-image :url="scope.row.cover_img" size="30">
|
||||
</sa-image>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分享图" min-width="80" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-flex sa-row-center">
|
||||
<sa-image :url="scope.row.share_img" size="30"></sa-image>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="封面图" min-width="80" align="center">
|
||||
<template #default="scope">
|
||||
<div class="sa-flex sa-row-center">
|
||||
<sa-image :url="scope.row.feeds_img" size="30"></sa-image>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="开播时间" width="172">
|
||||
<template #default="scope">
|
||||
{{Moment(scope.row.start_time * 1000).format('YYYY-MM-DD HH:mm')}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="结束时间" width="172">
|
||||
<template #default="scope">
|
||||
{{Moment(scope.row.end_time * 1000).format('YYYY-MM-DD HH:mm')}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-main>
|
||||
<el-footer class="sa-footer--submit sa-flex sa-row-right">
|
||||
<el-button type="primary" @click="onConfirm">确 定</el-button>
|
||||
</el-footer>
|
||||
</el-container>
|
||||
</div>
|
||||
Reference in New Issue
Block a user