签到
<h4>安装</h4>
<p>七巧板基于 VUE (2.5), Webpack (3.0) 请确保已具备较新的 node 环境。</p>
<h4>聊天过滤基础使用</h4>
<p>发起端可以发起签到,并统计最后签到结果。观看端可以进行签到操作。</p>
<pre><code class="language-html"><TEMPLATE>
<SIGNIN-COMPONENT :room_id="roomInfo.room_id" :vss_token="roomInfo.vss_token" :third_party_user_id="roomInfo.third_party_user_id" :countTime="countTime"
@toDataList="toDataList" ref="signinComponent">
</SIGNIN-COMPONENT>
<SCRIPT>
export default {
data () {
return {
roomInfo: {
roomeId: "lss_xxxxx", // 当前活动房间id
vss_token: 1, // vss_token
third_party_user_id: 1234, // 当前房间用户id
},
countTime: 10 // 签到倒计时时间
}
},
methods: {
startSign() {
this.$refs.signinComponent.openSignIn()
},
toDataList() {
// 点击查看明细方法,可以跳转页面、路由、弹窗等,自行定义
this.$refs.signinComponent.showList() // 在签到弹窗中显示签到明细,也可根据需求进行跳转等操作
console.log('查看签到统计列表')
}
}
}
</SCRIPT>
</TEMPLATE></code></pre>
<p>观看端展示签到窗口</p>
<pre><code class="language-javascript">this.$vhallEvent.$on('sign_in_push', e => {
this.$refs.signin.openSignIn(e.sign_id)
})</code></pre>
<p>观看端关闭签到窗口</p>
<pre><code class="language-javascript">this.$refs.signin.closeSignIn()</code></pre>
<h4>签到 v1.1 版本升级,优化 class 名称</h4>
<table>
<thead>
<tr>
<th style="text-align: left;">原Class</th>
<th style="text-align: left;">修改后Class</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">vh-signin_box</td>
<td style="text-align: left;">vh-signin__box</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_header</td>
<td style="text-align: left;">vh-signin__header</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_header-close</td>
<td style="text-align: left;">vh-signin__header-close</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_body</td>
<td style="text-align: left;">vh-signin__body</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_body-title</td>
<td style="text-align: left;">vh-signin__body-title</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_body-btn</td>
<td style="text-align: left;">vh-signin__body-btn</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_body-counting</td>
<td style="text-align: left;">vh-signin__body-counting</td>
</tr>
<tr>
<td style="text-align: left;">host-timeout</td>
<td style="text-align: left;">vh-signin__host-timeout</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status</td>
<td style="text-align: left;">vh-signin__status</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-total</td>
<td style="text-align: left;">vh-signin__status-total</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-detail</td>
<td style="text-align: left;">vh-signin__status-detail</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list</td>
<td style="text-align: left;">vh-signin__status-list</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-box</td>
<td style="text-align: left;">vh-signin__status-list-box</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-container</td>
<td style="text-align: left;">vh-signin__status-list-container</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-ul</td>
<td style="text-align: left;">vh-signin__status-list-ul</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-li</td>
<td style="text-align: left;">vh-signin__status-list-li</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-avatar</td>
<td style="text-align: left;">vh-signin__status-list-avatar</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_status-list-nickname</td>
<td style="text-align: left;">vh-signin__status-list-nickname</td>
</tr>
<tr>
<td style="text-align: left;">vh-signin_body-second</td>
<td style="text-align: left;">vh-signin__body-second</td>
</tr>
</tbody>
</table>