Commit e9b430d0 authored by lixy's avatar lixy

发现

parent 367f3618
import fetch from 'utils/fetch';
/**
* 获取消息列表
* @param query
*/
export function page(query) {
return fetch({
url: '/api/im/msg/bg/app/unauth/list',
method: 'post',
data: query
});
}
/**
* 获取更新
* @param query
*/
export function updateMsg(params) {
return fetch({
url: '/api/im/msg/bg/app/unauth/update',
method: 'post',
data: params
});
}
/**
* 删除消息
*/
export function delMsg(query) {
return fetch({
url: '/api/im/msg/bg/app/unauth/delete',
method: 'get',
params: query
});
}
/**
* 获取问答列表
*/
export function geImQuestionList(query) {
return fetch({
url: '/api/im/imQuestion/list',
method: 'get',
params: query
});
}
/**
* 更新问答
* @param query
*/
export function updateImQuestion(params) {
return fetch({
url: '/api/im/imQuestion/bg/app/unauth/update',
method: 'post',
data: params
});
}
/**
* 删除消息
*/
export function delQuestion(query) {
return fetch({
url: '/api/im/imQuestion/bg/app/unauth/delete',
method: 'get',
params: query
});
}
......@@ -31,7 +31,6 @@ export function getOneGoodsById(query) {
}
/**
* 获取bannerList
// url: '/api/tour/admin/tourBanner/page',
*/
export function getBannerList(query) {
return fetch({
......@@ -41,7 +40,7 @@ export function getBannerList(query) {
});
}
/**
* 添加banner '/api/tour/admin/tourBanner',
* 添加banner
*/
export function addBanner(params) {
return fetch({
......
......@@ -309,6 +309,33 @@ export const asyncRouterMap = [{
}
]
},
{
path: '/discoveryModule',
component: Layout,
name: '发现模块',
icon: 'setting',
authority: 'discoveryModule',
children: [
{
path: 'clapIndex',
component: _import('discoveryModule/clapIndex'),
name: '拍拍',
authority: 'clapIndex'
},
{
path: 'shortVideo',
component: _import('discoveryModule/shortVideo'),
name: '短视频',
authority: 'shortVideo'
},
{
path: 'questionsAndAnswers',
component: _import('discoveryModule/questionsAndAnswers'),
name: '问答',
authority: 'questionsAndAnswers'
}
]
},
{
path: '/campsiteManage',
component: Layout,
......
......@@ -268,3 +268,15 @@
}
return targetObj;
}
/**
* 深拷贝
*/
export function objDeepCopy(source) {
const sourceCopy = source instanceof Array ? [] : {};
for (const item in source) {
sourceCopy[item] = typeof source[item] === 'object' ? objDeepCopy(source[item]) : source[item];
}
return sourceCopy;
}
<template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div>
<div class="filter-container" ref="filter-container">
<el-form :inline="inline" ref="queryForm" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="8">
<el-form-item label="发布时间" prop="startTime">
<el-date-picker
v-model="listQuery.startTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="startTime"
placeholder="请选择开始时间">
</el-date-picker>~
<el-date-picker
v-model="listQuery.endTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="endTime"
placeholder="请选择结束时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="来源">
<el-select class="filter-item" v-model="listQuery.source" placeholder="请选择来源">
<el-option :key="undefined" label="全部" :value="undefined"></el-option>
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="点赞数 >">
<el-input v-model.number="listQuery.praise" type="number" min="0" placeholder="请输入点赞数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="评论数 >">
<el-input v-model.number="listQuery.comment" type="number" min="0" placeholder="请输入评论数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="用户名">
<el-input v-model.number="listQuery.username" placeholder="请输入用户名"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button>
<el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate"
type="primary" icon="edit">添加
</el-button>
</div>
<el-table :key='tableKey' :data="list" border fit highlight-current-row
style="width: 100%">
<el-table-column
type="index"
align="center" label="序号" width="65">
</el-table-column>
<el-table-column align="center" label="msgId">
<template scope="scope">
<span>{{scope.row.msgId}}</span>
</template>
</el-table-column>
<!--<el-table-column align="center" label="标题">-->
<!--<template scope="scope">-->
<!--<span>{{scope.row.body?scope.row.body.title:''}}</span>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column align="center" label="描述">
<template scope="scope">
<span>{{scope.row.body?scope.row.body.text:''}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="100" label="图片">
<template scope="scope">
<el-button v-if="scope.row.body.images" size="small" @click="handleImg(scope.row.body.images)" class="el-button el-button--text el-button--small" >点击查看
</el-button>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="点赞数">
<template scope="scope">
<span>{{scope.row.count?scope.row.count.praise:0}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="评论数">
<template scope="scope">
<span>{{scope.row.count?scope.row.count.comment:0}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="来源">
<template scope="scope">
<span>{{scope.row.source == 1? '后台创建':'app用户'}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="200" label="操作" fixed="right">
<template scope="scope">
<el-button size="small" class="el-button el-button--text el-button--small" @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="small"class="el-button el-button--text el-button--small" style="color: green;" v-if="scope.row.visible==2" @click="upStatus(scope.row)">设置为公开
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" style="color: red" v-if="scope.row.visible==1" @click="upStatus(scope.row)">设置为保密
</el-button>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" v-if="scope.row.source == 1" @click="deleteHandler(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<!-- 编辑 -->
<el-dialog title="编辑" :visible.sync="oneTypeDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formE.title" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input v-model="formE.desc" disabled type="textarea" :rows="4"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="图片" :style="{display:'block'}">
<img style="width: 100px;height: 100px;object-fit: cover;margin: 5px;" v-for="(iitem, iindex) in formE.images" :key="iindex" class="text item" :src="iitem.oUrl"/>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="创建时间" prop="name">
<el-input v-model="formE.crtTime" disabled></el-input>
</el-form-item>
<el-form-item label="userId" prop="name">
<el-input v-model="formE.userId" disabled></el-input>
</el-form-item>
<el-form-item label="点赞数" prop="name">
<el-input v-model="formE.praise" disabled></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formE.comment" disabled></el-input>
</el-form-item>
<el-form-item label="分享次数" prop="name">
<el-input v-model="formE.share" disabled></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formE.address" disabled></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formE.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formE.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelHandel">取 消</el-button>
<el-button type="primary" @click="updateMsgs">确 定</el-button>
</div>
</el-dialog>
<!-- 创建 -->
<el-dialog title="创建" :visible.sync="createDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formC.title"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input :rows="4" v-model="formC.desc" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="图片" :style="{display:'block'}">
<el-upload
class="upload-demo"
:headers="getHeaderWithToken"
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
:on-remove="handleRemove"
:file-list="fileList2"
:on-success="handleBannerSuccess"
list-type="picture">
<div slot="tip" class="el-upload__tip">最多上传9张</div>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="点赞数" prop="name">
<el-input v-model="formC.praise"></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formC.comment"></el-input>
</el-form-item>
<el-form-item label="分享次数" prop="name">
<el-input v-model="formC.share"></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formC.addressStr" readonly placeholder="请拾取地址" :on-icon-click="selectDestination"
icon="edit"></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formC.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formC.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelCreateHandel">取 消</el-button>
<el-button type="primary" @click="createMsgs">确 定</el-button>
</div>
</el-dialog>
<!--查看图片-->
<el-dialog title="查看图片" :visible.sync="imgDialogVisible">
<el-carousel arrow="always" height="500px" :interval="5000">
<el-carousel-item v-for="item in imgList" :key="item.oUrl" style="display: flex;align-content: center;justify-content: center;">
<img style="height:500px;object-fit: cover;" class="text item" :src="item.oUrl"/>
</el-carousel-item>
</el-carousel>
</el-dialog>
<!--拾取创建位置-->
<address-modal v-if="showAddressVisible" :obj="addressObj" v-on:addressEvent="addressEvent"></address-modal>
</div>
</template>
<style>
textarea {
display: none;
}
.el-upload-list {
display: flex;
flex-wrap: wrap;
}
.el-upload-list li {
margin-left: 10px;
}
.el-upload-list--picture .el-upload-list__item{
width: 100px;
}
</style>
<script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框
import addressModal from './modal/addressModal'
import {
formatDate
} from 'utils/dateFormattor';
import {
toEast8Date,
deepCopyDate,
newEast8Date,
convertDate2Str,
timestamp2Date
} from 'utils/dateUtils';
import rsCode from '../../utils/rsCode';
import {mapGetters} from 'vuex';
import {
getToken
} from 'utils/auth';
import {
objDeepCopy
} from 'utils/index';
import {
page,
updateMsg,
delMsg
} from 'api/discoveryModule';
import Element1 from "../admin/menu/components/element";
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
import {
getSonRegionByCodes,
getRegionByCodes,
} from 'api/base_info/region/';
export default {
name: 'tourManage',
components: {
ElCol,
ElRow,
Element1,
addressModal
},
data() {
return {
modalTitle: "创建",
BASE_API: process.env.BASE_API,
oneTypeDialogVisible: false,//编辑弹框
showLoadingBody: false,
createDialogVisible: false,//创建弹框
imgDialogVisible: false,//查看图片
imgList: [],//查看图片列表
form: {
tagNames:"",//标签
name: undefined,//旅游名称
saleCount: undefined,//销量
stock: undefined,//总数量
},
showAddressVisible: false,//拾取创建地址
addressObj: {},//创建位置实体
formE:{
msgId: undefined,//消息id
title: undefined,//标题
desc:undefined,//描述
crtTime: undefined,//创建时间
userId: undefined,
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
visible: undefined,//1、公开 2、保密
source: undefined,//来源: 1、'后台创建' 2、'app用户'
},
formC: {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
addressStr:'',
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
listPicUrl:'',//图片
},
fileList2: [],//图片
list: null,
total: null,
listLoading: true,
listQuery: {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
praise:undefined,//点赞数
comment: undefined,//评论数
username: undefined,//用户名
type: 2,// 消息类型 1=文字消息、2=图文消息(拍拍)、3=语音消息、4=视频消息、 5=文件消息 、 6=SDK分享消息
},
inline: true,
textMap: {
update: '编辑',
create: '创建'
},
tableKey: 0,
}
},
created() {
this.getList();
},
computed: {
...mapGetters([
'elements',
'belong2Type'
]),
getHeaderWithToken() {
return {Authorization: getToken()};
}
},
methods: {
/**
* 关闭关键标签配置
* */
cancelHandel() {
this.oneTypeDialogVisible = false;
},
/**
* 编辑创建地址
* */
selectDestination() {
let that = this;
this.addressObj.eventName = 'addressEvent';
this.addressObj.keyword = this.addressObj.address?this.addressObj.address:this.addressObj.addressStr?this.addressObj.addressStr:'';
this.showAddressVisible = true;
},
/**
* 关闭创建弹框
* */
cancelCreateHandel(){
this.createDialogVisible = false;
},
/**
* 关闭地址弹框
* */
addressEvent(obj) {
this.showAddressVisible = false;
if (obj) {
this.addressObj = obj;
let provinceObj = getRegionByCodes([obj.province]);
let cityObj = getRegionByCodes([obj.city]);
this.addressObj.provinceName = provinceObj[0].name;
this.addressObj.cityName = cityObj[0].name;
this.formC.addressStr = this.addressObj.provinceName + this.addressObj.cityName + this.addressObj.address;
console.log(this.addressObj);
}
},
/**
* 创建拍拍消息
* */
createMsgs(){
this.createDialogVisible = false;
// let params = {
// id: this.formE.msgId,
// visible: this.formE.visible,//1、公开 2、保密
// source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
// };
console.log(this.formC);
console.log(this.addressObj);
// updateMsg(params).then(response => {
// if (response.status === 200) {
// this.$notify({
// title: '成功',
// message: '成功',
// type: 'success',
// duration: 2000
// });
// this.oneTypeDialogVisible = false;
// this.getList();
// } else {
// this.$notify({
// title: '失败',
// message: '操作失败!',
// type: 'error',
// duration: 2000
// });
// }
// });
},
/**
* 保存编辑
* */
updateMsgs(){
let params = {
id: this.formE.msgId,
visible: this.formE.visible,//1、公开 2、保密
source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
};
console.log(params);
updateMsg(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.oneTypeDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '失败',
message: '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 添加
* */
handleCreate() {
this.modalTitle = '创建';
this.formC = {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
listPicUrl:'',//图片
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
};
this.createDialogVisible = true;
},
/**
* 查看图片
* */
handleImg(imgList){
this.imgList = imgList;
this.imgDialogVisible = true;
},
/**
* 删除图片
* */
handleRemove(file, fileList) {
let list = [];
fileList.map(function (item) {
if (item.url != file.url) {
list.push(item);
}
});
this.fileList2 = list;
let arr = [];
let listPicUrl = this.form.listPicUrl.split(",");
listPicUrl.map(function (item) {
if (item != file.url) {
arr.push(item);
}
});
this.formC.listPicUrl = arr.join(",");
},
/**
* 图片上传
* */
handleBannerSuccess(res, file) {
this.fileList2.push({url: res.data});
let c = [];
this.fileList2.map(function (i) {
c.push(i.url);
});
this.formC.listPicUrl = c.join(",");
},
/**
* 公开、秘密 参数 visible 1:公开,2:私密
*/
upStatus(row){
let params = {
id: row.msgId,
visible: row.visible==1?2:1
};
updateMsg(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message: '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 删除
* */
deleteHandler(row) {
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delMsg({id: row.msgId}).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '删除成功',
type: 'success',
duration: 2000
});
this.bannerDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '删除失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
})
},
/**
* 编辑
* */
handleUpdate(row) {
this.modalTitle = '编辑';
console.log(row);
this.formE = {
msgId: row.msgId,//消息id
title: row.body.title?row.body.title:'',//标题
images: row.body.images?row.body.images:{},//图片
desc:row.body.text,//描述
crtTime: timestamp2Date(row.body.time),//创建时间
userId: row.userId,
share: row.count.share,//分享次数
praise: row.count.praise,//点赞数
comment: row.count.comment,//评论数
address: row.body.address,//创建位置
visible: row.visible+'',//1、公开 2、保密
source: row.source+''
};
this.oneTypeDialogVisible = true;
},
/**
* 详情modal传递回来的数据
* */
oneDialogEvent(e){
this.oneTypeDialogVisible = false;
if(e){
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 获取拍拍列表
* */
getList() {
this.listLoading = true;
let params = objDeepCopy(this.listQuery);
params.comment = this.listQuery.comment? this.listQuery.comment:undefined;
params.praise = this.listQuery.praise?this.listQuery.praise:undefined;
if(this.listQuery.startTime && (typeof this.listQuery.startTime == "object")){
params.startTime = this.listQuery.startTime.getTime()/1000;
}
if(this.listQuery.endTime && (typeof this.listQuery.endTime == "object")){
params.endTime = this.listQuery.endTime.getTime()/1000;
}
page(params).then(response => {
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.list) && this.$utils.isInteger(response.data.total)) {
response.data.list.map(function(item){
});
listRs = response.data.list;
totalCountRs = response.data.total;
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
})
},
/**
* 搜索
* */
handleFilter() {
this.listQuery.page = 1;
this.$refs.queryForm.validate(valid => {
if (valid) {
this.getList();
} else {
return false;
}
});
},
handleSizeChange(val) {
this.listQuery.limit = val;
this.getList();
},
handleCurrentChange(val) {
this.listQuery.page = val;
this.getList();
},
/**
* 重置
* */
reloadPage() {
this.listQuery = {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
startTime: undefined,//创建时间
praise:undefined,//点赞数
comment: undefined,//评论数
username: undefined,//用户名
type: 2,//消息类型
};
this.getList()
},
}
}
</script>
<template>
<el-dialog title="拾取位置" :visible.sync="isVisible">
<el-form :model="form" :rules="rules" ref="form" label-width="120px">
<el-row>
<el-col :span="8">
<el-form-item label="省份">
<el-select class="filter-item" v-model="listQuery.addrProvince" placeholder="请选择省份(直辖市)" @change='getValue'>
<el-option v-for="item in provinceRegions" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="城市">
<el-select class="filter-item" v-model="listQuery.addrCity" placeholder="请选择城市">
<el-option v-for="item in cityRegions4Query" :key="item.id" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="详细地址" prop="address">
<el-input v-model="form.address" placeholder="请输入详细地址"></el-input>
</el-form-item>
<el-row>
<el-col :span="8">
<el-form-item label="纬度" prop="latitude">
<el-input :value="form.latitude" readonly></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="经度" prop="longitude">
<el-input :value="form.longitude" readonly></el-input>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="拾取经纬度">
<el-input v-model="keyword" placeholder="请输入详细地址获取经纬度"></el-input>
</el-form-item>
<el-form-item v-if="1>2">
<baidu-map class="map" id="mapID" center="东莞市" :zoom="zoom" :scroll-wheel-zoom="true" @click="getPoint" @ready="handler">
<!--地图类型,两种:一种是路线一种是绿的那种-->
<bm-map-type :map-types="['BMAP_NORMAL_MAP', 'BMAP_HYBRID_MAP']" anchor="BMAP_ANCHOR_TOP_LEFT"></bm-map-type>
<!--地图搜索功能,绑定上面的input,-->
<!--display: none样式很关键,因为下面默认会有地址提示信息很长,很烦,这样搜索会很舒服,-->
<!--zoom是搜索结果的视图比例,个人觉得12.8很舒服显示-->
<bm-local-search :keyword="keyword" :auto-viewport="true" :location="location" zoom="12.8" style="display: none"></bm-local-search>
<bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
<!--信息窗口,show属性是控制显示隐藏,infoWindowClose和infoWindowOpen是控制信息窗口关闭隐藏的方法-->
<bm-marker :position="postionMap" >
<bm-info-window :show="show" class="bm-info" @close="infoWindowClose" @open="infoWindowOpen" style="font-size: 14px">
<!--<p>站点地址:{{ add.site }}</p>-->
</bm-info-window>
</bm-marker>
</baidu-map>
</el-form-item>
<el-form-item >
<!--:center="center"-->
<baidu-map
:zoom="zoom"
:dragging="true"
:scroll-wheel-zoom="true"
class="map"
@ready="handler"
@click="getPoint"
>
<bm-local-search
:keyword="keyword"
:auto-viewport="true"
:location="location"
style="display: none"
></bm-local-search>
<bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
<bm-geolocation
anchor="BMAP_ANCHOR_BOTTOM_RIGHT"
:showAddressBar="true"
:autoLocation="true"
></bm-geolocation>
<bm-marker :position="{lng:form.longitude, lat: form.latitude}"></bm-marker>
</baidu-map>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button v-if="form.showTitle == '途径地编辑'" type="danger" @click="deleteHandler()">删除</el-button>
<el-button type="primary" @click="okHandler('form')">确 定</el-button>
</div>
</el-dialog>
</template>
<script src="http://api.map.baidu.com/api?v=2.0&ak=iSEprDCqtYn5aC06Y3cDyGCEOP1hydwR"></script>
<script>
import BaiduMap from 'vue-baidu-map';
import {
getSonRegionByCodes,
getRegionByCodes,
} from 'api/base_info/region/';
import rsCode from '../../../utils/rsCode';
import {mapGetters} from 'vuex';
import {
getAllCompany,
getAll
} from 'api/base_info/branch_company/';
import ElRow from "element-ui/packages/row/src/row";
import ElInput from "../../../../node_modules/element-ui/packages/input/src/input.vue";
import ElCol from "element-ui/packages/col/src/col";
export default {
props: ["obj"],
name: 'destinationDialog',
components: {
ElCol,
ElInput,
ElRow
},
data() {
return {
jgNameDialog: false,
show: false,
postionMap:{ //地图坐标
lng: 120.211486,
lat: 30.256576
},
visible2: false,//是否显示删除确认框
location: '',
keyword: '', //搜索框关键词
zoom: 12.8, //放大比例
address:'', //位置详细信息
add:{
siteName:'',
site:'',
jd:'',
wd:'',
desce:'',
type:'',
jgName:'',
jgNum:'',
},
organizationData:[],
jgName:'',
jgNum:'',
form: {
showTitle: "",//弹框名称
name: undefined,//地址名称
keyword:"",//根据关键词查找经纬度
address:undefined,//详细地址
longitude: undefined,
latitude:undefined,
eventName: undefined
},
listQuery: {
addrProvince: undefined,
addrCity: undefined,
},
rules: {
name: [
{
type: 'string',
required: true,
message: '请输入名称',
trigger: 'blur'
},
{
min: 0,
max: 2000,
message: '长度小于 2000 个字符',
trigger: 'blur'
}
],
address: [
{
type: 'string',
required: true,
message: '请输入详细地址',
trigger: 'blur'
},
{
min: 0,
max: 2000,
message: '长度小于 2000 个字符',
trigger: 'blur'
}
],
longitude:{
required: true,
message: '请拾取经纬度'
},
latitude:{
required: true,
message: '请拾取经纬度'
},
addrProvince:{
required: true,
message: '请选择省份',
trigger: 'blur'
},
addrCity:{
required: true,
message: '请选择城市',
trigger: 'blur'
},
},
allCompanies: {},
allCompaniesArr: [],
isVisible: false,
allUpkeepItems: null,
dialogStatus: undefined,
baidumapSwitch:false,
zoom: 16,
location: "深圳市",
}
},
created() {
},
watch: {
isVisible(newValue, oldValue){
if(!newValue){
this.$emit(this.form.eventName, false);
this.cleanForm();
}
},
},
mounted() {
let that = this;
this.cleanForm();
let row = this.obj;debugger
this.form = this.obj;
this.listQuery.addrProvince = this.obj.province;
this.listQuery.addrCity = this.obj.city;
this.keyword = row.keyword?row.keyword:"东莞市";
this.isVisible = true;
},
computed: {
...mapGetters([
'elements',
]),
provinceRegions() {
return getSonRegionByCodes(1);
},
cityRegions4Query() {
if (!this.$utils.isInteger(this.listQuery.addrProvince)) {
return null;
}
return getSonRegionByCodes(this.listQuery.addrProvince);
},
},
methods: {
/**
* 删除
* */
deleteHandler(formName) {
// 删除
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.form.method = 'delete';
this.$emit(this.form.eventName, this.form);
})
},
querySearch(queryString, cb) {
let selectArry = [];
this.allCompaniesArr.map(function(item){
item.value = item.name;
selectArry.push(item);
});
this.selectArry = selectArry;
var results = queryString ? selectArry.filter(this.createFilter(queryString)) : selectArry;
// 调用 callback 返回建议列表的数据
cb(results);
},
handleSelect(item) {
this.upkeepForm.branchCompanyId = item.id;
console.log(item);
},
createFilter(queryString) {
return (restaurant) => {
return (restaurant.name.indexOf(queryString.toLowerCase()) != -1);
};
},
getTypeName: function(type) {
if (this.$utils.isEmpty(this.vehicleWarningMsgType[type])) {
return '未知';
}
return this.vehicleWarningMsgType[type].val;
},
getValue(e){
this.listQuery.addrCity = undefined;
},
/**
* 确定
* */
okHandler(formName) {
const set = this.$refs;
if(!this.listQuery.addrProvince){
this.$notify({
title: '请选择省份',
message: '操作失败!',
type: 'error',
duration: 2000
});
return;
}
if(!this.listQuery.addrCity){
this.$notify({
title: '请选择城市',
message:'操作失败!',
type: 'error',
duration: 2000
});
return;
}
this.form.province = this.listQuery.addrProvince;
this.form.city = this.listQuery.addrCity;
set[formName].validate(valid => {
if (valid) {
this.$emit(this.form.eventName, this.form);
} else {
return;
}
});
},
/**
* 加载地图
* */
handler ({BMap, map}) {
console.log(BMap, map)
this.postionMap = { //地图坐标
lng: 120.211486,
lat: 30.256576
};
},
//点击获取到当前经纬度
getClickInfo(e) {
console.log(e.point.lng);
console.log(e.point.lat);
this.form.longitude = e.point.lng;
this.form.latitude = e.point.lat;
},
//双向绑定经纬度以及缩放尺寸
syncCenterAndZoom(e) {
const { lng, lat } = e.target.getCenter();
this.form.longitude = lng;
this.form.latitude = lat;
// this.zoom = e.target.getZoom();
},
//经纬度同步
baidumap(){
this.baiduDevicelocationx = this.form.longitude
this.baiduDevicelocationy = this.form.latitude
},
/**
* 弹框-取消
* */
cancel() {
this.$emit(this.form.eventName, false);
this.cleanForm();
},
/**
* 清空弹框数据
*/
cleanForm() {
this.form = {
showTitle: "",//弹框名称
name: undefined,//地址名称
keyword:"",//根据关键词查找经纬度
address:undefined,//详细地址
longitude: undefined,
latitude:undefined,
eventName: undefined
};
this.listQuery = {
addrProvince: undefined,
addrCity: undefined,
}
},
getPoint(e){ //点击地图获取一些信息,
this.show = true;
this.postionMap.lng = e.point.lng; //通过 e.point.lng获取经度
this.postionMap.lat = e.point.lat; //通过 e.point.lat获取纬度
this.add.jd = e.point.lng;
this.add.wd = e.point.lat;
this.zoom = e.target.getZoom();
let geocoder= new BMap.Geocoder(); //创建地址解析器的实例
geocoder.getLocation(e.point,rs=>{
this.add.site = rs.address;
this.keyword = rs.address;
this.form.latitude = rs.point.lat;
this.form.longitude = rs.point.lng;
//地址描述(string)=
// console.log(rs.address); //这里打印可以看到里面的详细地址信息,可以根据需求选择想要的
// console.log(rs.addressComponents);//结构化的地址描述(object)
console.log(rs.addressComponents.province); //省
console.log(rs.addressComponents.city); //城市
console.log(rs.addressComponents.district); //区县
console.log(rs.addressComponents.street); //街道
console.log(rs.addressComponents.streetNumber); //门牌号
// console.log(rs.surroundingPois); //附近的POI点(array)
// console.log(rs.business); //商圈字段,代表此点所属的商圈(string)
});
},
infoWindowClose () {
this.show = false
},
infoWindowOpen () {
//这里有个问题纠结了很久,百度的信息窗口默认有个点击其他地方就消失的事件,我没有找到
//并且信息窗口点击一次显示,一次消失
//于是我加了一个100毫秒的定时器,保证每次点击地图都可以展示信息窗口
setInterval(()=>{
this.show = true
},100)
},
}
}
</script>
<style scoped>
.map {
width: 100%;
height: 500px;
}
.bm-info input[type="button"]{
width: 30px;
}
</style>
<template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div>
<div class="filter-container" ref="filter-container">
<el-form :inline="inline" ref="queryForm" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="8">
<el-form-item label="发布时间" prop="startTime">
<el-date-picker
v-model="listQuery.startTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="startTime"
placeholder="请选择开始时间">
</el-date-picker>~
<el-date-picker
v-model="listQuery.endTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="endTime"
placeholder="请选择结束时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="来源">
<el-select class="filter-item" v-model="listQuery.source" placeholder="请选择来源">
<el-option :key="undefined" label="全部" :value="undefined"></el-option>
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="点赞数 >">
<el-input v-model.number="listQuery.praiseCount" type="number" min="0" placeholder="请输入点赞数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="评论数 >">
<el-input v-model.number="listQuery.commentCount" type="number" min="0" placeholder="请输入评论数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="用户名">
<el-input v-model.number="listQuery.username" placeholder="请输入用户名"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button>
<el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate"
type="primary" icon="edit">添加
</el-button>
</div>
<el-table :key='tableKey' :data="list" border fit highlight-current-row
style="width: 100%">
<el-table-column
type="index"
align="center" label="序号" width="65">
</el-table-column>
<el-table-column align="center" label="标题">
<template scope="scope">
<span>{{scope.row.title}}</span>
</template>
</el-table-column>
<el-table-column align="center" label="描述">
<template scope="scope">
<span>{{scope.row.content}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="点赞数">
<template scope="scope">
<span>{{scope.row.praiseCount?scope.row.praiseCount:0}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="评论数">
<template scope="scope">
<span>{{scope.row.commentCount?scope.row.commentCount:0}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="发布时间">
<template scope="scope">
<span>{{scope.row.timeStr}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="来源">
<template scope="scope">
<span>{{scope.row.source == 1? '后台创建':'app用户'}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="200" label="操作" fixed="right">
<template scope="scope">
<el-button size="small" class="el-button el-button--text el-button--small" @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="small"class="el-button el-button--text el-button--small" style="color: green;" v-if="scope.row.visible==2" @click="upStatus(scope.row)">设置为公开
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" style="color: red" v-if="scope.row.visible==1" @click="upStatus(scope.row)">设置为保密
</el-button>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" v-if="scope.row.source == 1" @click="deleteHandler(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<!-- 编辑 -->
<el-dialog title="编辑" :visible.sync="oneTypeDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formE.title" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input v-model="formE.desc" disabled type="textarea" :rows="4"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="发布时间" prop="name">
<el-input v-model="formE.time" disabled></el-input>
</el-form-item>
<el-form-item label="userId" prop="name">
<el-input v-model="formE.userId" disabled></el-input>
</el-form-item>
<el-form-item label="点赞数" prop="name">
<el-input v-model="formE.praiseCount" disabled></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formE.commentCount" disabled></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formE.address" disabled></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formE.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formE.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelHandel">取 消</el-button>
<el-button type="primary" @click="updateMsgs">确 定</el-button>
</div>
</el-dialog>
<!-- 创建 -->
<el-dialog title="创建" :visible.sync="createDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formC.title"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input :rows="4" v-model="formC.desc" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="点赞数" prop="name">
<el-input v-model="formC.praise"></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formC.comment"></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formC.addressStr" readonly placeholder="请拾取地址" :on-icon-click="selectDestination"
icon="edit"></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formC.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formC.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelCreateHandel">取 消</el-button>
<el-button type="primary" @click="createMsgs">确 定</el-button>
</div>
</el-dialog>
<!--拾取创建位置-->
<address-modal v-if="showAddressVisible" :obj="addressObj" v-on:addressEvent="addressEvent"></address-modal>
</div>
</template>
<style>
textarea {
display: none;
}
.el-upload-list {
display: flex;
flex-wrap: wrap;
}
.el-upload-list li {
margin-left: 10px;
}
.el-upload-list--picture .el-upload-list__item{
width: 100px;
}
</style>
<script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框
import addressModal from './modal/addressModal'
import {
formatDate
} from 'utils/dateFormattor';
import {
toEast8Date,
deepCopyDate,
newEast8Date,
convertDate2Str,
timestamp2Date
} from 'utils/dateUtils';
import rsCode from '../../utils/rsCode';
import {mapGetters} from 'vuex';
import {
getToken
} from 'utils/auth';
import {
objDeepCopy
} from 'utils/index';
import {
updateImQuestion,
geImQuestionList,
delQuestion
} from 'api/discoveryModule';
import {
getSonRegionByCodes,
getRegionByCodes,
} from 'api/base_info/region/';
import Element1 from "../admin/menu/components/element";
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
export default {
name: 'tourManage',
components: {
ElCol,
ElRow,
Element1,
addressModal
},
data() {
return {
modalTitle: "创建",
BASE_API: process.env.BASE_API,
oneTypeDialogVisible: false,//编辑弹框
showLoadingBody: false,
createDialogVisible: false,//创建弹框
imgDialogVisible: false,//查看图片
imgList: [],//查看图片列表
form: {
tagNames:"",//标签
name: undefined,//旅游名称
saleCount: undefined,//销量
stock: undefined,//总数量
},
showAddressVisible: false,//拾取创建地址
addressObj: {},//创建位置实体
formE:{
id: undefined,//消息id
title: undefined,//标题
desc:undefined,//描述
crtTime: undefined,//创建时间
userId: undefined,
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
visible: undefined,//1、公开 2、保密
source: undefined,//来源: 1、'后台创建' 2、'app用户'
},
formC: {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
addressStr:'',
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
listPicUrl:'',//图片
},
fileList2: [],//图片
list: null,
total: null,
listLoading: true,
listQuery: {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
praiseCount:undefined,//点赞数
commentCount: undefined,//评论数
username: undefined,//用户名
},
inline: true,
textMap: {
update: '编辑',
create: '创建'
},
tableKey: 0,
}
},
created() {
this.getList();
},
computed: {
...mapGetters([
'elements',
'belong2Type'
]),
getHeaderWithToken() {
return {Authorization: getToken()};
}
},
methods: {
/**
* 关闭关键标签配置
* */
cancelHandel() {
this.oneTypeDialogVisible = false;
},
/**
* 关闭创建弹框
* */
cancelCreateHandel(){
this.createDialogVisible = false;
},
/**
* 创建拍拍消息
* */
createMsgs(){
this.createDialogVisible = false;
// let params = {
// id: this.formE.msgId,
// visible: this.formE.visible,//1、公开 2、保密
// source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
// };
console.log(this.formC);
console.log(this.addressObj);
// updateMsg(params).then(response => {
// if (response.status === 200) {
// this.$notify({
// title: '成功',
// message: '成功',
// type: 'success',
// duration: 2000
// });
// this.oneTypeDialogVisible = false;
// this.getList();
// } else {
// this.$notify({
// title: '失败',
// message: '操作失败!',
// type: 'error',
// duration: 2000
// });
// }
// });
},
/**
* 关闭地址弹框
* */
addressEvent(obj) {
this.showAddressVisible = false;
if (obj) {
this.addressObj = obj;
let provinceObj = getRegionByCodes([obj.province]);
let cityObj = getRegionByCodes([obj.city]);
this.addressObj.provinceName = provinceObj[0].name;
this.addressObj.cityName = cityObj[0].name;
this.formC.addressStr = this.addressObj.provinceName + this.addressObj.cityName + this.addressObj.address;
console.log(this.addressObj);
}
},
/**
* 编辑创建地址
* */
selectDestination() {
let that = this;
this.addressObj.eventName = 'addressEvent';
this.addressObj.keyword = this.addressObj.address?this.addressObj.address:this.addressObj.addressStr?this.addressObj.addressStr:'';
this.showAddressVisible = true;
},
/**
* 保存编辑
* */
updateMsgs(){
let params = {
id: this.formE.id,
visible: this.formE.visible,//1、公开 2、保密
source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
};
console.log(params);
updateImQuestion(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.oneTypeDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '失败',
message: '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 添加
* */
handleCreate() {
this.modalTitle = '创建';
this.formC = {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praiseCount:undefined,//点赞数
commentCount: undefined,//评论数
address: undefined,//创建位置
listPicUrl:'',//图片
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
};
this.createDialogVisible = true;
},
/**
* 查看图片
* */
handleImg(imgList){
this.imgList = imgList;
this.imgDialogVisible = true;
},
/**
* 删除图片
* */
handleRemove(file, fileList) {
let list = [];
fileList.map(function (item) {
if (item.url != file.url) {
list.push(item);
}
});
this.fileList2 = list;
let arr = [];
let listPicUrl = this.form.listPicUrl.split(",");
listPicUrl.map(function (item) {
if (item != file.url) {
arr.push(item);
}
});
this.formC.listPicUrl = arr.join(",");
},
/**
* 图片上传
* */
handleBannerSuccess(res, file) {
this.fileList2.push({url: res.data});
let c = [];
this.fileList2.map(function (i) {
c.push(i.url);
});
this.formC.listPicUrl = c.join(",");
},
/**
* 公开、秘密 参数 visible 1:公开,2:私密
*/
upStatus(row){
let params = {
id: row.id,
visible: row.visible==1?2:1
};
updateImQuestion(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message:response.message?response.message : '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 删除
* */
deleteHandler(row) {
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delQuestion({id:row.id}).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '删除成功',
type: 'success',
duration: 2000
});
this.bannerDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '删除失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
})
},
/**
* 编辑
* */
handleUpdate(row) {
this.modalTitle = '编辑';
console.log(row);
this.formE = {
id: row.id,//消息id
title: row.title,//标题
desc:row.content,//描述
time: timestamp2Date(row.time),//发布时间
userId: row.userId,
praiseCount: row.praiseCount?row.praiseCount: 0,//点赞数
commentCount: row.commentCount?row.commentCount:0,//评论数
address: row.address?row.address:'',//创建位置
visible: row.visible+'',//1、公开 2、保密
source: row.source+''
};
this.oneTypeDialogVisible = true;
},
/**
* 详情modal传递回来的数据
* */
oneDialogEvent(e){
this.oneTypeDialogVisible = false;
if(e){
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 获取列表
* */
getList() {
this.listLoading = true;
let params = objDeepCopy(this.listQuery);
params.commentCount = this.listQuery.commentCount? this.listQuery.commentCount:undefined;
params.praiseCount = this.listQuery.praiseCount?this.listQuery.praiseCount:undefined;
if(this.listQuery.startTime && (typeof this.listQuery.startTime == "object")){
params.startTime = this.listQuery.startTime.getTime();
}
if(this.listQuery.endTime && (typeof this.listQuery.endTime == "object")){
params.endTime = this.listQuery.endTime.getTime();
}
geImQuestionList(params).then(response => {
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.data) && this.$utils.isInteger(response.data.totalCount)) {
response.data.data.map(function(item){
item.timeStr = timestamp2Date(item.time);
});
listRs = response.data.data;
totalCountRs = response.data.totalCount;
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
})
},
/**
* 搜索
* */
handleFilter() {
this.listQuery.page = 1;
this.$refs.queryForm.validate(valid => {
if (valid) {
this.getList();
} else {
return false;
}
});
},
handleSizeChange(val) {
this.listQuery.limit = val;
this.getList();
},
handleCurrentChange(val) {
this.listQuery.page = val;
this.getList();
},
/**
* 重置
* */
reloadPage() {
this.listQuery = {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
praiseCount:undefined,//点赞数
commentCount: undefined,//评论数
username: undefined,//用户名
};
this.getList()
},
}
}
</script>
<template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div>
<div class="filter-container" ref="filter-container">
<el-form :inline="inline" ref="queryForm" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="8">
<el-form-item label="发布时间" prop="startTime">
<el-date-picker
v-model="listQuery.startTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="startTime"
placeholder="请选择开始时间">
</el-date-picker>~
<el-date-picker
v-model="listQuery.endTime"
type="date"
:editable="false"
format="yyyy-MM-dd"
prop="endTime"
placeholder="请选择结束时间">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="来源">
<el-select class="filter-item" v-model="listQuery.source" placeholder="请选择来源">
<el-option :key="undefined" label="全部" :value="undefined"></el-option>
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="点赞数 >">
<el-input v-model.number="listQuery.praise" type="number" min="0" placeholder="请输入点赞数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="评论数 >">
<el-input v-model.number="listQuery.comment" type="number" min="0" placeholder="请输入评论数"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="用户名">
<el-input v-model.number="listQuery.username" placeholder="请输入用户名"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
<el-button class="filter-item" type="primary" v-waves @click="reloadPage">重置</el-button>
<el-button class="filter-item" style="margin-left: 10px;" @click="handleCreate"
type="primary" icon="edit">添加
</el-button>
</div>
<el-table :key='tableKey' :data="list" border fit highlight-current-row
style="width: 100%">
<el-table-column
type="index"
align="center" label="序号" width="65">
</el-table-column>
<el-table-column align="center" label="msgId">
<template scope="scope">
<span>{{scope.row.msgId}}</span>
</template>
</el-table-column>
<!--<el-table-column align="center" label="标题">-->
<!--<template scope="scope">-->
<!--<span>{{scope.row.body?scope.row.body.title:''}}</span>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column align="center" label="描述">
<template scope="scope">
<span>{{scope.row.body?scope.row.body.text:''}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="100" label="视频">
<template scope="scope">
<el-button v-if="scope.row.body.videos" size="small" @click="handleVideo(scope.row.body.videos)" class="el-button el-button--text el-button--small" >点击查看
</el-button>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="点赞数">
<template scope="scope">
<span>{{scope.row.count?scope.row.count.praise:0}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="评论数">
<template scope="scope">
<span>{{scope.row.count?scope.row.count.comment:0}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="来源">
<template scope="scope">
<span>{{scope.row.source == 1? '后台创建':'app用户'}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="200" label="操作" fixed="right">
<template scope="scope">
<el-button size="small" class="el-button el-button--text el-button--small" @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button size="small"class="el-button el-button--text el-button--small" style="color: green;" v-if="scope.row.visible==2" @click="upStatus(scope.row)">设置为公开
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" style="color: red" v-if="scope.row.visible==1" @click="upStatus(scope.row)">设置为保密
</el-button>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" v-if="scope.row.source == 1" @click="deleteHandler(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div v-show="!listLoading" class="pagination-container">
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
</div>
<!-- 编辑 -->
<el-dialog title="编辑" :visible.sync="oneTypeDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formE.title" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input v-model="formE.desc" type="textarea" :rows="4" disabled></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="视频" :style="{display:'block'}">
<video height="300" width="80%" v-for="(iitem, iindex) in formE.videos" :key="iindex" :src="iitem.oUrl" controls="controls" class="text item"></video>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="创建时间" prop="name">
<el-input v-model="formE.crtTime" disabled></el-input>
</el-form-item>
<el-form-item label="userId" prop="name">
<el-input v-model="formE.userId" disabled></el-input>
</el-form-item>
<el-form-item label="点赞数" prop="name">
<el-input v-model="formE.praise" disabled></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formE.comment" disabled></el-input>
</el-form-item>
<el-form-item label="分享次数" prop="name">
<el-input v-model="formE.share" disabled></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formE.address" disabled></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formE.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formE.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelHandel">取 消</el-button>
<el-button type="primary" @click="updateMsgs">确 定</el-button>
</div>
</el-dialog>
<!-- 创建 -->
<el-dialog title="创建" :visible.sync="createDialogVisible">
<el-form label-width="90px">
<el-row>
<el-col :span="16">
<el-row>
<el-col :span="16">
<el-form-item label="标题">
<el-input v-model="formC.title"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="16">
<el-form-item label="描述">
<el-input v-model="formC.desc" type="textarea" :rows="4"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="视频" :style="{display:'block'}">
<el-upload class="avatar-uploader el-upload--text" :headers="getHeaderWithToken" :action="BASE_API+'/api/universal/file/app/unauth/uploadVideo'"
:show-file-list="false" :on-success="handleVideoSuccess" :before-upload="beforeUploadVideo" :on-progress="uploadVideoProcess">
<video v-if="videoForm.Video !='' && videoFlag == false" :src="videoForm.Video" class="avatar" controls="controls">您的浏览器不支持视频播放</video>
<i v-else-if="videoForm.Video =='' && videoFlag == false" class="el-icon-plus avatar-uploader-icon"></i>
<el-progress v-if="videoFlag == true" type="circle" :percentage="videoUploadPercent" style="margin-top:30px;"></el-progress>
</el-upload>
<p class="text">请保证视频格式正确,且不超过10M</p>
</el-form-item>
</el-col>
</el-row>
</el-col>
<el-col :span="8">
<el-form-item label="点赞数" prop="name">
<el-input v-model="formC.praise"></el-input>
</el-form-item>
<el-form-item label="评论数" prop="name">
<el-input v-model="formC.comment"></el-input>
</el-form-item>
<el-form-item label="分享次数" prop="name">
<el-input v-model="formC.share"></el-input>
</el-form-item>
<el-form-item label="创建位置" prop="name">
<el-input v-model="formC.addressStr" readonly placeholder="请拾取地址" :on-icon-click="selectDestination"
icon="edit"></el-input>
</el-form-item>
<el-form-item label="对外可见">
<el-select class="filter-item" v-model="formC.visible" placeholder="请选择来源">
<el-option key="1" label="是" value="1"></el-option>
<el-option key="2" label="否" value="2"></el-option>
</el-select>
</el-form-item>
<el-form-item label="来源">
<el-select class="filter-item" v-model="formC.source" placeholder="请选择来源">
<el-option key="1" label="后台创建" value="1"></el-option>
<el-option key="2" label="app用户" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelCreateHandel">取 消</el-button>
<el-button type="primary" @click="createMsgs">确 定</el-button>
</div>
</el-dialog>
<!--查看图片-->
<el-dialog title="查看视频" :visible.sync="videoDialogVisible">
<div style="display: flex;align-items: center;justify-content: center;" v-if="videosList.length>0">
<video height="500" :src="videosList[0].oUrl" controls="controls" class="text item"></video>
</div>
</el-dialog>
<!--拾取创建位置-->
<address-modal v-if="showAddressVisible" :obj="addressObj" v-on:addressEvent="addressEvent"></address-modal>
</div>
</template>
<style>
textarea {
display: none;
}
.el-upload-list {
display: flex;
flex-wrap: wrap;
}
.el-upload-list li {
margin-left: 10px;
}
.el-upload-list--picture .el-upload-list__item{
width: 100px;
}
</style>
<script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框
import addressModal from './modal/addressModal'
import {
getSonRegionByCodes,
getRegionByCodes,
} from 'api/base_info/region/';
import {
formatDate
} from 'utils/dateFormattor';
import {
toEast8Date,
deepCopyDate,
newEast8Date,
convertDate2Str,
timestamp2Date
} from 'utils/dateUtils';
import rsCode from '../../utils/rsCode';
import {mapGetters} from 'vuex';
import {
getToken
} from 'utils/auth';
import {
objDeepCopy
} from 'utils/index';
import {
page,
updateMsg,
delMsg
} from 'api/discoveryModule';
import Element1 from "../admin/menu/components/element";
import ElRow from "element-ui/packages/row/src/row";
import ElCol from "element-ui/packages/col/src/col";
export default {
name: 'tourManage',
components: {
ElCol,
ElRow,
Element1,
addressModal
},
data() {
return {
modalTitle: "创建",
BASE_API: process.env.BASE_API,
oneTypeDialogVisible: false,//编辑弹框
showLoadingBody: false,
createDialogVisible: false,//创建弹框
videoDialogVisible: false,//查看视频
videosList: [],//查看视频列表
videoFlag: false,
form: {
tagNames:"",//标签
name: undefined,//旅游名称
saleCount: undefined,//销量
stock: undefined,//总数量
},
showAddressVisible: false,//拾取创建地址
addressObj: {},//创建位置实体
formE:{
msgId: undefined,//消息id
title: undefined,//标题
desc:undefined,//描述
crtTime: undefined,//创建时间
userId: undefined,
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
visible: undefined,//1、公开 2、保密
source: undefined,//来源: 1、'后台创建' 2、'app用户'
},
formC: {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
addressStr:'',
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
listVideoUrl:'',//视频
},
fileList2: [],//图片
list: null,
total: null,
videoForm: {},//上传视频
listLoading: true,
listQuery: {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
praise:undefined,//点赞数
comment: undefined,//评论数
username: undefined,//用户名
type: 4,// 消息类型 1=文字消息、2=图文消息(拍拍)、3=语音消息、4=视频消息、 5=文件消息 、 6=SDK分享消息
},
inline: true,
textMap: {
update: '编辑',
create: '创建'
},
tableKey: 0,
videoUploadPercent: 0,
}
},
created() {
this.getList();
},
computed: {
...mapGetters([
'elements',
'belong2Type'
]),
getHeaderWithToken() {
return {Authorization: getToken()};
}
},
methods: {
/**
* 关闭关键标签配置
* */
cancelHandel() {
this.oneTypeDialogVisible = false;
},
/**
* 关闭创建弹框
* */
cancelCreateHandel(){
this.createDialogVisible = false;
},
beforeUploadVideo(file) {
const isLt10M = file.size / 1024 / 1024 < 10;
if (['video/mp4', 'video/ogg', 'video/flv','video/avi','video/wmv','video/rmvb'].indexOf(file.type) == -1) {
this.$message.error('请上传正确的视频格式');
return false;
}
if (!isLt10M) {
this.$message.error('上传视频大小不能超过10MB哦!');
return false;
}
},
uploadVideoProcess(event, file, fileList){
this.videoFlag = true;debugger
this.videoUploadPercent = file.percentage.toFixed(0)*1;
},
handleVideoSuccess(res, file) {
this.videoFlag = false;
this.videoUploadPercent = 0;
if(res.status == 200){
this.videoForm.Video = res.data;
}else{
this.$message.error('视频上传失败,请重新上传!');
}
},
/**
* 创建拍拍消息
* */
createMsgs(){
this.createDialogVisible = false;
// let params = {
// id: this.formE.msgId,
// visible: this.formE.visible,//1、公开 2、保密
// source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
// };
console.log(this.formC);
console.log(this.addressObj);
// updateMsg(params).then(response => {
// if (response.status === 200) {
// this.$notify({
// title: '成功',
// message: '成功',
// type: 'success',
// duration: 2000
// });
// this.oneTypeDialogVisible = false;
// this.getList();
// } else {
// this.$notify({
// title: '失败',
// message: '操作失败!',
// type: 'error',
// duration: 2000
// });
// }
// });
},
/**
* 保存编辑
* */
updateMsgs(){
let params = {
id: this.formE.msgId,
visible: this.formE.visible,//1、公开 2、保密
source: this.formE.source,//来源: 1、'后台创建' 2、'app用户'
};
console.log(params);
updateMsg(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.oneTypeDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '失败',
message: '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 添加
* */
handleCreate() {
this.modalTitle = '创建';
this.formC = {
title: undefined,//标题
desc:undefined,//描述
share: undefined,//分享次数
praise:undefined,//点赞数
comment: undefined,//评论数
address: undefined,//创建位置
listVideoUrl:'',//视频
visible: '1',//1、公开 2、保密
source: "1",//来源: 1、'后台创建' 2、'app用户'
};
this.createDialogVisible = true;
},
/**
* 查看视频
* */
handleVideo(videosList){
this.videosList = videosList;
this.videoDialogVisible = true;
},
/**
* 公开、秘密 参数 visible 1:公开,2:私密
*/
upStatus(row){
let params = {
id: row.msgId,
visible: row.visible==1?2:1
};
updateMsg(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message: '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 删除
* */
deleteHandler(row) {
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delMsg({id:row.msgId}).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '删除成功',
type: 'success',
duration: 2000
});
this.bannerDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '删除失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
})
},
/**
* 关闭地址弹框
* */
addressEvent(obj) {
this.showAddressVisible = false;
if (obj) {
this.addressObj = obj;
let provinceObj = getRegionByCodes([obj.province]);
let cityObj = getRegionByCodes([obj.city]);
this.addressObj.provinceName = provinceObj[0].name;
this.addressObj.cityName = cityObj[0].name;
this.formC.addressStr = this.addressObj.provinceName + this.addressObj.cityName + this.addressObj.address;
console.log(this.addressObj);
}
},
/**
* 编辑创建地址
* */
selectDestination() {
let that = this;
this.addressObj.eventName = 'addressEvent';
this.addressObj.keyword = this.addressObj.address?this.addressObj.address:this.addressObj.addressStr?this.addressObj.addressStr:'';
this.showAddressVisible = true;
},
/**
* 编辑
* */
handleUpdate(row) {
this.modalTitle = '编辑';
console.log(row);
this.formE = {
msgId: row.msgId,//消息id
title: row.body.title?row.body.title:'',//标题
videos: row.body.videos?row.body.videos:[],//视频
desc:row.body.text,//描述
crtTime: timestamp2Date(row.body.time),//创建时间
userId: row.userId,
share: row.count.share,//分享次数
praise: row.count.praise,//点赞数
comment: row.count.comment,//评论数
address: row.body.address,//创建位置
visible: row.visible+'',//1、公开 2、保密
source: row.source+''
};
this.oneTypeDialogVisible = true;
},
/**
* 详情modal传递回来的数据
* */
oneDialogEvent(e){
this.oneTypeDialogVisible = false;
if(e){
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 获取拍拍列表
* */
getList() {
this.listLoading = true;
let params = objDeepCopy(this.listQuery);
params.comment = this.listQuery.comment? this.listQuery.comment:undefined;
params.praise = this.listQuery.praise?this.listQuery.praise:undefined;
if(this.listQuery.startTime && (typeof this.listQuery.startTime == "object")){
params.startTime = this.listQuery.startTime.getTime()/1000;
}
if(this.listQuery.endTime && (typeof this.listQuery.endTime == "object")){
params.endTime = this.listQuery.endTime.getTime()/1000;
}
page(params).then(response => {
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.list) && this.$utils.isInteger(response.data.total)) {
response.data.list.map(function(item){
});
listRs = response.data.list;
totalCountRs = response.data.total;
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
})
},
/**
* 搜索
* */
handleFilter() {
this.listQuery.page = 1;
this.$refs.queryForm.validate(valid => {
if (valid) {
this.getList();
} else {
return false;
}
});
},
handleSizeChange(val) {
this.listQuery.limit = val;
this.getList();
},
handleCurrentChange(val) {
this.listQuery.page = val;
this.getList();
},
/**
* 重置
* */
reloadPage() {
this.listQuery = {
page: 1,
limit: 20,
startTime: undefined,//开始时间
endTime: undefined,//结束时间
source: undefined,//来源
startTime: undefined,//创建时间
praise:undefined,//点赞数
comment: undefined,//评论数
username: undefined,//用户名
type: 4,//消息类型
};
this.getList()
},
}
}
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment