新增后台系统 发布广播相关功能
This commit is contained in:
192
mining-pool/src/views/broadcast/index.js
Normal file
192
mining-pool/src/views/broadcast/index.js
Normal file
@@ -0,0 +1,192 @@
|
||||
import { listBroadcast, getAddBroadcast, updateBroadcast, DeleteBroadcast, getBroadcast,dataInfo } from '../../api/broadcast'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [
|
||||
// {
|
||||
// id: 1,
|
||||
// createTime: "2025-06-24 10:00:00",
|
||||
// content: "内isjisjfidjfjfjffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff容",
|
||||
// createUser: "创建人",
|
||||
// updateTime: "2025-06-24 10:00:00",
|
||||
// updateUser: "修改人",
|
||||
// },
|
||||
// {
|
||||
// id: 2,
|
||||
// createTime: "2025-06-24 10:00:00",
|
||||
// content: "内容",
|
||||
// createUser: "创建人",
|
||||
// updateTime: "2025-06-24 10:00:00",
|
||||
// updateUser: "修改人",
|
||||
// },
|
||||
],
|
||||
listParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 50
|
||||
},
|
||||
addParams: {
|
||||
content: "",
|
||||
},
|
||||
editParams: {
|
||||
content: "",
|
||||
id: "",
|
||||
},
|
||||
dialogVisible: false,
|
||||
bthLoading: false,
|
||||
broadcastLoading: false,
|
||||
editDialogVisible: false,
|
||||
editLoading: false,
|
||||
byteCount: "",
|
||||
isOverLimit: false,
|
||||
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
|
||||
let token
|
||||
try{
|
||||
token =JSON.parse(localStorage.getItem('token'))
|
||||
}catch(e){
|
||||
console.log(e);
|
||||
}
|
||||
if (token) {
|
||||
this.fetchList(this.listParams);
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
async fetchList(params) {
|
||||
|
||||
this.setLoading('broadcastLoading', true);
|
||||
const res = await listBroadcast(params)
|
||||
if (res.code === 200) {
|
||||
this.tableData = res.rows
|
||||
}
|
||||
this.setLoading('broadcastLoading', false);
|
||||
},
|
||||
async addBroadcast(params) {
|
||||
this.setLoading('bthLoading', true);
|
||||
const res = await getAddBroadcast(params)
|
||||
if (res.code === 200) {
|
||||
this.$message.success(this.$t("backendSystem.addSuccess"))
|
||||
this.dialogVisible = false;
|
||||
this.fetchList(this.listParams);
|
||||
}
|
||||
this.setLoading('bthLoading', false);
|
||||
},
|
||||
async getBroadcast(params) {
|
||||
this.setLoading('editLoading', true);
|
||||
const res = await dataInfo(params)
|
||||
if (res.code === 200) {
|
||||
this.editParams = res.data
|
||||
this.editDialogVisible = true;
|
||||
}
|
||||
this.setLoading('editLoading', false);
|
||||
},
|
||||
async editBroadcast(params) {
|
||||
this.setLoading('editLoading', true);
|
||||
const res = await updateBroadcast(params)
|
||||
if (res.code === 200) {
|
||||
this.$message.success(this.$t("backendSystem.editSuccess"))
|
||||
this.editDialogVisible = false;
|
||||
this.fetchList(this.listParams);
|
||||
}
|
||||
this.setLoading('editLoading', false);
|
||||
},
|
||||
async deleteBroadcast(params) {
|
||||
const res = await DeleteBroadcast(params)
|
||||
if (res.code === 200) {
|
||||
this.$message.success(this.$t("backendSystem.deleteSuccess"))
|
||||
this.fetchList(this.listParams);
|
||||
}
|
||||
},
|
||||
handelAddBroadcast() {
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
handleClose() {
|
||||
this.dialogVisible = false;
|
||||
this.addParams.content = ""
|
||||
},
|
||||
sureAddBroadcast() {
|
||||
|
||||
this.addParams.content = this.addParams.content.trim()
|
||||
this.addParams.content = this.addParams.content.replace(/[\r\n]/g, '');
|
||||
if (!this.addParams.content) {
|
||||
this.$message.warning(this.$t("backendSystem.pleaseInputContent"))
|
||||
return
|
||||
}
|
||||
this.addBroadcast(this.addParams);
|
||||
},
|
||||
sureEditBroadcast() {
|
||||
this.editParams.content=this.editParams.content.trim()
|
||||
this.editParams.content = this.editParams.content.replace(/[\r\n]/g, '');
|
||||
if (!this.editParams.content) {
|
||||
this.$message.warning(this.$t("backendSystem.pleaseInputContent"))
|
||||
return
|
||||
}
|
||||
this.editBroadcast(this.editParams);
|
||||
},
|
||||
handleEdit(row) {
|
||||
|
||||
this.getBroadcast({ id: row.id });
|
||||
},
|
||||
handleEditClose() {
|
||||
this.editDialogVisible = false;
|
||||
this.editParams.content = ""
|
||||
},
|
||||
handelDelete(row) {
|
||||
this.deleteBroadcast({ id: row.id });
|
||||
},
|
||||
getUtf8Bytes(str) {
|
||||
let bytes = 0;
|
||||
for (let i = 0; i < str.length; i++) {
|
||||
const code = str.charCodeAt(i);
|
||||
if (code <= 0x7f) bytes += 1;
|
||||
else if (code <= 0x7ff) bytes += 2;
|
||||
else if (code <= 0xffff) bytes += 3;
|
||||
else bytes += 4;
|
||||
}
|
||||
return bytes;
|
||||
},
|
||||
|
||||
handleInput(val, type = 'add') {
|
||||
let bytes = this.getUtf8Bytes(val);
|
||||
if (bytes > 100) {
|
||||
this.isOverLimit = true;
|
||||
// 截断到100字节
|
||||
let newVal = '';
|
||||
let total = 0;
|
||||
for (let ch of val) {
|
||||
let chBytes = this.getUtf8Bytes(ch);
|
||||
if (total + chBytes > 100) break;
|
||||
newVal += ch;
|
||||
total += chBytes;
|
||||
}
|
||||
if (type === 'add') {
|
||||
this.addParams.content = newVal;
|
||||
} else {
|
||||
this.editParams.content = newVal;
|
||||
}
|
||||
bytes = total;
|
||||
} else {
|
||||
this.isOverLimit = false;
|
||||
if (type === 'add') {
|
||||
this.addParams.content = val;
|
||||
} else {
|
||||
this.editParams.content = val;
|
||||
}
|
||||
}
|
||||
this.byteCount = bytes;
|
||||
},
|
||||
|
||||
handelTime(time) {
|
||||
return `${time.split("T")[0]} ${time.split("T")[1]}`
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
153
mining-pool/src/views/broadcast/index.vue
Normal file
153
mining-pool/src/views/broadcast/index.vue
Normal file
@@ -0,0 +1,153 @@
|
||||
<template>
|
||||
<div v-loading="broadcastLoading">
|
||||
|
||||
<div class="main-title-box">
|
||||
<div class="main-title">{{$t("backendSystem.publishedBroadcast")}}</div>
|
||||
<el-button class="add-btn" @click="handelAddBroadcast">{{$t("backendSystem.addBroadcast")}} <i class="iconfont icon-youjiantou1 arrow"></i></el-button>
|
||||
|
||||
</div>
|
||||
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%; margin-bottom: 18px"
|
||||
:header-cell-style="{ 'text-align': 'center' }"
|
||||
:cell-style="{ 'text-align': 'center' }"
|
||||
|
||||
>
|
||||
<el-table-column prop="id" label="ID" width="60" show-overflow-tooltip />
|
||||
<el-table-column prop="createTime" :label="$t('backendSystem.createTime')" width="160" show-overflow-tooltip>
|
||||
<template slot-scope="scope">
|
||||
{{ handelTime(scope.row.createTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="content" :label="$t('backendSystem.content')" show-overflow-tooltip/>
|
||||
<el-table-column prop="createUser" :label="$t('backendSystem.createUser')" width="160" show-overflow-tooltip/>
|
||||
<el-table-column prop="updateTime" :label="$t('backendSystem.updateTime')" width="160" show-overflow-tooltip>
|
||||
<template slot-scope="scope">
|
||||
{{ handelTime(scope.row.updateTime) }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="updateUser" :label="$t('backendSystem.updateUser')" width="160" show-overflow-tooltip/>
|
||||
|
||||
|
||||
<el-table-column :label="$t('backendSystem.operation')" width="160" >
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
|
||||
@click="handleEdit(scope.row)">{{$t("backendSystem.edit")}}</el-button>
|
||||
|
||||
|
||||
<el-popconfirm
|
||||
:confirm-button-text='$t(`work.confirm`)'
|
||||
:cancel-button-text='$t(`work.cancel`)'
|
||||
icon="el-icon-info"
|
||||
icon-color="red"
|
||||
:title="$t(`alerts.deleteRemind`)"
|
||||
@confirm="handelDelete(scope.row)"
|
||||
>
|
||||
<el-button class="elBtn" size="mini" slot="reference">{{ $t(`personal.delete`) }}</el-button>
|
||||
</el-popconfirm>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 新增广播弹窗 -->
|
||||
<el-dialog
|
||||
:title="$t('backendSystem.dialogTitle')"
|
||||
:visible.sync="dialogVisible"
|
||||
width="50%"
|
||||
:before-close="handleClose"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-form :model="addParams" >
|
||||
<!-- v-if="isOverLimit" -->
|
||||
<el-form-item >
|
||||
<el-input resize="none" v-model="addParams.content" type="textarea" :rows="5" @input="val => handleInput(val, 'add')" />
|
||||
<div style="color: #999; font-size: 12px; margin-top: 4px;display: flex;align-items: center;justify-content: space-between;">
|
||||
<span v-if="isOverLimit"> {{$t("backendSystem.exceedingInput")}}</span>
|
||||
<span> {{$t("backendSystem.newlineInvalid")}}</span>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleClose">{{$t("backendSystem.cancel")}}</el-button>
|
||||
<el-button type="primary" :loading="bthLoading" @click="sureAddBroadcast">{{$t("backendSystem.publish")}}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 修改广播弹窗 -->
|
||||
<el-dialog
|
||||
:title="$t('backendSystem.editContent')"
|
||||
:visible.sync="editDialogVisible"
|
||||
width="50%"
|
||||
:before-close="handleEditClose"
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
<el-form :model="editParams" >
|
||||
|
||||
<el-form-item >
|
||||
<el-input resize="none" v-model="editParams.content" type="textarea" :rows="5" @input="val => handleInput(val, 'edit')" />
|
||||
<div style="color: #999; font-size: 12px; margin-top: 4px;display: flex;align-items: center;justify-content: space-between;">
|
||||
<span v-if="isOverLimit"> {{$t("backendSystem.exceedingInput")}}</span>
|
||||
<span> {{$t("backendSystem.newlineInvalid")}}</span>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="handleEditClose">{{$t("backendSystem.cancel")}}</el-button>
|
||||
<el-button type="primary" :loading="editLoading" @click="sureEditBroadcast">{{$t("backendSystem.editBroadcast")}}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Index from './index'
|
||||
export default {
|
||||
mixins:[Index],
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.main-title-box{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.add-btn{
|
||||
background: #661FFB;
|
||||
color: #fff;
|
||||
border:none;
|
||||
margin-left: 28px;
|
||||
border-radius: 20px;
|
||||
padding: 10px 20px;
|
||||
transition: all 0.3s ease;
|
||||
.arrow{
|
||||
margin-left: 10px;
|
||||
}
|
||||
}
|
||||
.add-btn:hover{
|
||||
transform: scale(1.05);
|
||||
}
|
||||
}
|
||||
.main-title{
|
||||
font-size: 24px;
|
||||
font-weight: bold;
|
||||
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.elBtn{
|
||||
background: #e60751;
|
||||
color: #fff;
|
||||
border:none;
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user