Skip to content

P
pmk-channel-vue
Commit 0306f563 by huangqy
Options

111

parent 9a1e2960
正在显示 包含 217 行增加 和 2 行删除
src/views/ChannelSetting.vue
......@@ -110,6 +110,39 @@
</el-table>
</el-card>
</el-tab-pane>
<el-tab-pane>
<template #label>
<span class="card-title">LED参数配置</span>
</template>
<el-card style="height: calc(100vh - 227.75px)">
<div class="head-container">
<el-button class="filter-item" type="primary" style="float: right" @click="addLedConfig">新增</el-button>
</div>
<el-table :header-cell-style="{backgroundColor: '#f5f7fa',color: '#000',fontSize: '18px',fontWeight: '600'}" :data="ledConfigList" border style="width: 100%;">
<el-table-column type="index" label="序号" align="center" width="70"/>
<el-table-column prop="sendType" label="发送led类型" align="center">
<template #default="scope">
{{scope.row.sendType == '0' ? '标题' : scope.row.sendType == '1' ? '内容' : '报错' }}
</template>
</el-table-column>
<el-table-column prop="left1" label="左边距" align="center"/>
<el-table-column prop="top" label="上边距" align="center"/>
<el-table-column prop="width" label="宽度" align="center"/>
<el-table-column prop="height" label="高度" align="center"/>
<el-table-column prop="fontname" label="字体名称" align="center"/>
<el-table-column label="操作" width="200" align="center">
<template #default="scope">
<el-button type="primary" size="small" @click="editLedConfig(scope.row)">编辑</el-button>
<el-popconfirm title="你确定删除吗?" @confirm="removeLed(scope.row)">
<template #reference>
<el-button type="danger" size="small">删除</el-button>
</template>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
</el-card>
</el-tab-pane>
</el-tabs>
<el-dialog v-model="visible" width="30%" :title="title" @close="closeConfig">
......@@ -171,7 +204,7 @@
</el-select>
</el-form-item>
<el-form-item label="天线功率">
<el-input v-model="formData.readerPower" placeholder="四通道格式为10,10,10,10,范围为0-30之间。8通道同理"/>
<el-input v-model="formData.readerPower" placeholder="四通道格式为10,10,10,10,范围为0-30之间。八通道同理"/>
</el-form-item>
<el-row>
<el-col :span="12">
......@@ -218,6 +251,132 @@
</div>
</template>
</el-dialog>
<el-dialog v-model="ledVisible" width="50%" :title="title">
<el-form :model="form" label-width="160px">
<el-divider>基本配置</el-divider>
<el-row>
<el-col :span="12">
<el-form-item label="左边距" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.left1"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="LED宽度" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.width" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="上边距" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.top" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="LED高度" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.height" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-divider>字体</el-divider>
<el-form-item label="字体名称" :rules="[{ required: true, message: '必填' }]">
<el-input v-model="form.fontname" style="width: 160px;" placeholder="宋体"/>
</el-form-item>
<el-form-item label="字体大小" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.fontsize" />
</el-form-item>
<el-form-item label="横向对齐方式" :rules="[{ required: true, message: '必填' }]">
<el-radio-group v-model="form.halign">
<el-radio :label="0">靠左</el-radio>
<el-radio :label="1">居中</el-radio>
<el-radio :label="2">靠右</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="纵向对齐方式" :rules="[{ required: true, message: '必填' }]">
<el-radio-group v-model="form.valign">
<el-radio :label="0">靠上</el-radio>
<el-radio :label="1">居中</el-radio>
<el-radio :label="2">靠下</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="发送方式" :rules="[{ required: true, message: '必填' }]">
<el-radio-group v-model="form.sendType">
<el-radio :label="0">标题</el-radio>
<el-radio :label="1">内容</el-radio>
<el-radio :label="2">报错</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12">
<el-divider>显示方式</el-divider>
<el-form-item label="引入方式" :rules="[{ required: true, message: '必填' }]">
<el-select v-model="form.inmethod" style="width: 160px;">
<el-option label="随机" :value="0" />
<el-option label="立即显示" :value="1" />
<el-option label="左滚显示" :value="2" />
<el-option label="上滚显示" :value="3" />
<el-option label="右滚显示" :value="4" />
<el-option label="下滚显示" :value="5" />
<el-option label="连续左滚显示" :value="6" />
<el-option label="连续上滚显示" :value="7" />
<el-option label="连续右滚显示" :value="8" />
<el-option label="连续下滚显示" :value="9" />
<el-option label="中间向上下展开" :value="10" />
<el-option label="中间向两边展开" :value="11" />
<el-option label="中间向四周展开" :value="12" />
<el-option label="从右向左移入" :value="13" />
<el-option label="从左向右移入" :value="14" />
<el-option label="从左向右展开" :value="15" />
<el-option label="从右向左展开" :value="16" />
<el-option label="从右上角移入" :value="17" />
<el-option label="从右下角移入" :value="18" />
<el-option label="从左上角移入" :value="19" />
<el-option label="从左下角移入" :value="20" />
<el-option label="从上向下移入" :value="21" />
<el-option label="从下向上移入" :value="22" />
<el-option label="横向百叶窗" :value="23" />
<el-option label="纵向百叶窗" :value="24" />
</el-select>
</el-form-item>
<el-form-item label="引入速度" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.inspeed"/>
</el-form-item>
<el-form-item label="引出方式" :rules="[{ required: true, message: '必填' }]">
<el-radio-group v-model="form.outmethod">
<el-radio :label="0">随机</el-radio>
<el-radio :label="1">始终显示</el-radio>
<el-radio :label="2">立即消失</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="引出速度" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.outspeed"/>
</el-form-item>
<el-form-item label="停留方式" :rules="[{ required: true, message: '必填' }]">
<el-radio-group v-model="form.stopmethod">
<el-radio :label="0">静态显示</el-radio>
<el-radio :label="1">闪烁显示</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="停留速度" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.stopspeed"/>
</el-form-item>
<el-form-item label="停留时间" :rules="[{ required: true, message: '必填' }]">
<el-input-number :min="0" v-model="form.stoptime"/>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="ledVisible = false" size="large">关闭</el-button>
<el-button type="primary" @click="onLedSubmit" size="large">提交</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
......@@ -236,6 +395,9 @@ export default defineComponent({
const formData = ref({})
const visible = ref(false)
const innerVisible = ref(false)
const ledVisible = ref(false)
const form = ref({})
const ledConfigList = ref([])
// ip正则表达式
function isIp(str) {
......@@ -288,6 +450,12 @@ export default defineComponent({
saveDevice: '/device/saveDevice',
getLedConfig: '/ledConfig/getConfigList',
updateLedConfig: '/ledConfig/updateConfig',
saveLedConfig: '/ledConfig/saveConfig',
removeLedConfig: '/ledConfig/removeConfig',
syncGoods: '/platform/syncGoods'
},
});
......@@ -296,9 +464,17 @@ export default defineComponent({
const loadData = (arg) => {
getConfigPage()
getDevice()
getLedConfigList()
resetConfig()
}
function getLedConfigList() {
postAction(state.url.getLedConfig, {}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
ledConfigList.value = res.data
})
}
function getConfigPage() {
postAction(state.url.getConfigPage, {}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
......@@ -317,6 +493,18 @@ export default defineComponent({
visible.value = true
}
function addLedConfig() {
title.value = '新增'
ledVisible.value = true
}
function editLedConfig(row) {
title.value = '编辑'
form.value = JSON.parse(JSON.stringify(row))
ledVisible.value = true
}
function submitConfig() {
let url = configForm.value.id ? state.url.updateConfig : state.url.saveConfig
proxy.$refs.storeIp.validate((valid) => {
......@@ -423,6 +611,14 @@ export default defineComponent({
})
}
function removeLed(row) {
postAction(state.url.removeLedConfig, {id: row.id}).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message)
getLedConfigList()
})
}
function handleCommand(command) {
if (command === '#223170') { // 藏蓝
sessionStorage.setItem('bgColor', '#223170')
......@@ -436,6 +632,17 @@ export default defineComponent({
window.location.reload()
}
const onLedSubmit = () => {
let url = form.value.id ? state.url.updateLedConfig : state.url.saveLedConfig
postAction(url, form.value).then(res => {
if (res.code !== 99200) return ElMessage.error(res.message);
ElMessage.success(res.message)
form.value = {}
ledVisible.value = false
getLedConfigList()
})
}
return {
...toRefs(state),
sysForm,
......@@ -444,9 +651,12 @@ export default defineComponent({
rules,
visible,
innerVisible,
ledVisible,
title,
configList,
channelList,
ledConfigList,
getLedConfigList,
resetConfig,
......@@ -465,7 +675,12 @@ export default defineComponent({
getDevice,
syncGoods,
getConfigPage,
handleCommand
handleCommand,
form,
onLedSubmit,
addLedConfig,
editLedConfig,
removeLed
}
},
})
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论