master
pan
3 years ago
parent
4b99cfdda1
commit
c055dacfaf
@ -0,0 +1,93 @@ |
||||
<template> |
||||
<el-row type="flex" justify="center"> |
||||
<el-col :span="6"> |
||||
<el-input placeholder="直播间号" v-model="roomId"> |
||||
<template v-slot:prepend>请输入直播间号</template> |
||||
<template v-slot:append> |
||||
<el-button @click="add" :disabled="roomId===''">添加</el-button> |
||||
</template> |
||||
</el-input> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row type="flex" justify="center"> |
||||
<el-col :span="12"> |
||||
<el-table :data="tableData"> |
||||
<el-table-column prop="id" label="直播间号"/> |
||||
<el-table-column prop="user" label="直播用户"/> |
||||
<el-table-column prop="title" label="直播标题"/> |
||||
<el-table-column label="状态"> |
||||
<template v-slot="scope"> |
||||
{{ parseStatus(scope.row.status) }} |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="推送配置"> |
||||
<template v-slot="scope"> |
||||
<el-checkbox v-model="scope.row._email">邮箱</el-checkbox> |
||||
<el-checkbox v-model="scope.row._telegram">telegram</el-checkbox> |
||||
</template> |
||||
</el-table-column> |
||||
<el-table-column label="操作"> |
||||
<template v-slot="scope"> |
||||
<el-popconfirm title="确认删除此直播间号？"> |
||||
<template v-slot:reference> |
||||
<el-button icon="el-icon-delete">删除</el-button> |
||||
</template> |
||||
</el-popconfirm> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
</el-col> |
||||
</el-row> |
||||
|
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {defineComponent, ref} from "vue"; |
||||
import {addRoom, JSONResponse, loadRoom, message} from "../request"; |
||||
|
||||
export default defineComponent({ |
||||
name: "Room", |
||||
setup() { |
||||
const tableData = ref<Array>() |
||||
const roomId = ref('') |
||||
|
||||
const add = () => { |
||||
addRoom(roomId).then(res => res.json()) |
||||
.then((res: JSONResponse) => { |
||||
message(res) |
||||
if (res.result === "OK") { |
||||
load() |
||||
} |
||||
}) |
||||
} |
||||
|
||||
const load = () => loadRoom().then(res => res.json()) |
||||
.then((res: JSONResponse) => { |
||||
res.rooms.forEach(value => { |
||||
value._email = ref(value.email) |
||||
value._telegram = ref(value.telegram) |
||||
}) |
||||
tableData.value = res.rooms |
||||
}) |
||||
|
||||
load() |
||||
|
||||
const parseStatus = (status: number) => { |
||||
switch (status) { |
||||
case 1: |
||||
return "直播" |
||||
case 2: |
||||
return "轮播" |
||||
case 3: |
||||
return "离线" |
||||
} |
||||
} |
||||
|
||||
return {tableData, roomId, add, parseStatus} |
||||
} |
||||
}) |
||||
</script> |
||||
|
||||
<style scoped> |
||||
|
||||
</style> |
||||
@ -0,0 +1,81 @@ |
||||
<template> |
||||
<el-row type="flex" justify="center" class="mt-1"> |
||||
<el-col :span="8"> |
||||
<el-tabs v-model="activeName" @tab-click="handleClick"> |
||||
<el-tab-pane label="登录" name="login"> |
||||
<el-input placeholder="请输入用户名" v-model="user"> |
||||
<template v-slot:prepend>用户名</template> |
||||
</el-input> |
||||
<el-input placeholder="请输入密码" v-model="password" show-password> |
||||
<template v-slot:prepend>密码</template> |
||||
</el-input> |
||||
</el-tab-pane> |
||||
<el-tab-pane label="注册" name="register"> |
||||
<el-input placeholder="请输入用户名" v-model="user"> |
||||
<template v-slot:prepend>用户名</template> |
||||
</el-input> |
||||
<el-input placeholder="请输入密码" v-model="password" show-password> |
||||
<template v-slot:prepend>密码</template> |
||||
</el-input> |
||||
<el-input placeholder="请确认密码" v-model="confirmPwd" show-password> |
||||
<template v-slot:prepend>确认密码</template> |
||||
</el-input> |
||||
<span v-if="password!==''&&confirmPwd!==''&&password!==confirmPwd">密码不一致</span> |
||||
</el-tab-pane> |
||||
</el-tabs> |
||||
</el-col> |
||||
</el-row> |
||||
<el-row type="flex" justify="center" class="mt-1"> |
||||
<el-col :span="8"> |
||||
<el-button type="primary" v-if="activeName==='login'" |
||||
:disabled="user===''||password===''" @click="requestLogin">登录 |
||||
</el-button> |
||||
<el-button type="success" v-else :disabled="user===''||password===''||confirmPwd===''||password!==confirmPwd">注册 |
||||
</el-button> |
||||
</el-col> |
||||
</el-row> |
||||
</template> |
||||
|
||||
<script lang="ts"> |
||||
import {defineComponent, ref} from "vue" |
||||
import {JSONResponse, login, message} from "../request"; |
||||
import {email_cookie_key, user_token_key} from "../global"; |
||||
import {router, userMainPath} from "../router"; |
||||
import {userLoginApi} from "../interface"; |
||||
|
||||
//@ts-ignore |
||||
import crumbs from 'crumbsjs'; |
||||
|
||||
export default defineComponent({ |
||||
name: "UserLogin", |
||||
setup() { |
||||
const activeName = ref('login') |
||||
const handleClick = (tab, event) => { |
||||
user.value = '' |
||||
password.value = '' |
||||
confirmPwd.value = '' |
||||
} |
||||
const user = ref('') |
||||
const password = ref('') |
||||
const confirmPwd = ref('') |
||||
|
||||
const requestLogin = () => { |
||||
login(userLoginApi, user.value, password.value).then(res => res.json()) |
||||
.then((res: JSONResponse) => { |
||||
message(res) |
||||
if (res.result === 'OK') { |
||||
crumbs.set(user_token_key, res.body.token) |
||||
crumbs.set(email_cookie_key, res.body.userEmail) |
||||
router.replace(userMainPath) |
||||
} |
||||
}) |
||||
} |
||||
|
||||
return {activeName, handleClick, user, password, confirmPwd, requestLogin} |
||||
} |
||||
}) |
||||
</script> |
||||
|
||||
<style scoped> |
||||
|
||||
</style> |
||||
@ -1,2 +1,3 @@ |
||||
export const token_cookie_key = 'token' |
||||
export const manager_token_key = 'manager_token' |
||||
export const user_token_key = "user_token" |
||||
export const email_cookie_key = 'user_email' |
||||
Loading…
Reference in new issue