|
|
|
<template>
|
|
|
|
<div>
|
|
|
|
<form-container @submit="submitForm"></form-container>
|
|
|
|
<div class="table">
|
|
|
|
<el-table :data="lists" style="width: 100%">
|
|
|
|
<el-table-column prop="code" label="类型">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<span v-if="lists.row.code === 'piaochuang'">漂浮窗</span>
|
|
|
|
<span v-else-if="lists.row.code === 'otherLink'">其他链接</span>
|
|
|
|
<span v-else>其他</span>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="startTime" label="开始时间">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<div @click="changeStatus(lists.$index,'startTime')">
|
|
|
|
<!-- <el-input v-if="statusCode === 'startTime' && statusIndex === lists.$index" :value="lists.row.startTime" /> -->
|
|
|
|
<el-date-picker
|
|
|
|
v-if="statusCode === 'startTime' && statusIndex === lists.$index"
|
|
|
|
v-model="lists.row.startTime"
|
|
|
|
type="datetime"
|
|
|
|
placeholder="选择开始时间"
|
|
|
|
@change="changeTime(lists.row,'startTime',$event)"
|
|
|
|
>
|
|
|
|
</el-date-picker>
|
|
|
|
<div v-else>
|
|
|
|
<span v-if="lists.row.startTime-0">
|
|
|
|
{{ $moment(lists.row.startTime-0).format("YYYY-MM-DD HH:mm") }}
|
|
|
|
</span>
|
|
|
|
<span v-else>
|
|
|
|
暂无
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="endTime" label="结束时间">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<div @click="changeStatus(lists.$index,'endTime')">
|
|
|
|
<el-date-picker
|
|
|
|
v-if="statusCode === 'endTime' && statusIndex === lists.$index"
|
|
|
|
v-model="lists.row.endTime"
|
|
|
|
type="datetime"
|
|
|
|
placeholder="选择开始时间"
|
|
|
|
@change="changeTime(lists.row,'endTime',$event)"
|
|
|
|
>
|
|
|
|
</el-date-picker>
|
|
|
|
<div v-else>
|
|
|
|
<span v-if="lists.row.endTime-0">
|
|
|
|
{{ $moment(lists.row.endTime-0).format("YYYY-MM-DD HH:mm") }}
|
|
|
|
</span>
|
|
|
|
<span v-else>
|
|
|
|
暂无
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="value" label="常量值">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<div v-for="(item,index) in getValue(lists.row.value)" :key="index" @click="changeStatus(lists.$index,'value')">
|
|
|
|
<div>
|
|
|
|
<template v-if="lists.row.code !== 'otherLink'">
|
|
|
|
{{ item.title }}
|
|
|
|
</template>
|
|
|
|
<template v-else>
|
|
|
|
<el-input v-if="statusCode === 'value' && statusIndex === lists.$index" :value="item.title" @blur="changeTitle($event,index,lists.row)" />
|
|
|
|
<span v-else>{{ item.title }}</span>
|
|
|
|
</template>
|
|
|
|
</div>
|
|
|
|
<template v-if="Array.isArray(item.value)">
|
|
|
|
<div v-for="(itemA,indexA) in item.value" :key="indexA">
|
|
|
|
<el-input v-if="statusCode === 'value' && statusIndex === lists.$index" :value="itemA" @blur="changeValue($event,item.title,lists.row,indexA)" />
|
|
|
|
<span v-else>{{ itemA }}</span>
|
|
|
|
{{ item.title }}
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<template v-else>
|
|
|
|
<div>
|
|
|
|
<el-input v-if="statusCode === 'value' && statusIndex === lists.$index" :value="item.value" @blur="changeValue($event,item.title,lists.row)" />
|
|
|
|
<span v-else>{{ item.value }}</span>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="description" label="描述">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<div @click="changeStatus(lists.$index,'description')">
|
|
|
|
<el-input v-if="statusCode === 'description' && statusIndex === lists.$index" :value="lists.row.description" @blur="changeTime(lists.row,'description',$event)" />
|
|
|
|
<span v-else> {{ lists.row.description }} </span>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="modifyName" label="最后修改人登录名">
|
|
|
|
<template slot-scope="lists">
|
|
|
|
<span> {{ lists.row.modifyName }} </span>
|
|
|
|
</template>
|
|
|
|
</el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div class="pagination">
|
|
|
|
<el-pagination
|
|
|
|
background
|
|
|
|
:page-size="params.pageSize"
|
|
|
|
layout="prev, pager, next"
|
|
|
|
:total="dataList.total - 0"
|
|
|
|
@current-change="currentChange"
|
|
|
|
>
|
|
|
|
</el-pagination>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<!-- <el-dialog
|
|
|
|
width="400px"
|
|
|
|
:show-close="false"
|
|
|
|
:visible.sync="isEdit"
|
|
|
|
>
|
|
|
|
<details-of-distribution ref="distribution" :currId="id" v-if="isEdit"></details-of-distribution>
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
<el-button @click="isEdit = false">取消</el-button>
|
|
|
|
<el-button type="primary" @click="determine('ruleForm')">确定</el-button>
|
|
|
|
</div>
|
|
|
|
</el-dialog> -->
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
const FormContainer = () => import('./form.vue');
|
|
|
|
import { GET_LIST,UPDATE_DATA } from '@/api/otherPage';
|
|
|
|
import Alert from "@/utils/alert";
|
|
|
|
|
|
|
|
export default {
|
|
|
|
name: "index",
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
count: 0,
|
|
|
|
id: '',
|
|
|
|
isEdit: false,
|
|
|
|
lists: [],
|
|
|
|
dataList: {},
|
|
|
|
params: {
|
|
|
|
locationId: '',
|
|
|
|
description: '',
|
|
|
|
pageNum: 1,
|
|
|
|
pageSize: 10,
|
|
|
|
},
|
|
|
|
statusIndex: -1,
|
|
|
|
statusCode: '',
|
|
|
|
|
|
|
|
}
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
this.getList()
|
|
|
|
},
|
|
|
|
components: { FormContainer },
|
|
|
|
methods: {
|
|
|
|
// 修改content
|
|
|
|
changeTitle(e,index,item) {
|
|
|
|
let strList = JSON.parse(item.value)
|
|
|
|
strList[index].content = e.target.value
|
|
|
|
const params = {
|
|
|
|
code: item.code,
|
|
|
|
constantId: item.constantId,
|
|
|
|
value: JSON.stringify(strList)
|
|
|
|
}
|
|
|
|
this.updateData(params)
|
|
|
|
|
|
|
|
},
|
|
|
|
// 修改当前正在编辑的文本框
|
|
|
|
changeStatus(index,code) {
|
|
|
|
this.statusIndex= index;
|
|
|
|
this.statusCode= code;
|
|
|
|
},
|
|
|
|
// 修改开始/结束时间
|
|
|
|
changeTime(item,type,e) {
|
|
|
|
const params = {
|
|
|
|
code: item.code,
|
|
|
|
constantId: item.constantId,
|
|
|
|
}
|
|
|
|
if(type === 'startTime') {
|
|
|
|
params.startTime = this.$moment(e).valueOf()
|
|
|
|
} else if (type === 'emdTime') {
|
|
|
|
params.endTime = this.$moment(e).valueOf()
|
|
|
|
} else if (type === 'description') {
|
|
|
|
params.description = e.target.value
|
|
|
|
}
|
|
|
|
this.updateData(params)
|
|
|
|
},
|
|
|
|
// 搜索查询按钮
|
|
|
|
submitForm(res) {
|
|
|
|
this.params = {
|
|
|
|
...this.params,
|
|
|
|
pageNum: 1,
|
|
|
|
description: res.description,
|
|
|
|
locationId: res.locationId,
|
|
|
|
};
|
|
|
|
this.getList()
|
|
|
|
},
|
|
|
|
// 获取数组
|
|
|
|
async getList() {
|
|
|
|
await GET_LIST(this.params).then(res => {
|
|
|
|
const { code,msg,data } = res
|
|
|
|
if(code === 200) {
|
|
|
|
this.lists = data.list
|
|
|
|
this.dataList = data
|
|
|
|
} else {
|
|
|
|
Alert(msg)
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 将常量值JSON字符串解析
|
|
|
|
getValue(value) {
|
|
|
|
const arr = JSON.parse(value)
|
|
|
|
let itemList = []
|
|
|
|
if(Array.isArray(arr)) {
|
|
|
|
for(let i = 0; i < arr.length; i++) {
|
|
|
|
const item = arr[i]
|
|
|
|
for(let key in item) {
|
|
|
|
if(Array.isArray(item[key])) {
|
|
|
|
const obj = {
|
|
|
|
title: key,
|
|
|
|
value: item[key]
|
|
|
|
}
|
|
|
|
itemList.push(obj)
|
|
|
|
} else {
|
|
|
|
const obj = {
|
|
|
|
title: item.content,
|
|
|
|
value: item.url
|
|
|
|
}
|
|
|
|
itemList.push(obj)
|
|
|
|
break
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
for(let key in arr) {
|
|
|
|
const obj = {
|
|
|
|
title: key,
|
|
|
|
value: arr[key]
|
|
|
|
}
|
|
|
|
itemList.push(obj)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return itemList
|
|
|
|
},
|
|
|
|
// 修改常量值,将其反转成JSON后提交
|
|
|
|
changeValue(e,title,defaultValue,index) {
|
|
|
|
let dValue = JSON.parse(defaultValue.value);
|
|
|
|
if(Array.isArray(dValue)) {
|
|
|
|
for(let i = 0; i < dValue.length; i++) {
|
|
|
|
const item = dValue[i]
|
|
|
|
for(let key in item) {
|
|
|
|
if(Array.isArray(item[key]) && key === title) {
|
|
|
|
item[key][index] = e.target.value
|
|
|
|
} else {
|
|
|
|
if(item.content === title) {
|
|
|
|
item.url = e.target.value
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
for(let key in dValue) {
|
|
|
|
if(key === title) {
|
|
|
|
dValue[key] = e.target.value
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
const params = {
|
|
|
|
code: defaultValue.code,
|
|
|
|
constantId: defaultValue.constantId,
|
|
|
|
value: JSON.stringify(dValue)
|
|
|
|
}
|
|
|
|
this.updateData(params)
|
|
|
|
},
|
|
|
|
// 常量修改
|
|
|
|
async updateData(params) {
|
|
|
|
await UPDATE_DATA(params).then(res => {
|
|
|
|
const { code } = res
|
|
|
|
if(code === 200) {
|
|
|
|
Alert.success('修改成功')
|
|
|
|
this.getList()
|
|
|
|
this.statusIndex= -1;
|
|
|
|
this.statusCode= '';
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
|
|
|
|
/**
|
|
|
|
* 分页
|
|
|
|
*/
|
|
|
|
currentChange(res) {
|
|
|
|
console.log('res: ', res);
|
|
|
|
this.params = {
|
|
|
|
...this.params,
|
|
|
|
pageNum: res,
|
|
|
|
};
|
|
|
|
this.getList()
|
|
|
|
},
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style rel="stylesheet/scss" lang="scss" scoped>
|
|
|
|
.table {
|
|
|
|
margin-top: 20px;
|
|
|
|
padding: 30px;
|
|
|
|
background: #fff;
|
|
|
|
|
|
|
|
.option-span {
|
|
|
|
color: #a90500;
|
|
|
|
cursor: pointer;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.pagination {
|
|
|
|
margin-top: 20px;
|
|
|
|
}
|
|
|
|
</style>
|