mengff
/
jihe-hs
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix-更新一下

wangqin
IAMHERE 1 year ago
parent
8c561e63fc
commit
22499896c7
5 changed files with 654 additions and 764 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      ruoyi-ui/src/views/index.vue
  2. 635
      ruoyi-ui/src/views/information/board/addinfo.vue
  3. 587
      ruoyi-ui/src/views/information/board/editInfo.vue
  4. 104
      ruoyi-ui/src/views/map/index.vue
  5. 7
      ruoyi-ui/vue.config.js

3
ruoyi-ui/src/views/index.vue
View File

@ -418,7 +418,8 @@ export default {
.con_ec_cen { .con_ec_cen {
width: 40%; width: 40%;
height: 100%; height: 100%;
background-color: orange; // TODO
// background-color: orange;
} }
.con_ec_right { .con_ec_right {
width: 30%; width: 30%;

635
ruoyi-ui/src/views/information/board/addinfo.vue
View File

@ -1,30 +1,17 @@
<template> <template>
<div class="container infoBoardDialog"> <div class="container infoBoardDialog">
<!-- 添加信息弹窗 --> <!-- 添加信息弹窗 -->
<el-dialog <el-dialog title="新增" :visible.sync="dialogVisible" width="42%" :before-close="handleClose" :close-on-click-modal="false">
title="新增"
:visible.sync="dialogVisible"
width="42%"
:before-close="handleClose"
:close-on-click-modal="false"
>
<div class="dialogStyleBox"> <div class="dialogStyleBox">
<div class="dialogLine"></div> <div class="dialogLine"></div>
<div class="dialogCloseButton"></div> <div class="dialogCloseButton"></div>
</div> </div>
<el-card class="box-card"> <el-card class="box-card">
<div <div v-on:ondragenter="ondragenter" v-on:drop="faceDrop" v-on:dragover="allowDrop" :style="{
v-on:ondragenter="ondragenter"
v-on:drop="faceDrop"
v-on:dragover="allowDrop"
:style="{
width: boardWidth + 'px', width: boardWidth + 'px',
height: boardHeight + 'px', height: boardHeight + 'px',
}" }" class="blackBoard2">
class="blackBoard2" <span :style="{
>
<span
:style="{
color: getColorStyle(dataForm.COLOR), color: getColorStyle(dataForm.COLOR),
fontSize: dataForm.FONT_SIZE, fontSize: dataForm.FONT_SIZE,
fontFamily: dataForm.FONT, fontFamily: dataForm.FONT,
@ -36,53 +23,29 @@
? dataForm.COORDINATE.substring(3, 6) + 'px' ? dataForm.COORDINATE.substring(3, 6) + 'px'
: '', : '',
maxHeight:boardHeight + 'px', maxHeight:boardHeight + 'px',
}" }" class="textBoard2 boardTextStyle" v-html="
class="textBoard2 boardTextStyle"
v-html="
dataForm.CONTENT dataForm.CONTENT
? dataForm.CONTENT.replace(/\n|\r\n/g, '<br>').replace( ? dataForm.CONTENT.replace(/\n|\r\n/g, '<br>').replace(
/ /g, / /g,
'&nbsp' '&nbsp'
) )
: '' : ''
" "></span>
></span>
</div> </div>
</el-card> </el-card>
<el-card> <el-card>
<el-form <el-form :model="dataForm" :rules="dataRule" label-width="90px" ref="dataForm" size="mini">
:model="dataForm"
:rules="dataRule"
label-width="90px"
ref="dataForm"
size="mini"
>
<el-row :gutter="24" style="height: 45px;"> <el-row :gutter="24" style="height: 45px;">
<el-col :span="8"> <el-col :span="8">
<el-form-item <el-form-item prop="category" label="所属类别" :rules="[
prop="category"
label="所属类别"
:rules="[
{ {
required: categoryRules ? true : false, required: categoryRules ? true : false,
message: '请选择所属类别', message: '请选择所属类别',
trigger: 'blur', trigger: 'blur',
}, },
]" ]" v-show="infoType == 2">
v-show="infoType == 2" <el-select v-model="dataForm.category" placeholder="请选择所属类别" clearable size="mini">
> <el-option v-for="item in iotTemplateCategoryList" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
<el-select
v-model="dataForm.category"
placeholder="请选择所属类别"
clearable
size="mini"
>
<el-option
v-for="item in iotTemplateCategoryList"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -110,63 +73,29 @@
flex-wrap: wrap;width:100%"> flex-wrap: wrap;width:100%">
<el-col :span="24"> <el-col :span="24">
<el-form-item label="详细内容" prop="CONTENT"> <el-form-item label="详细内容" prop="CONTENT">
<el-input <el-input type="textarea" clearable id="textContent" placeholder="详细内容" v-model="dataForm.CONTENT" @keyup.native="keyDown($event)"></el-input>
type="textarea"
clearable
id="textContent"
placeholder="详细内容"
v-model="dataForm.CONTENT"
@keyup.native="keyDown($event)"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="COLOR" label="字体颜色"> <el-form-item prop="COLOR" label="字体颜色">
<el-select <el-select v-model="dataForm.COLOR" filterable placeholder="请选择">
v-model="dataForm.COLOR" <el-option v-for="item in colorOptions" :key="item.cssClass" :label="item.dictLabel" :value="item.cssClass">
filterable
placeholder="请选择"
>
<el-option
v-for="item in colorOptions"
:key="item.cssClass"
:label="item.dictLabel"
:value="item.cssClass"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="FONT_SIZE" label="字体大小"> <el-form-item prop="FONT_SIZE" label="字体大小">
<el-select <el-select v-model="dataForm.FONT_SIZE" style="width: 100%" @change="changeFontSize">
v-model="dataForm.FONT_SIZE" <el-option v-for="item in fontSizeOpt" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
style="width: 100%"
@change="changeFontSize"
>
<el-option
v-for="item in fontSizeOpt"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="FONT" label="字体类型"> <el-form-item prop="FONT" label="字体类型">
<el-select <el-select v-model="dataForm.FONT" filterable placeholder="请选择">
v-model="dataForm.FONT" <el-option v-for="item in fontTypeOptions" :key="item.dictLabel" :label="item.dictLabel" :value="item.dictLabel">
filterable
placeholder="请选择"
>
<el-option
v-for="item in fontTypeOptions"
:key="item.dictLabel"
:label="item.dictLabel"
:value="item.dictLabel"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -174,53 +103,24 @@
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="STAY" label="停留时间(秒)"> <el-form-item prop="STAY" label="停留时间(秒)">
<el-input-number <el-input-number :min="0" controls-position="right" v-model="dataForm.STAY" style="width: 100%" />
:min="0"
controls-position="right"
v-model="dataForm.STAY"
style="width: 100%"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="ACTION" label="入屏方式"> <el-form-item prop="ACTION" label="入屏方式">
<el-select <el-select v-model="dataForm.ACTION" filterable placeholder="请选择">
v-model="dataForm.ACTION" <el-option v-for="item in inScreenModeOptions" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
filterable
placeholder="请选择"
>
<el-option
v-for="item in inScreenModeOptions"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="screenSize" label="屏幕尺寸"> <el-form-item prop="screenSize" label="屏幕尺寸">
<el-select <el-select v-model="dataForm.screenSize" filterable placeholder="请选择" v-if="!devicePixelBoolean">
v-model="dataForm.screenSize" <el-option v-for="item in screenSizeOptions" :key="item.device_pixel" :label="item.device_pixel" :value="item.device_pixel" @click.native="changeScreenSize(item.device_pixel)">
filterable
placeholder="请选择"
v-if="!devicePixelBoolean"
>
<el-option
v-for="item in screenSizeOptions"
:key="item.device_pixel"
:label="item.device_pixel"
:value="item.device_pixel"
@click.native="changeScreenSize(item.device_pixel)"
>
</el-option> </el-option>
</el-select> </el-select>
<el-input <el-input disabled v-model="dataForm.screenSize" v-if="devicePixelBoolean"></el-input>
disabled
v-model="dataForm.screenSize"
v-if="devicePixelBoolean"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -229,72 +129,55 @@
</el-card> </el-card>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button <el-button @click="dataFormSubmitHandle()" v-loading="loading" class="submitButton">确认
@click="dataFormSubmitHandle()"
v-loading="loading"
class="submitButton"
>确认
</el-button> </el-button>
<el-button class="closeButton" @click="handleClose" <el-button class="closeButton" @click="handleClose">取消</el-button>
>取消</el-button
>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { import { getTemplateInfo, addTemplate, addTemplateContent, editTemplateContent, editTemplate, deleteTemplate, getTemplateContent, getGalleryList, getFontSizeByDevicePixel, uploadBoardEditInfo } from '@/api/board/template'
getTemplateInfo, import { devicessize } from '@/api/information/api.js'
addTemplate, import { checkIotBoardContent } from '@/api/board/vocabulary'
addTemplateContent,
editTemplateContent,
editTemplate,
deleteTemplate,
getTemplateContent,
getGalleryList,
getFontSizeByDevicePixel,
uploadBoardEditInfo,
} from "@/api/board/template";
import { devicessize } from "@/api/information/api.js";
import { checkIotBoardContent } from "@/api/board/vocabulary";
export default { export default {
data() { data() {
return { return {
radio1: '0', radio1: '0',
alignmentNum: 2, alignmentNum: 2,
content: "", content: '',
boardWidth: "", boardWidth: '',
boardHeight: "", boardHeight: '',
checkList: [], //复选框一组 checkList: [], //复选框一组
obj: "", obj: '',
imgUrl: [], imgUrl: [],
imgUrlOther: [], imgUrlOther: [],
dialogVisible: false, dialogVisible: false,
fileList: [ fileList: [
{ {
name: "food.jpeg", name: 'food.jpeg',
url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
}, },
{ {
name: "food2.jpeg", name: 'food2.jpeg',
url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
}, }
], ],
listquery: [], //拖拽图片 listquery: [], //拖拽图片
curDragImgItem: "", curDragImgItem: '',
visible: false, visible: false,
startTxt_x: "000", startTxt_x: '000',
startTxt_y: "000", startTxt_y: '000',
width: "400", width: '400',
height: "40", height: '40',
// content: "", // content: "",
fontColor: "yellow", fontColor: 'yellow',
fontSize: "24", fontSize: '24',
fontType: "KaiTi", fontType: 'KaiTi',
fontSpacing: 0, fontSpacing: 0,
coordinate: "000000", coordinate: '000000',
url: "", url: '',
previewContent: "", //预览内容 previewContent: '', //预览内容
ispreviewContent: -1, ispreviewContent: -1,
dataForm: {}, dataForm: {},
templateContent: [], templateContent: [],
@ -303,100 +186,100 @@ export default {
screenSize: [ screenSize: [
{ {
required: true, required: true,
message: "请选择分辨率", message: '请选择分辨率',
trigger: "blur", trigger: 'blur'
}, }
], ],
CONTENT: [ CONTENT: [
{ {
required: true, required: true,
message: "请输入详细内容", message: '请输入详细内容',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontColor: [ fontColor: [
{ {
required: true, required: true,
message: "请填写字体颜色", message: '请填写字体颜色',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontSize: [ fontSize: [
{ {
required: true, required: true,
message: "请填写字体大小", message: '请填写字体大小',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontType: [ fontType: [
{ {
required: true, required: true,
message: "请选择字体类型", message: '请选择字体类型',
trigger: "change", trigger: 'change'
}, }
], ],
fontSpacing: [ fontSpacing: [
{ {
required: true, required: true,
message: "请选择字体间距", message: '请选择字体间距',
trigger: "change", trigger: 'change'
}, }
], ],
rollSpeed: [ rollSpeed: [
{ {
required: true, required: true,
message: "请填写滚动速度", message: '请填写滚动速度',
trigger: "blur", trigger: 'blur'
}, }
], ],
stopTime: [ stopTime: [
{ {
required: true, required: true,
message: "请填写停留时间", message: '请填写停留时间',
trigger: "blur", trigger: 'blur'
}, }
], ],
inScreenMode: [ inScreenMode: [
{ {
required: true, required: true,
message: "请选择入屏方式", message: '请选择入屏方式',
trigger: "blur", trigger: 'blur'
}, }
], ]
}, },
fontTypeOptions: [], fontTypeOptions: [],
screenSizeOptions: [], screenSizeOptions: [],
colorOptions: [], colorOptions: [],
isCurrencyOptions: [ isCurrencyOptions: [
{ {
code: "0", code: '0',
content: "通用", content: '通用'
}, },
{ {
code: "1", code: '1',
content: "仅为智能推荐模板", content: '仅为智能推荐模板'
}, }
], ],
inScreenModeOptions: [], inScreenModeOptions: [],
imgSize: [ imgSize: [
{ {
type: "1024*128", type: '1024*128',
name: "全屏", name: '全屏'
}, },
{ {
type: "", type: '',
name: "正常", name: '正常'
}, }
], ],
fontSizeOpt: [], fontSizeOpt: [],
title: "选择图片", title: '选择图片',
loading: false, loading: false,
isAdd: false, isAdd: false,
iotTemplateCategoryList: [], iotTemplateCategoryList: [],
infoType: "", infoType: '',
devicePixelBoolean: false, devicePixelBoolean: false,
categoryRules: false, categoryRules: false
}; }
}, },
// directives: { // directives: {
// drag: function (el, binding, vnode) { // drag: function (el, binding, vnode) {
@ -442,10 +325,10 @@ export default {
computed: { computed: {
divStyle: function () { divStyle: function () {
return { return {
width: this.width + "px", width: this.width + 'px',
height: this.height + "px", height: this.height + 'px'
}; }
}, }
}, },
watch: { watch: {
// "dataForm.CONTENT": { // "dataForm.CONTENT": {
@ -476,88 +359,87 @@ export default {
// }, // },
}, },
mounted() { mounted() {
this.getDicts("iot_template_category").then((res) => { this.getDicts('iot_template_category').then(res => {
this.iotTemplateCategoryList = res.data; this.iotTemplateCategoryList = res.data
// console.log(this.iotTemplateCategoryList, "this.iotTemplateCategoryList"); // console.log(this.iotTemplateCategoryList, "this.iotTemplateCategoryList");
}); })
}, },
created() { created() {
this.getDicts("iot_device_font_type").then((res) => { this.getDicts('iot_device_font_type').then(res => {
this.fontTypeOptions = res.data; this.fontTypeOptions = res.data
// console.log(this.fontTypeOptions, "字体类型"); // console.log(this.fontTypeOptions, "字体类型");
}); })
this.getDicts("iot_devices_font_color").then((res) => { this.getDicts('iot_devices_font_color').then(res => {
this.colorOptions = res.data; this.colorOptions = res.data
// console.log(this.colorOptions, "字体颜色"); // console.log(this.colorOptions, "字体颜色");
}); })
this.getDicts("iot_device_font_inScreen_mode").then((res) => { this.getDicts('iot_device_font_inScreen_mode').then(res => {
this.inScreenModeOptions = res.data; this.inScreenModeOptions = res.data
// console.log(this.inScreenModeOptions, "入屏方式"); // console.log(this.inScreenModeOptions, "入屏方式");
}); })
this.getdevicessize(); this.getdevicessize()
}, },
methods: { methods: {
init(devicePixel, type, mode) { init(devicePixel, type, mode) {
if (devicePixel) { if (devicePixel) {
this.devicePixelBoolean = true; this.devicePixelBoolean = true
this.dataForm.screenSize = devicePixel; this.dataForm.screenSize = devicePixel
this.boardWidth = devicePixel.split("*")[0]; this.boardWidth = devicePixel.split('*')[0]
this.boardHeight = devicePixel.split("*")[1]; this.boardHeight = devicePixel.split('*')[1]
} else { } else {
this.devicePixelBoolean = false; this.devicePixelBoolean = false
(this.boardWidth = "400"), (this.boardHeight = "40"); ;(this.boardWidth = '400'), (this.boardHeight = '40')
} }
// type 1:待下发信息 2:信息模板 // type 1:待下发信息 2:信息模板
// mode 1:工作台弹窗跳转 2：情报板管理跳转 // mode 1:工作台弹窗跳转 2：情报板管理跳转
this.infoType = type; this.infoType = type
if (mode == 1 || type == 1) { if (mode == 1 || type == 1) {
this.categoryRules = false; this.categoryRules = false
} else { } else {
this.categoryRules = true; this.categoryRules = true
} }
// this.title = "新增"; // this.title = "新增";
this.isAdd = !this.dataForm.id; this.isAdd = !this.dataForm.id
this.dialogVisible = true; this.dialogVisible = true
this.templateDelContent = []; this.templateDelContent = []
this.$nextTick(() => { this.$nextTick(() => {
if (this.isAdd) { if (this.isAdd) {
this.$refs["dataForm"] && this.$refs["dataForm"].resetFields(); this.$refs['dataForm'] && this.$refs['dataForm'].resetFields()
this.dataForm.id = ""; this.dataForm.id = ''
this.dataForm = {}; this.dataForm = {}
this.width = "400"; this.width = '400'
this.height = "40"; this.height = '40'
this.dataForm = { this.dataForm = {
CONTENT: "请输入内容", CONTENT: '请输入内容',
COLOR: "yellow", COLOR: 'yellow',
FONT: "黑体", FONT: '黑体',
SPEED: "1", SPEED: '1',
ACTION: "1", ACTION: '1',
// COORDINATE: "", // COORDINATE: "",
STATE: "true", STATE: 'true',
STAY: "5", STAY: '5',
screenSize: devicePixel, screenSize: devicePixel
}; }
this.content = "请输入内容"; this.content = '请输入内容'
} else { } else {
// this.getInfo(); // this.getInfo();
// this.$refs["dataForm"] && this.$refs["dataForm"].clearValidate(); // this.$refs["dataForm"] && this.$refs["dataForm"].clearValidate();
} }
}); })
if (this.dataForm.screenSize) { if (this.dataForm.screenSize) {
this.getFontSizeList(1); this.getFontSizeList(1)
} }
this.$forceUpdate(); this.$forceUpdate()
}, },
getFontSizeList(type) { getFontSizeList(type) {
this.getDicts("iot_device_font_size").then((res) => { this.getDicts('iot_device_font_size').then(res => {
this.fontSizeOpt = res.data; this.fontSizeOpt = res.data
this.dataForm.FONT_SIZE = res.data[3].dictValue this.dataForm.FONT_SIZE = res.data[3].dictValue
if (type) { if (type) {
this.alignment(2) this.alignment(2)
} }
}); })
//TODO 测试数据 后期需转接口 //TODO 测试数据 后期需转接口
/*getFontSizeByDevicePixel(this.dataForm.screenSize).then((res) => { /*getFontSizeByDevicePixel(this.dataForm.screenSize).then((res) => {
@ -571,17 +453,16 @@ export default {
}, },
// 查分辨率 // 查分辨率
getdevicessize() { getdevicessize() {
//TODO 测试数据 需删除走接口 //TODO 测试数据 需删除走接口
this.screenSizeOptions = [ this.screenSizeOptions = [
{ {
"device_pixel": "192*160" device_pixel: '192*160'
}, },
{ {
"device_pixel": "480*48" device_pixel: '480*48'
}, },
{ {
"device_pixel": "768*64" device_pixel: '768*64'
} }
] ]
@ -592,10 +473,10 @@ export default {
});*/ });*/
}, },
changeScreenSize(size) { changeScreenSize(size) {
this.boardWidth = size.split("*")[0]; this.boardWidth = size.split('*')[0]
this.boardHeight = size.split("*")[1]; this.boardHeight = size.split('*')[1]
this.getFontSizeList(); this.getFontSizeList()
this.$forceUpdate(); this.$forceUpdate()
}, },
changeFontSize() { changeFontSize() {
console.log(this.dataForm.FONT_SIZE) console.log(this.dataForm.FONT_SIZE)
@ -608,19 +489,19 @@ export default {
//选择图片弹框关闭事件 //选择图片弹框关闭事件
close() { close() {
this.checkList = []; this.checkList = []
this.dialogVisible = false; this.dialogVisible = false
}, },
faceDrop(e) { faceDrop(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
this.listquery.push(this.curDragImgItem); this.listquery.push(this.curDragImgItem)
}, },
// 全选 // 全选
allowDrop(e) { allowDrop(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
}, },
ondragenter(e) { ondragenter(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
}, },
// 获取信息 // 获取信息
// getInfo() { // getInfo() {
@ -653,80 +534,76 @@ export default {
// }); // });
// if (!valid) return; // if (!valid) return;
if (!this.dataForm.CONTENT.trim()) { if (!this.dataForm.CONTENT.trim()) {
return this.$modal.msgError("当前输入内容为空"); return this.$modal.msgError('当前输入内容为空')
} else if (!this.dataForm.category && this.infoType == 2) { } else if (!this.dataForm.category && this.infoType == 2) {
return this.$modal.msgError("情报板所属类别不能为空"); return this.$modal.msgError('情报板所属类别不能为空')
} }
//走接口检验内容是否包含敏感字段 //走接口检验内容是否包含敏感字段
checkIotBoardContent(this.dataForm.CONTENT).then((response) => { checkIotBoardContent(this.dataForm.CONTENT).then(response => {
if (response.data == 0) { if (response.data == 0) {
return this.$modal.msgError("当前发布内容包含敏感字段，请修改"); return this.$modal.msgError('当前发布内容包含敏感字段，请修改')
} else if (response.data == 2) { } else if (response.data == 2) {
return this.$modal.msgError("当前输入内容为空"); return this.$modal.msgError('当前输入内容为空')
} } else {
else { this.loading = true
this.loading = true;
// let templateId = ""; // let templateId = "";
let method = "put"; let method = 'put'
if (this.isAdd) { if (this.isAdd) {
if (this.infoType == 1) { if (this.infoType == 1) {
// 不走接口 存到待下发信息里 // 不走接口 存到待下发信息里
this.dataForm.STAY = Number(this.dataForm.STAY) * 100; this.dataForm.STAY = Number(this.dataForm.STAY) * 100
this.$emit("addInfo", this.dataForm); this.$emit('addInfo', this.dataForm)
} else { } else {
// 走接口 存到信息模板里 // 走接口 存到信息模板里
const params1 = { const params1 = {
applyType: "", applyType: '',
category: this.dataForm.category, category: this.dataForm.category,
coordinate: "", coordinate: '',
height: "", height: '',
id: "", id: '',
imageUrl: "", imageUrl: '',
imgSizeFrom: "", imgSizeFrom: '',
inScreenMode: this.dataForm.ACTION, inScreenMode: this.dataForm.ACTION,
remark: "", remark: '',
screenSize: this.dataForm.screenSize, screenSize: this.dataForm.screenSize,
stopTime: Number(this.dataForm.STAY) * 100, stopTime: Number(this.dataForm.STAY) * 100,
vmsType: "", vmsType: '',
width: "", width: ''
}; }
const templateContent = []; const templateContent = []
templateContent.push({ templateContent.push({
content: this.dataForm.CONTENT, content: this.dataForm.CONTENT,
coordinate: this.dataForm.COORDINATE, coordinate: this.dataForm.COORDINATE,
fontColor: this.getColorStyle(this.dataForm.COLOR), fontColor: this.getColorStyle(this.dataForm.COLOR),
fontSize: this.dataForm.FONT_SIZE.substring(0, 2), fontSize: this.dataForm.FONT_SIZE.substring(0, 2),
fontSpacing: this.dataForm.SPEED, fontSpacing: this.dataForm.SPEED,
fontType: this.getFontStyle(this.dataForm.FONT), fontType: this.getFontStyle(this.dataForm.FONT)
}); })
// this.$emit("addInfoMode", this.dataForm); // this.$emit("addInfoMode", this.dataForm);
addTemplate(params1, method).then((data) => { addTemplate(params1, method).then(data => {
console.log(data, "新增口"); console.log(data, '新增口')
let params2 = { let params2 = {
templateContent: templateContent, templateContent: templateContent,
templateId: data, templateId: data
}; }
addTemplateContent(params2) addTemplateContent(params2)
.then((res) => { .then(res => {
if (res.code == 200) { if (res.code == 200) {
this.$emit("getActiveNames"); this.$emit('getActiveNames')
this.$message.success("添加成功"); this.$message.success('添加成功')
} }
}) })
.catch((err) => { .catch(err => {
throw err; throw err
}); })
}); })
} }
} else { } else {
// // 修改 // // 修改
// editTemplate(this.dataForm).then((data) => {}); // editTemplate(this.dataForm).then((data) => {});
// this.templateContent.forEach((e) => { // this.templateContent.forEach((e) => {
// e.img = e.imageName; // e.img = e.imageName;
// }); // });
// var params = { // var params = {
// templateContent: this.templateContent, // templateContent: this.templateContent,
// templateId: this.dataForm.id, // templateId: this.dataForm.id,
@ -736,47 +613,47 @@ export default {
// // console.log(response, "返回结果"); // // console.log(response, "返回结果");
// }); // });
} }
this.loading = false; this.loading = false
this.dialogVisible = false; this.dialogVisible = false
this.isAdd = false; this.isAdd = false
this.$emit("refreshDataList", this.dataForm); this.$emit('refreshDataList', this.dataForm)
var textBoard2 = document.getElementsByClassName("textBoard2"); var textBoard2 = document.getElementsByClassName('textBoard2')
textBoard2[0].style.position = "absolute"; textBoard2[0].style.position = 'absolute'
} }
}); })
}, },
/*********************************************业务代码***********************************************/ /*********************************************业务代码***********************************************/
getFontStyle(font) { getFontStyle(font) {
if (font == "宋体") { if (font == '宋体') {
return "Simsun"; return 'Simsun'
} else if (font == "黑体") { } else if (font == '黑体') {
return "SimHei"; return 'SimHei'
} else if (font == "楷体") { } else if (font == '楷体') {
return "KaiTi"; return 'KaiTi'
} else if(font == "仿宋"){ } else if (font == '仿宋') {
return "FangSong"; return 'FangSong'
} else if(font == "隶书"){ } else if (font == '隶书') {
return 'LiSu'; return 'LiSu'
} }
}, },
getColorStyle(font) { getColorStyle(font) {
if (font == "黄色" ) { if (font == '黄色') {
return "yellow"; return 'yellow'
} else if (font == "红色" ) { } else if (font == '红色') {
return "red"; return 'red'
} else if (font == "绿色" || font == 'GreenYellow') { } else if (font == '绿色' || font == 'GreenYellow') {
return "#00FF00"; return '#00FF00'
} else if (font == "蓝色") { } else if (font == '蓝色') {
return "blue"; return 'blue'
} else { } else {
return font; return font
} }
}, },
// 文字对齐方式 // 文字对齐方式
alignment(alignmentNum) { alignment(alignmentNum) {
this.alignmentNum = alignmentNum; this.alignmentNum = alignmentNum
var divContent2 = document.getElementsByClassName("blackBoard2"); var divContent2 = document.getElementsByClassName('blackBoard2')
var textBoard2 = document.getElementsByClassName("textBoard2"); var textBoard2 = document.getElementsByClassName('textBoard2')
// 获取文字长宽 // 获取文字长宽
// let textWidth = textBoard2[0].offsetWidth; // let textWidth = textBoard2[0].offsetWidth;
// let textHeight = textBoard2[0].offsetHeight; // let textHeight = textBoard2[0].offsetHeight;
@ -788,58 +665,58 @@ export default {
switch (alignmentNum) { switch (alignmentNum) {
// 左对齐 // 左对齐
case 1: case 1:
divContent2[0].style.justifyContent = "left"; divContent2[0].style.justifyContent = 'left'
divContent2[0].style.alignItems = "center"; divContent2[0].style.alignItems = 'center'
// textBoard2[0].style.textAlign = "left"; // textBoard2[0].style.textAlign = "left";
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
// 左右居中 // 左右居中
case 2: case 2:
divContent2[0].style.justifyContent = "center"; divContent2[0].style.justifyContent = 'center'
divContent2[0].style.alignItems = "center"; divContent2[0].style.alignItems = 'center'
// textBoard2[0].style.textAlign = "center"; // textBoard2[0].style.textAlign = "center";
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
// 右对齐 // 右对齐
case 3: case 3:
divContent2[0].style.justifyContent = "right"; divContent2[0].style.justifyContent = 'right'
divContent2[0].style.alignItems = "center"; divContent2[0].style.alignItems = 'center'
// textBoard2[0].style.textAlign = "right"; // textBoard2[0].style.textAlign = "right";
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
// 上对齐 // 上对齐
case 4: case 4:
divContent2[0].style.alignItems = "flex-start"; divContent2[0].style.alignItems = 'flex-start'
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
// 上下对齐 // 上下对齐
case 5: case 5:
divContent2[0].style.alignItems = "center"; divContent2[0].style.alignItems = 'center'
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
// 下对齐 // 下对齐
case 6: case 6:
divContent2[0].style.alignItems = "flex-end"; divContent2[0].style.alignItems = 'flex-end'
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
break; break
} }
if (!alignmentNum) { if (!alignmentNum) {
divContent2[0].style.alignItems = "center"; divContent2[0].style.alignItems = 'center'
textBoard2[0].style.position = "static"; textBoard2[0].style.position = 'static'
} }
var textLeft = this.addZero(textBoard2[0].offsetLeft); var textLeft = this.addZero(textBoard2[0].offsetLeft)
var textTop = this.addZero(textBoard2[0].offsetTop); var textTop = this.addZero(textBoard2[0].offsetTop)
this.dataForm.COORDINATE = textLeft + textTop; this.dataForm.COORDINATE = textLeft + textTop
// console.log(this.dataForm.COORDINATE, "this.dataForm.COORDINATE"); // console.log(this.dataForm.COORDINATE, "this.dataForm.COORDINATE");
}, },
addZero(num) { addZero(num) {
return ("000" + num).slice(-3); return ('000' + num).slice(-3)
}, },
/*增加新的内容*/ /*增加新的内容*/
@ -862,31 +739,27 @@ export default {
// } // }
// }, // },
cliTest(data) { cliTest(data) {
this.ispreviewContent = this.templateContent.indexOf(data); this.ispreviewContent = this.templateContent.indexOf(data)
}, },
/********************图片上传*********************/ /********************图片上传*********************/
handleRemove(file, fileList) {}, handleRemove(file, fileList) {},
handlePreview(file) {}, handlePreview(file) {},
handleExceed(files, fileList) { handleExceed(files, fileList) {
this.$modal.msgError( this.$modal.msgError(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`)
`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
files.length + fileList.length
} 个文件`
);
}, },
beforeRemove(file, fileList) { beforeRemove(file, fileList) {
return this.$confirm(`确定移除 ${file.name}？`); return this.$confirm(`确定移除 ${file.name}？`)
}, },
handleClose(done) { handleClose(done) {
var textBoard2 = document.getElementsByClassName("textBoard2"); var textBoard2 = document.getElementsByClassName('textBoard2')
textBoard2[0].style.position = "absolute"; textBoard2[0].style.position = 'absolute'
this.dialogVisible = false; this.dialogVisible = false
}, }
}, }
}; }
</script> </script>
<style lang="less" scoped> <style lang="scss" scoped>
.infoBoardButton { .infoBoardButton {
::v-deep .el-radio-button--medium .el-radio-button__inner { ::v-deep .el-radio-button--medium .el-radio-button__inner {
height: 3vh; height: 3vh;

587
ruoyi-ui/src/views/information/board/editInfo.vue
View File

@ -1,31 +1,17 @@
<template> <template>
<div class="container infoBoardDialog"> <div class="container infoBoardDialog">
<!-- 添加信息弹窗 --> <!-- 添加信息弹窗 -->
<el-dialog <el-dialog title="修改" :visible.sync="dialogVisible" width="42%" :before-close="closeDialog" :close-on-click-modal="false">
title="修改"
:visible.sync="dialogVisible"
width="42%"
:before-close="closeDialog"
:close-on-click-modal="false"
>
<div class="dialogStyleBox"> <div class="dialogStyleBox">
<div class="dialogLine"></div> <div class="dialogLine"></div>
<div class="dialogCloseButton"></div> <div class="dialogCloseButton"></div>
</div> </div>
<el-card class="box-card"> <el-card class="box-card">
<div <div class="blackBoard1" v-on:ondragenter="ondragenter" v-on:drop="faceDrop" v-on:dragover="allowDrop" :style="{
class="blackBoard1"
v-on:ondragenter="ondragenter"
v-on:drop="faceDrop"
v-on:dragover="allowDrop"
:style="{
width: getDevicePixel(boardWidth, 0), width: getDevicePixel(boardWidth, 0),
height: getDevicePixel(boardHeight, 1), height: getDevicePixel(boardHeight, 1),
}" }">
> <span class="textBoard1 boardTextStyle" :style="{
<span
class="textBoard1 boardTextStyle"
:style="{
color: getColorStyle(dataForm.COLOR), color: getColorStyle(dataForm.COLOR),
fontSize: getFontSize(dataForm.FONT_SIZE), fontSize: getFontSize(dataForm.FONT_SIZE),
fontFamily: dataForm.FONT, fontFamily: dataForm.FONT,
@ -33,40 +19,22 @@
left: getCoordinate(dataForm.COORDINATE.substring(0, 3), 0), left: getCoordinate(dataForm.COORDINATE.substring(0, 3), 0),
top: getCoordinate(dataForm.COORDINATE.substring(3, 6), 1), top: getCoordinate(dataForm.COORDINATE.substring(3, 6), 1),
maxHeight:getDevicePixel(boardHeight, 1), maxHeight:getDevicePixel(boardHeight, 1),
}" }" v-html="
v-html="
dataForm.CONTENT.replace(/\n|\r\n/g, '<br>').replace( dataForm.CONTENT.replace(/\n|\r\n/g, '<br>').replace(
/ /g, / /g,
'&nbsp' '&nbsp'
) )
" "></span>
></span>
</div> </div>
</el-card> </el-card>
<el-card> <el-card>
<el-form <el-form :model="dataForm" :rules="dataRule" label-width="90px" ref="dataForm" size="mini">
:model="dataForm"
:rules="dataRule"
label-width="90px"
ref="dataForm"
size="mini"
>
<el-row :gutter="24" style="height: 45px"> <el-row :gutter="24" style="height: 45px">
<el-col :span="8" v-show="this.boardEmitItem.type == 2 || this.dataForm.category"> <el-col :span="8" v-show="this.boardEmitItem.type == 2 || this.dataForm.category">
<el-form-item prop="category" label="所属类别"> <el-form-item prop="category" label="所属类别">
<el-select <el-select v-model="dataForm.category" placeholder="请选择所属类别" size="mini" disabled>
v-model="dataForm.category" <el-option v-for="item in iotTemplateCategoryList" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
placeholder="请选择所属类别"
size="mini"
disabled
>
<el-option
v-for="item in iotTemplateCategoryList"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -97,63 +65,29 @@
flex-wrap: wrap;width:100%"> flex-wrap: wrap;width:100%">
<el-col :span="24"> <el-col :span="24">
<el-form-item label="详细内容" prop="CONTENT"> <el-form-item label="详细内容" prop="CONTENT">
<el-input <el-input type="textarea" clearable id="textContent" placeholder="详细内容" v-model="dataForm.CONTENT" @keyup.native="keyDown($event)"></el-input>
type="textarea"
clearable
id="textContent"
placeholder="详细内容"
v-model="dataForm.CONTENT"
@keyup.native="keyDown($event)"
></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="COLOR" label="字体颜色"> <el-form-item prop="COLOR" label="字体颜色">
<el-select <el-select v-model="dataForm.COLOR" filterable placeholder="请选择">
v-model="dataForm.COLOR" <el-option v-for="item in colorOptions" :key="item.cssClass" :label="item.dictLabel" :value="item.cssClass">
filterable
placeholder="请选择"
>
<el-option
v-for="item in colorOptions"
:key="item.cssClass"
:label="item.dictLabel"
:value="item.cssClass"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="FONT_SIZE" label="字体大小"> <el-form-item prop="FONT_SIZE" label="字体大小">
<el-select <el-select v-model="dataForm.FONT_SIZE" style="width: 100%" @change="changeFontSize">
v-model="dataForm.FONT_SIZE" <el-option v-for="item in fontSizeOpt" :key="item.dictLabel" :label="item.dictLabel" :value="item.dictLabel">
style="width: 100%"
@change="changeFontSize"
>
<el-option
v-for="item in fontSizeOpt"
:key="item.dictLabel"
:label="item.dictLabel"
:value="item.dictLabel"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="FONT" label="字体类型"> <el-form-item prop="FONT" label="字体类型">
<el-select <el-select v-model="dataForm.FONT" filterable placeholder="请选择">
v-model="dataForm.FONT" <el-option v-for="item in fontTypeOptions" :key="item.cssClass" :label="item.dictLabel" :value="item.cssClass">
filterable
placeholder="请选择"
>
<el-option
v-for="item in fontTypeOptions"
:key="item.cssClass"
:label="item.dictLabel"
:value="item.cssClass"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -184,27 +118,13 @@
</el-col> --> </el-col> -->
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="STAY" label="停留时间(秒)"> <el-form-item prop="STAY" label="停留时间(秒)">
<el-input-number <el-input-number :min="0" controls-position="right" v-model="dataForm.STAY" style="width: 100%" />
:min="0"
controls-position="right"
v-model="dataForm.STAY"
style="width: 100%"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="8"> <el-col :span="8">
<el-form-item prop="ACTION" label="入屏方式"> <el-form-item prop="ACTION" label="入屏方式">
<el-select <el-select v-model="dataForm.ACTION" filterable placeholder="请选择">
v-model="dataForm.ACTION" <el-option v-for="item in inScreenModeOptions" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue">
filterable
placeholder="请选择"
>
<el-option
v-for="item in inScreenModeOptions"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
@ -239,15 +159,9 @@
</el-card> </el-card>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button <el-button @click="dataFormSubmitHandle()" v-loading="loading" class="submitButton">确认
@click="dataFormSubmitHandle()"
v-loading="loading"
class="submitButton"
>确认
</el-button> </el-button>
<el-button @click="closeDialog()" class="closeButton" <el-button @click="closeDialog()" class="closeButton">取消</el-button>
>取消</el-button
>
</div> </div>
</el-dialog> </el-dialog>
</div> </div>
@ -265,40 +179,40 @@ import {
editTemplateContent, editTemplateContent,
getGalleryList, getGalleryList,
uploadBoardEditInfo, uploadBoardEditInfo,
getFontSizeByDevicePixel, getFontSizeByDevicePixel
} from "@/api/board/template"; } from '@/api/board/template'
import { checkIotBoardContent } from "@/api/board/vocabulary"; import { checkIotBoardContent } from '@/api/board/vocabulary'
import { HashMap } from "@/api/board/informationBoard"; import { HashMap } from '@/api/board/informationBoard'
// 对象深拷贝 // 对象深拷贝
export const deepClone = (data) => { export const deepClone = data => {
// 封装的判断数据类型的方法 // 封装的判断数据类型的方法
var type = typeof data; var type = typeof data
var obj; var obj
if (type === "array") { if (type === 'array') {
obj = []; obj = []
} else if (type === "object") { } else if (type === 'object') {
obj = {}; obj = {}
} else { } else {
// 不再具有下一层次 // 不再具有下一层次
return data; return data
} }
if (type === "array") { if (type === 'array') {
for (var i = 0, len = data.length; i < len; i++) { for (var i = 0, len = data.length; i < len; i++) {
obj.push(deepClone(data[i])); obj.push(deepClone(data[i]))
} }
} else if (type === "object") { } else if (type === 'object') {
for (var key in data) { for (var key in data) {
obj[key] = deepClone(data[key]); obj[key] = deepClone(data[key])
}
} }
return obj
} }
return obj;
};
export default { export default {
props: { props: {
boardEmitItem: { boardEmitItem: {
required: true, required: true,
type: Object, type: Object
}, }
}, },
data() { data() {
@ -306,48 +220,48 @@ export default {
radio1: '0', radio1: '0',
alignmentNum: 2, alignmentNum: 2,
iotTemplateCategoryList: [], iotTemplateCategoryList: [],
content: "", content: '',
boardWidth: "", boardWidth: '',
boardHeight: "", boardHeight: '',
// boardEmitItem:this.boardEmitItem, // boardEmitItem:this.boardEmitItem,
disabled: true, disabled: true,
checkList: [], //复选框一组 checkList: [], //复选框一组
obj: "", obj: '',
imgUrl: [], imgUrl: [],
imgUrlOther: [], imgUrlOther: [],
dialogVisible: false, dialogVisible: false,
fileList: [ fileList: [
{ {
name: "food.jpeg", name: 'food.jpeg',
url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
}, },
{ {
name: "food2.jpeg", name: 'food2.jpeg',
url: "https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100", url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'
}, }
], ],
listquery: [], //拖拽图片 listquery: [], //拖拽图片
curDragImgItem: "", curDragImgItem: '',
visible: false, visible: false,
startTxt_x: "000", startTxt_x: '000',
startTxt_y: "000", startTxt_y: '000',
width: "400", width: '400',
height: "40", height: '40',
content: "", content: '',
fontColor: "yellow", fontColor: 'yellow',
fontSize: "24", fontSize: '24',
fontType: "KaiTi", fontType: 'KaiTi',
fontSpacing: 0, fontSpacing: 0,
coordinate: "000000", coordinate: '000000',
url: "", url: '',
previewContent: "", //预览内容 previewContent: '', //预览内容
ispreviewContent: -1, ispreviewContent: -1,
dataForm: { dataForm: {
CONTENT: '', CONTENT: '',
STAY: '', STAY: '',
FONT: '', FONT: '',
COORDINATE:'', COORDINATE: ''
// id: "", // id: "",
// screenSize: "400*40", //屏幕尺寸 // screenSize: "400*40", //屏幕尺寸
@ -363,45 +277,45 @@ export default {
// width: "", // width: "",
// coordinate: "", //起始点位置;前3位代表x点的位值，后3位代表y点的位置 // coordinate: "", //起始点位置;前3位代表x点的位值，后3位代表y点的位置
}, },
templateContentModel: "", templateContentModel: '',
templateContent: [], templateContent: [],
templateDelContent: [], templateDelContent: [],
fontTypeOptions: [], fontTypeOptions: [],
screenSizeOptions: [ screenSizeOptions: [
{ {
type: "400*40", type: '400*40'
}, },
{ {
type: "128*64", type: '128*64'
}, }
], ],
colorOptions: [], colorOptions: [],
isCurrencyOptions: [ isCurrencyOptions: [
{ {
code: "0", code: '0',
content: "通用", content: '通用'
}, },
{ {
code: "1", code: '1',
content: "仅为智能推荐模板", content: '仅为智能推荐模板'
}, }
], ],
inScreenModeOptions: [], inScreenModeOptions: [],
imgSize: [ imgSize: [
{ {
type: "1024*128", type: '1024*128',
name: "全屏", name: '全屏'
}, },
{ {
type: "", type: '',
name: "正常", name: '正常'
}, }
], ],
fontSizeOpt: [], fontSizeOpt: [],
title: "选择图片", title: '选择图片',
loading: false, loading: false,
isAdd: false, isAdd: false
}; }
}, },
// directives: { // directives: {
// drag: function (el, binding, vnode) { // drag: function (el, binding, vnode) {
@ -451,67 +365,67 @@ export default {
CONTENT: [ CONTENT: [
{ {
required: true, required: true,
message: "请输入详细内容", message: '请输入详细内容',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontColor: [ fontColor: [
{ {
required: true, required: true,
message: "请填写字体颜色", message: '请填写字体颜色',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontSize: [ fontSize: [
{ {
required: true, required: true,
message: "请填写字体大小", message: '请填写字体大小',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontType: [ fontType: [
{ {
required: true, required: true,
message: "请选择字体类型", message: '请选择字体类型',
trigger: "blur", trigger: 'blur'
}, }
], ],
fontSpacing: [ fontSpacing: [
{ {
required: true, required: true,
message: "请选择字体间距", message: '请选择字体间距',
trigger: "blur", trigger: 'blur'
}, }
], ],
rollSpeed: [ rollSpeed: [
{ {
required: true, required: true,
message: "请填写滚动速度", message: '请填写滚动速度',
trigger: "blur", trigger: 'blur'
}, }
], ],
stopTime: [ stopTime: [
{ {
required: true, required: true,
message: "请填写停留时间", message: '请填写停留时间',
trigger: "blur", trigger: 'blur'
}, }
], ],
inScreenMode: [ inScreenMode: [
{ {
required: true, required: true,
message: "请选择入屏方式", message: '请选择入屏方式',
trigger: "blur", trigger: 'blur'
}, }
], ]
}; }
}, },
divStyle: function () { divStyle: function () {
return { return {
width: this.width + "px", width: this.width + 'px',
height: this.height + "px", height: this.height + 'px'
}; }
}, }
}, },
watch: { watch: {
// boardEmitItem(newval){ // boardEmitItem(newval){
@ -526,53 +440,47 @@ export default {
// }, // },
}, },
created() { created() {
console.log(this.boardEmitItem, "this.boardEmitItem"); console.log(this.boardEmitItem, 'this.boardEmitItem')
this.getDicts("iot_template_category").then((res) => { this.getDicts('iot_template_category').then(res => {
this.iotTemplateCategoryList = res.data; this.iotTemplateCategoryList = res.data
console.log(this.iotTemplateCategoryList, "this.iotTemplateCategoryList"); console.log(this.iotTemplateCategoryList, 'this.iotTemplateCategoryList')
}); })
this.getDicts("iot_device_font_type").then((res) => { this.getDicts('iot_device_font_type').then(res => {
this.fontTypeOptions = res.data; this.fontTypeOptions = res.data
console.log(this.fontTypeOptions, "字体类型"); console.log(this.fontTypeOptions, '字体类型')
}); })
this.getDicts("iot_devices_font_color").then((res) => { this.getDicts('iot_devices_font_color').then(res => {
this.colorOptions = res.data; this.colorOptions = res.data
console.log(this.colorOptions, "字体颜色"); console.log(this.colorOptions, '字体颜色')
}); })
// this.getDicts("iot_device_font_size").then((res) => { // this.getDicts("iot_device_font_size").then((res) => {
// this.fontSizeOpt = res.data; // this.fontSizeOpt = res.data;
// console.log(this.fontSizeOpt, "字体大小"); // console.log(this.fontSizeOpt, "字体大小");
// }); // });
this.getDicts("iot_device_font_inScreen_mode").then((res) => { this.getDicts('iot_device_font_inScreen_mode').then(res => {
this.inScreenModeOptions = res.data; this.inScreenModeOptions = res.data
console.log(this.inScreenModeOptions, "入屏方式"); console.log(this.inScreenModeOptions, '入屏方式')
}); })
if (this.boardEmitItem) { if (this.boardEmitItem) {
this.boardWidth = this.boardEmitItem.screenSize.split("*")[0]; this.boardWidth = this.boardEmitItem.screenSize.split('*')[0]
this.boardHeight = this.boardEmitItem.screenSize.split("*")[1]; this.boardHeight = this.boardEmitItem.screenSize.split('*')[1]
this.init(); this.init()
} }
}, },
methods: { methods: {
init() { init() {
this.title = "修改"; this.title = '修改'
this.dialogVisible = true; this.dialogVisible = true
this.itemPropertyMap = new HashMap(); this.itemPropertyMap = new HashMap()
this.alignmentNum = 2 this.alignmentNum = 2
this.dataForm = JSON.parse(JSON.stringify(this.boardEmitItem)); this.dataForm = JSON.parse(JSON.stringify(this.boardEmitItem))
this.dataForm.COLOR = this.getColorValue(this.boardEmitItem.COLOR) this.dataForm.COLOR = this.getColorValue(this.boardEmitItem.COLOR)
console.log(this.dataForm,"this.dataForm") console.log(this.dataForm, 'this.dataForm')
// this.dataForm.FONT = this.getFont(this.boardEmitItem.FONT) // this.dataForm.FONT = this.getFont(this.boardEmitItem.FONT)
this.dataForm.CONTENT = JSON.parse( this.dataForm.CONTENT = JSON.parse(JSON.stringify(this.boardEmitItem.CONTENT.replace('<br>', '\n').replace(/ /g, ' ').replace('<r><n>', '\n')))
JSON.stringify( this.dataForm.STAY = JSON.parse(JSON.stringify(Number(this.boardEmitItem.STAY) / 100))
this.boardEmitItem.CONTENT.replace("<br>", "\n").replace(/ /g, " ").replace("<r><n>", "\n") this.getFontSizeList()
)
);
this.dataForm.STAY = JSON.parse(
JSON.stringify(Number(this.boardEmitItem.STAY) / 100)
);
this.getFontSizeList();
}, },
getColorValue(color) { getColorValue(color) {
if (color == '#00FF00') { if (color == '#00FF00') {
@ -582,9 +490,9 @@ export default {
} }
}, },
getFontSizeList() { getFontSizeList() {
this.getDicts("iot_device_font_size").then((res) => { this.getDicts('iot_device_font_size').then(res => {
this.fontSizeOpt = res.data; this.fontSizeOpt = res.data
}); })
/* getFontSizeByDevicePixel(this.dataForm.screenSize).then((res) => { /* getFontSizeByDevicePixel(this.dataForm.screenSize).then((res) => {
console.log(res, "根据分辨率筛字体大小"); console.log(res, "根据分辨率筛字体大小");
@ -594,66 +502,66 @@ export default {
changeFontSize() { changeFontSize() {
setTimeout(() => { setTimeout(() => {
this.alignment(this.alignmentNum) this.alignment(this.alignmentNum)
},100); }, 100)
}, },
alignment(alignmentNum) { alignment(alignmentNum) {
var divContent1 = document.getElementsByClassName("blackBoard1"); var divContent1 = document.getElementsByClassName('blackBoard1')
var textBoard1 = document.getElementsByClassName("textBoard1"); var textBoard1 = document.getElementsByClassName('textBoard1')
switch (alignmentNum) { switch (alignmentNum) {
// 左对齐 // 左对齐
case 1: case 1:
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
divContent1[0].style.justifyContent = "left"; divContent1[0].style.justifyContent = 'left'
divContent1[0].style.alignItems = "center"; divContent1[0].style.alignItems = 'center'
break; break
// 左右居中 // 左右居中
case 2: case 2:
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
divContent1[0].style.justifyContent = "center"; divContent1[0].style.justifyContent = 'center'
divContent1[0].style.alignItems = "center"; divContent1[0].style.alignItems = 'center'
break; break
// 右对齐 // 右对齐
case 3: case 3:
divContent1[0].style.justifyContent = "right"; divContent1[0].style.justifyContent = 'right'
divContent1[0].style.alignItems = "center"; divContent1[0].style.alignItems = 'center'
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
break; break
// 上对齐 // 上对齐
case 4: case 4:
divContent1[0].style.alignItems = "flex-start"; divContent1[0].style.alignItems = 'flex-start'
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
break; break
// 上下对齐 // 上下对齐
case 5: case 5:
divContent1[0].style.alignItems = "center"; divContent1[0].style.alignItems = 'center'
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
break; break
// 下对齐 // 下对齐
case 6: case 6:
divContent1[0].style.alignItems = "flex-end"; divContent1[0].style.alignItems = 'flex-end'
textBoard1[0].style.position = "static"; textBoard1[0].style.position = 'static'
break; break
} }
var textLeft = this.addZero(JSON.parse(JSON.stringify(textBoard1[0].offsetLeft))); var textLeft = this.addZero(JSON.parse(JSON.stringify(textBoard1[0].offsetLeft)))
var textTop = this.addZero(textBoard1[0].offsetTop); var textTop = this.addZero(textBoard1[0].offsetTop)
this.dataForm.COORDINATE = textLeft + textTop; this.dataForm.COORDINATE = textLeft + textTop
}, },
addZero(num) { addZero(num) {
if (num < 0) { if (num < 0) {
return '000' return '000'
} else { } else {
return ("000" + num).slice(-3); return ('000' + num).slice(-3)
} }
}, },
faceDrop(e) { faceDrop(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
this.listquery.push(this.curDragImgItem); this.listquery.push(this.curDragImgItem)
}, },
/* 拆分分辨率大小 */ /* 拆分分辨率大小 */
// resolvingPowerType(data) { // resolvingPowerType(data) {
@ -664,36 +572,35 @@ export default {
// }, // },
// 全选 // 全选
allowDrop(e) { allowDrop(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
}, },
ondragenter(e) { ondragenter(e) {
e.preventDefault(); //阻止默认行为 e.preventDefault() //阻止默认行为
}, },
keyDown(ev) { keyDown(ev) {
this.alignment(this.alignmentNum) this.alignment(this.alignmentNum)
}, },
// 表单确认 // 表单确认
dataFormSubmitHandle() { dataFormSubmitHandle() {
console.log(this.dataForm.type, "this.dataForm.type"); console.log(this.dataForm.type, 'this.dataForm.type')
if (!this.dataForm.CONTENT.trim()) { if (!this.dataForm.CONTENT.trim()) {
return this.$modal.msgError("当前输入内容为空"); return this.$modal.msgError('当前输入内容为空')
} }
checkIotBoardContent(this.dataForm.CONTENT).then((response) => { checkIotBoardContent(this.dataForm.CONTENT).then(response => {
if (response.data == 0) { if (response.data == 0) {
return this.$modal.msgError("当前发布内容包含敏感字段，请修改"); return this.$modal.msgError('当前发布内容包含敏感字段，请修改')
} else if (response.data == 2) { } else if (response.data == 2) {
return this.$modal.msgError("当前输入内容为空"); return this.$modal.msgError('当前输入内容为空')
} } else {
else { this.loading = true
this.loading = true; console.log(this.dataForm, '点击修改 表单')
console.log(this.dataForm, "点击修改 表单");
this.loading = false; this.loading = false
this.isAdd = false; this.isAdd = false
if (this.dataForm.type == 1) { if (this.dataForm.type == 1) {
this.dataForm.STAY = Number(this.dataForm.STAY) * 100; this.dataForm.STAY = Number(this.dataForm.STAY) * 100
this.$emit("receiveForm", this.dataForm); this.$emit('receiveForm', this.dataForm)
console.log(this.dataForm, "this.dataForm修改后给父组件传表单内容"); console.log(this.dataForm, 'this.dataForm修改后给父组件传表单内容')
} else { } else {
const tcontent = { const tcontent = {
content: this.dataForm.CONTENT, content: this.dataForm.CONTENT,
@ -714,10 +621,10 @@ export default {
templateId: this.dataForm.id, templateId: this.dataForm.id,
updateBy: null, updateBy: null,
updateTime: null, updateTime: null,
width: null, width: null
}; }
const param = { const param = {
applyType: "", applyType: '',
category: this.dataForm.category, category: this.dataForm.category,
createBy: null, createBy: null,
createTime: null, createTime: null,
@ -726,7 +633,7 @@ export default {
inScreenMode: this.dataForm.ACTION, inScreenMode: this.dataForm.ACTION,
isCurrency: null, isCurrency: null,
params: {}, params: {},
remark: "", remark: '',
screenSize: this.dataForm.screenSize, screenSize: this.dataForm.screenSize,
searchValue: null, searchValue: null,
stopTime: Number(this.dataForm.STAY) * 100, stopTime: Number(this.dataForm.STAY) * 100,
@ -734,12 +641,12 @@ export default {
templateType: null, templateType: null,
updateBy: null, updateBy: null,
updateTime: null, updateTime: null,
vmsType: "", vmsType: '',
tcontent: tcontent, tcontent: tcontent,
templateId: this.dataForm.id, templateId: this.dataForm.id
}; }
editTemplate(param).then((data) => {}); editTemplate(param).then(data => {})
let templateContent = []; let templateContent = []
templateContent.push({ templateContent.push({
content: this.dataForm.CONTENT, content: this.dataForm.CONTENT,
fontColor: this.dataForm.COLOR, fontColor: this.dataForm.COLOR,
@ -748,101 +655,101 @@ export default {
fontSpacing: this.dataForm.SPEED, fontSpacing: this.dataForm.SPEED,
coordinate: this.dataForm.COORDINATE, coordinate: this.dataForm.COORDINATE,
id: this.dataForm.tcontentsId, id: this.dataForm.tcontentsId,
templateId: this.dataForm.id, templateId: this.dataForm.id
}); })
var params = { var params = {
templateContent: templateContent, templateContent: templateContent,
templateId: this.dataForm.id, templateId: this.dataForm.id,
templateDelContent: [], templateDelContent: []
};
console.log(params,"params")
editTemplateContent(params).then((response) => {
console.log(response, "返回结果");
this.$modal.msgSuccess("修改成功");
});
this.$forceUpdate();
} }
this.closeDialog(); console.log(params, 'params')
editTemplateContent(params).then(response => {
console.log(response, '返回结果')
this.$modal.msgSuccess('修改成功')
})
this.$forceUpdate()
} }
}); this.closeDialog()
}
})
}, },
getFontStyle(font) { getFontStyle(font) {
if (font == "宋体") { if (font == '宋体') {
return "Simsun"; return 'Simsun'
} else if (font == "黑体") { } else if (font == '黑体') {
return "SimHei"; return 'SimHei'
} else if (font == "楷体") { } else if (font == '楷体') {
return "KaiTi"; return 'KaiTi'
} else if(font == "仿宋"){ } else if (font == '仿宋') {
return "FangSong"; return 'FangSong'
} else if(font == "隶书"){ } else if (font == '隶书') {
return 'LiSu'; return 'LiSu'
} }
}, },
getColorStyle(font) { getColorStyle(font) {
if (font == "黄色" ) { if (font == '黄色') {
return "yellow"; return 'yellow'
} else if (font == "红色" ) { } else if (font == '红色') {
return "red"; return 'red'
} else if (font == "绿色" || font == 'GreenYellow') { } else if (font == '绿色' || font == 'GreenYellow') {
return "#00FF00"; return '#00FF00'
} else if (font == "蓝色") { } else if (font == '蓝色') {
return "blue"; return 'blue'
} else { } else {
return font; return font
} }
}, },
closeDialog() { closeDialog() {
this.dialogVisible = false; this.dialogVisible = false
this.$emit("dialogClose"); this.$emit('dialogClose')
}, },
getDevicePixel(devicePixel, num) { getDevicePixel(devicePixel, num) {
if (num == 0) { if (num == 0) {
if (devicePixel > 768) { if (devicePixel > 768) {
return 768 + "px"; return 768 + 'px'
} else { } else {
return devicePixel + "px"; return devicePixel + 'px'
} }
} else if (num == 1) { } else if (num == 1) {
if (devicePixel > 128) { if (devicePixel > 128) {
return 128 + "px"; return 128 + 'px'
} else { } else {
return devicePixel + "px"; return devicePixel + 'px'
} }
} }
}, },
getCoordinate(coordinate, num) { getCoordinate(coordinate, num) {
if (num == 0) { if (num == 0) {
if (this.boardWidth > 768) { if (this.boardWidth > 768) {
let i = this.boardWidth / 768; let i = this.boardWidth / 768
console.log(coordinate / i,"width") console.log(coordinate / i, 'width')
return coordinate / i + "px"; return coordinate / i + 'px'
} else { } else {
return coordinate + "px"; return coordinate + 'px'
} }
} else if (num == 1) { } else if (num == 1) {
if (this.boardHeight > 128) { if (this.boardHeight > 128) {
let i = this.boardHeight / 128; let i = this.boardHeight / 128
console.log(coordinate / i,"height") console.log(coordinate / i, 'height')
return coordinate / i + "px"; return coordinate / i + 'px'
} else { } else {
return coordinate + "px"; return coordinate + 'px'
} }
} }
}, },
getFontSize(size) { getFontSize(size) {
if (this.boardWidth > 768) { if (this.boardWidth > 768) {
let i = this.boardWidth / 768; let i = this.boardWidth / 768
return size.substring(0, 2) / i - 2 + "px"; return size.substring(0, 2) / i - 2 + 'px'
} else { } else {
return size; return size
}
}
}
} }
},
},
};
</script> </script>
<style lang="less" scoped> <style lang="scss" scoped>
.previewContentCSS { .previewContentCSS {
border: yellow 1px dashed; border: yellow 1px dashed;
} }

104
ruoyi-ui/src/views/map/index.vue
View File

@ -220,6 +220,110 @@ export default {
// 切换 结束 // 切换 结束
// 创建一条折线覆盖物
const path = [
new AMap.LngLat(116.865165, 36.579797),
new AMap.LngLat(116.836089, 36.58322),
new AMap.LngLat(116.831626, 36.583237),
new AMap.LngLat(116.825747, 36.582531),
new AMap.LngLat(116.821176, 36.581377),
new AMap.LngLat(116.813001, 36.578309),
new AMap.LngLat(116.808194, 36.575242),
new AMap.LngLat(116.803409, 36.571175),
new AMap.LngLat(116.799568, 36.566195),
new AMap.LngLat(116.786029, 36.538219),
new AMap.LngLat(116.783625, 36.534615),
new AMap.LngLat(116.77618, 36.526029),
new AMap.LngLat(116.76691, 36.517855),
new AMap.LngLat(116.762168, 36.513095),
new AMap.LngLat(116.751074, 36.49966),
new AMap.LngLat(116.730174, 36.48108),
new AMap.LngLat(116.726291, 36.476957),
new AMap.LngLat(116.722922, 36.472747),
new AMap.LngLat(116.707901, 36.451365),
new AMap.LngLat(116.705069, 36.44667),
new AMap.LngLat(116.702065, 36.440732),
new AMap.LngLat(116.699833, 36.435173),
new AMap.LngLat(116.69419, 36.417166),
new AMap.LngLat(116.69419, 36.417166),
new AMap.LngLat(116.688976, 36.408756),
new AMap.LngLat(116.684405, 36.404611),
new AMap.LngLat(116.677024, 36.400242),
new AMap.LngLat(116.66593, 36.39677),
new AMap.LngLat(116.658463, 36.394266),
new AMap.LngLat(116.65076, 36.390483),
new AMap.LngLat(116.644644, 36.387028),
new AMap.LngLat(116.637155, 36.384057),
new AMap.LngLat(116.625783, 36.381224),
new AMap.LngLat(116.617092, 36.378615),
new AMap.LngLat(116.609175, 36.375022),
new AMap.LngLat(116.595485, 36.364949),
new AMap.LngLat(116.58688, 36.35662),
new AMap.LngLat(116.58025, 36.351989),
new AMap.LngLat(116.571795, 36.348117),
new AMap.LngLat(116.55435, 36.342846),
new AMap.LngLat(116.545853, 36.338318),
new AMap.LngLat(116.53742, 36.331265),
new AMap.LngLat(116.521777, 36.309619),
new AMap.LngLat(116.516713, 36.305867),
new AMap.LngLat(116.503989, 36.300887),
new AMap.LngLat(116.497509, 36.2962),
new AMap.LngLat(116.486801, 36.27797),
new AMap.LngLat(116.484935, 36.271068),
new AMap.LngLat(116.484505, 36.264736),
new AMap.LngLat(116.483669, 36.261033),
new AMap.LngLat(116.480729, 36.251759),
new AMap.LngLat(116.479849, 36.246343),
new AMap.LngLat(116.480364, 36.24283),
new AMap.LngLat(116.481866, 36.235578),
new AMap.LngLat(116.48178, 36.231666),
new AMap.LngLat(116.479463, 36.225868),
new AMap.LngLat(116.459293, 36.203396),
new AMap.LngLat(116.456267, 36.198029),
new AMap.LngLat(116.454872, 36.192868),
new AMap.LngLat(116.4541, 36.169088),
new AMap.LngLat(116.452791, 36.163389),
new AMap.LngLat(116.450495, 36.158313),
new AMap.LngLat(116.445152, 36.150136),
new AMap.LngLat(116.442663, 36.145076),
new AMap.LngLat(116.441676, 36.133223),
new AMap.LngLat(116.439037, 36.124159),
new AMap.LngLat(116.438071, 36.116862),
new AMap.LngLat(116.438736, 36.111072),
new AMap.LngLat(116.442169, 36.09956),
new AMap.LngLat(116.442084, 36.084285),
new AMap.LngLat(116.441182, 36.070046),
new AMap.LngLat(116.447276, 36.045223),
new AMap.LngLat(116.445023, 36.048536),
new AMap.LngLat(116.432203, 36.018583),
new AMap.LngLat(116.431001, 36.01414),
new AMap.LngLat(116.430658, 36.002336),
new AMap.LngLat(116.412634, 35.974001),
new AMap.LngLat(116.407827, 35.946768),
new AMap.LngLat(116.416754, 35.904509),
new AMap.LngLat(116.411775, 35.887822),
new AMap.LngLat(116.357702, 35.807675),
new AMap.LngLat(116.339849, 35.790828),
new AMap.LngLat(116.33161, 35.780941),
new AMap.LngLat(116.311868, 35.769103),
new AMap.LngLat(116.298822, 35.751969),
new AMap.LngLat(116.261743, 35.724799),
new AMap.LngLat(116.238912, 35.695249),
new AMap.LngLat(116.205782, 35.669314),
new AMap.LngLat(116.182436, 35.640023),
new AMap.LngLat(116.160463, 35.625792),
new AMap.LngLat(116.143297, 35.607651)
]
const polyline = new AMap.Polyline({
path: path,
// showDir: true,
strokeWeight: 10, // 线宽 默认为 1
// strokeColor: '#00ff94', // 线条颜色
// fillColor: ['#FF0000', '#00FF00'], // 从红色渐变到绿色
lineJoin: 'round' // 折线拐点连接处样式
})
this.map.add(polyline)
this.addMarkDataList = [] this.addMarkDataList = []
this.infoWindow = new window.AMap.InfoWindow({ offset: new AMap.Pixel(0, 0), anchor: 'middle-right' }) this.infoWindow = new window.AMap.InfoWindow({ offset: new AMap.Pixel(0, 0), anchor: 'middle-right' })
this.markDataList.forEach((item, index) => { this.markDataList.forEach((item, index) => {

7
ruoyi-ui/vue.config.js
View File

@ -34,7 +34,12 @@ module.exports = {
proxy: { proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { [process.env.VUE_APP_BASE_API]: {
target: `http://127.0.0.1:8080`, // target: `http://127.0.0.1:8080`,
// target: `http://10.168.66.196:8080`,
// target: `http://10.168.77.128:8080`,
// target: `http://192.168.0.182:8080`,
target: `http://192.168.0.194:8080`,
// target: `http://10.0.81.201:8080`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: '' ['^' + process.env.VUE_APP_BASE_API]: ''

Write Preview
Loading…
Cancel
Save