Commit db836313 authored by hanfeng's avatar hanfeng

Merge branch 'base-modify' of http://113.105.137.151:22280/youjj/cloud-platform-ui into base-modify

parents 680c86fe a874443d
......@@ -8,3 +8,4 @@ test/unit/coverage
test/e2e/reports
selenium-debug.log
.idea
config/dev.env.js
module.exports = {
NODE_ENV: '"development"',
BASE_API: '"http://10.1.37.246:8765"',//'"https://xxfcmgmt.upyuns.com"(正)',//http://10.1.37.192:9527(何), //https://xxtest.upyuns.com(测),10.1.37.246:9527(韩), 10.1.37.244(李斌)10.1.37.248:8765(小威)
BASE_API: '"https://dev.dfangche.com"',//'"https://xxfcmgmt.upyuns.com"(正)',//http://10.1.37.192:9527(何), //https://xxtest.upyuns.com(测),10.1.37.246:9527(韩), 10.1.37.244(李斌)10.1.37.248:8765(小威)
APP_ORIGIN: '"https://wallstreetcn.com"'
}
import fetch from 'utils/fetch';
/**
* 获活动列表List
*/
export function getActivityList(query) {
return fetch({
url: '/api/uccn/admin/summitActivity/list',
method: 'post',
data: query
});
}
/**
* 根据id获取一条活动数据
*/
export function getOneActivityShop(id) {
return fetch({
url: '/api/uccn/admin/summitActivity/' + id,
method: 'get'
});
}
/**
* 编辑活动数据
* */
export function editActivity(query) {
return fetch({
url: '/api/uccn/admin/summitActivity/save',
method: 'post',
data: query
});
}
/**
* 活动上架、下架
* */
export function isShowStatus(id, state) {
return fetch({
url: '/api/uccn/admin/summitActivity/soldout/' + id + '/' + state,
method: 'put'
});
}
/**
* 活动发布、不发布
* */
export function isPublishStatus(id, state) {
return fetch({
url: '/api/uccn/admin/summitActivity/publish/' + id + '/' + state,
method: 'put'
});
}
/**
*删除活动
*/
export function deleteActivityTag(id) {
return fetch({
url: '/api/uccn/admin/summitActivity/' + id,
method: 'delete'
});
}
......@@ -7,7 +7,7 @@
<el-input v-model="form.name" placeholder="输入公司全称"></el-input>
</el-form-item>
<el-form-item label="公司简称" prop="name">
<el-form-item label="公司简称" prop="companyName">
<el-input v-model="form.companyName" placeholder="输入公司简称"></el-input>
</el-form-item>
......@@ -42,18 +42,18 @@
</el-select>
</el-form-item>
<el-form-item label="详细地址" prop="leader">
<el-form-item label="详细地址">
<el-input v-model="form.addrDetail" placeholder="请输入详细地址"></el-input>
</el-form-item>
<el-form-item label="经度" prop="longitude">
<el-form-item label="经度">
<el-input v-model.number="form.longitude" placeholder="请输入经度"></el-input>
</el-form-item>
<el-form-item label="纬度" prop="latitude">
<el-form-item label="纬度">
<el-input v-model.number="form.latitude" placeholder="请输入纬度"></el-input>
</el-form-item>
<el-form-item label="负责人" prop="leader">
<el-form-item label="负责人">
<el-input v-model="form.leader" placeholder="请输入负责人"></el-input>
</el-form-item>
......@@ -61,11 +61,11 @@
<el-input v-model="form.leaderContactInfo" placeholder="请输入负责人电话"></el-input>
</el-form-item>
<el-form-item label="租车客服电话" prop="vehiceServicePhone">
<el-form-item label="租车客服电话">
<el-input v-model="form.vehiceServicePhone" placeholder="请输入租车客服电话"></el-input>
</el-form-item>
<el-form-item label="旅游客服电话" prop="tourServicePhone">
<el-form-item label="旅游客服电话">
<el-input v-model="form.tourServicePhone" placeholder="请输入旅游客服电话"></el-input>
</el-form-item>
<el-form-item label="app展示">
......@@ -188,22 +188,6 @@
isShow: "2",//1:是, 2:否
},
rules: {
// latitude: [
// {
// type: 'number',
// required: true,
// message: '请输入数字',
// trigger: 'blur'
// }
// ],
// longitude: [
// {
// type: 'number',
// required: true,
// message: '请输入数字',
// trigger: 'blur'
// }
// ],
status: [
{
type: 'integer',
......@@ -220,10 +204,10 @@
trigger: 'blur'
}
],
name: [
companyName: [
{
required: true,
message: '请输称',
message: '请输称',
trigger: 'blur'
},
{
......@@ -233,10 +217,10 @@
trigger: 'blur'
}
],
addrDetail: [
name: [
{
required: true,
message: '请输入详细地址',
message: '请输名称',
trigger: 'blur'
},
{
......@@ -246,29 +230,42 @@
trigger: 'blur'
}
],
leaderContactInfo: [
addrDetail: [
{
required: false,
message: '请输入联系人电话',
required: true,
message: '请输入详细地址',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (!value) {
return true;
} else {
const reg = /^[1](([3][0-9])|([4][5,7,9])|([5][0-9])|([6][6])|([7][1,2,3,5,6,7,8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/
console.log(reg.test(value));
if (reg.test(value)) {
callback();
} else {
return callback(new Error('请输入正确的手机号'));
}
}
},
min: 0,
max: 200,
message: '长度小于 200 个字符',
trigger: 'blur'
}
],
// leaderContactInfo: [
// {
// required: false,
// message: '请输入联系人电话',
// trigger: 'blur'
// },
// {
// validator: (rule, value, callback) => {
// if (!value) {
// return true;
// } else {
// const reg = /^[1](([3][0-9])|([4][5,7,9])|([5][0-9])|([6][6])|([7][1,2,3,5,6,7,8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/
// console.log(reg.test(value));
// if (reg.test(value)) {
// callback();
// } else {
// return callback(new Error('请输入正确的手机号'));
// }
// }
// },
// trigger: 'blur'
// }
// ],
addrProvince: [
{
required: true,
......@@ -294,24 +291,6 @@
},
trigger: 'blur'
}
],
addrTown: [
{
required: true,
type: 'number',
message: '请选择镇(县)',
trigger: 'blur'
},
{
validator: (rule, value, callback) => {
if (this.$utils.isInteger(this.form.addrCity) &&
value.toString().substr(0, 4) != this.form.addrCity.toString().substr(0, 4)) {
return callback(new Error('请选择城市下相应镇(县)'));
}
callback();
},
trigger: 'blur'
}
]
},
tabName: "first",
......@@ -330,6 +309,7 @@
created() {
this.activeName2 = undefined;
if(this.dialogStatus == "create"){
this.activeName2 = "first";
this.tabName = "first";
}else if(this.dialogStatus == "companyInfoUpdate"){
//公司介绍编辑
......@@ -421,7 +401,7 @@
t.form.companyName = info.companyName;//简称
t.form.zoneId = info.zoneId;//简称
t.form.describes = info.describes;//公司简介
t.form.content = info.content;//公司详情
t.form.content = info.content?info.content: "";//公司详情
t.form.addrProvince = info.addrProvince;//省-编码
t.form.addrCity = info.addrCity;//市-编码
t.form.addrTown = info.addrTown;//县-编码
......@@ -514,7 +494,7 @@
});
let provinceObj = this.form.addrProvince?getRegionByCodes([this.form.addrProvince]): [{name:""}];
let cityObj = this.form.addrCity?getRegionByCodes([this.form.addrCity]):[{name:""}];
let addrTownObj = this.form.addrCity?getRegionByCodes([this.form.addrTown]):[{name:""}];
let addrTownObj = this.form.addrTown?getRegionByCodes([this.form.addrTown]):[{name:""}];
params.state = this.state == 1?2:1;//("上下架:1-上架;2-下架")
params.images = arr.join(",");
params.id = this.form.id;
......@@ -579,7 +559,7 @@
});
let provinceObj = this.form.addrProvince?getRegionByCodes([this.form.addrProvince]): [{name:""}];
let cityObj = this.form.addrCity?getRegionByCodes([this.form.addrCity]):[{name:""}];
let addrTownObj = this.form.addrCity?getRegionByCodes([this.form.addrTown]):[{name:""}];
let addrTownObj = this.form.addrTown?getRegionByCodes([this.form.addrTown]):[{name:""}];
params.images = arr.join(",");
params.id = this.form.id;
params.companyId = this.form.companyId;
......@@ -688,7 +668,7 @@
});
let provinceObj = this.form.addrProvince?getRegionByCodes([this.form.addrProvince]): [{name:""}];
let cityObj = this.form.addrCity?getRegionByCodes([this.form.addrCity]):[{name:""}];
let addrTownObj = this.form.addrCity?getRegionByCodes([this.form.addrTown]):[{name:""}];
let addrTownObj = this.form.addrTown?getRegionByCodes([this.form.addrTown]):[{name:""}];
params.images = arr.join(",");
params.name= this.form.name;//全称
params.companyName = this.form.companyName;//简称
......@@ -811,13 +791,6 @@
} else {
this.form.addrTown = undefined;
}
},
/**
* 弹框-取消
* */
cancel() {
console.log("取消禁用");
cancleBook(this.currentItem.ii.vehicleBookRecord.id).then(response => {this.$emit("companyInfoDialogEvent", true);});
}
}
}
......
......@@ -188,6 +188,7 @@
});
this.$emit("stockRightDialogEvent", true);
}else{
this.form.price = this.form.price/10000;
this.$notify({
title: '失败',
message: res.message,
......
<template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div v-if="!oneCampsiteDialogVisible">
<div class="filter-container" ref="filter-container">
<el-form ref="queryForm" :inline="inline" :model="listQuery" label-width="100px">
<el-row>
<el-col :span="8">
<el-form-item label="标题">
<el-input v-model.number="listQuery.title" placeholder="请输入标题"></el-input>
</el-form-item>
</el-col>
<!--<el-col :span="8">-->
<!--<el-form-item label="时间">-->
<!--<el-date-picker-->
<!--v-model="listQuery.startTime"-->
<!--type="date"-->
<!--clearable-->
<!--placeholder="选择日期">-->
<!--</el-date-picker>~-->
<!--<el-date-picker-->
<!--v-model="listQuery.endTime"-->
<!--type="date"-->
<!--clearable-->
<!--placeholder="选择日期">-->
<!--</el-date-picker>-->
<!--</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" style="margin-left: 10px;" @click="handleCreate"
type="primary" icon="edit" v-if="campsite_btn_save">添加
</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 width="150" align="center" label="活动图片">
<template scope="scope">
<img v-if="$utils.isString(scope.row.banner) && !$utils.isEmpty(scope.row.banner)" :src="scope.row.banner" style="width:100px;max-height:100px;">
</template>
</el-table-column>
<el-table-column align="center" width="200" label="标题">
<template scope="scope">
<img :src="scope.row.cover" style="width: 30px;"/>
<span>{{scope.row.title}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="副标题">
<template scope="scope">
<span>{{scope.row.subtitle}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="活动对象说明">
<template scope="scope">
<span>{{scope.row.actDesc}}</span>
</template>
</el-table-column>
<el-table-column width="100" align="center" label="总人数">
<template scope="scope">
<span>{{scope.row.limitNum}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="活动地址">
<template scope="scope">
<span>{{scope.row.province}}{{scope.row.city}}{{scope.row.town}}{{scope.row.address}}</span>
</template>
</el-table-column>
<el-table-column width="200" align="center" label="活动时间">
<template scope="scope">
<span>{{scope.row.starTimetStr}}</span><br/>
~<br />
<span>{{scope.row.endTimeStr}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="200" label="创建时间">
<template scope="scope">
<span>{{scope.row.crtTimeStr}}</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)">{{campsiteshop_btn_update?"编辑":"查看"}}
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" v-if="(scope.row.isShow==0) && campsiteshop_btn_update_salestatus" @click="isShowStatus(scope.row)">上架
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" v-if="scope.row.isShow==1 && campsiteshop_btn_update_salestatus" @click="isShowStatus(scope.row)">下架
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" v-if="(scope.row.isPublish==0) && campsiteshop_btn_update_salestatus" @click="isPublishStatus(scope.row)">发布
</el-button>
<el-button size="small" class="el-button el-button--text el-button--small" v-if="scope.row.isPublish==1 && campsiteshop_btn_update_salestatus" @click="isPublishStatus(scope.row)">不发布
</el-button>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" @click="deleteHandler(scope.row)" v-if="campsiteshop_btn_del">删除</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>
<!-- 营地modal弹窗 -->
<oneCampsite v-if="oneCampsiteDialogVisible" :campsiteshop_btn_update="campsiteshop_btn_update" :oneRow="oneRow" :title="modalTitle" v-on:oneCampsiteDialogEvent = "oneCampsiteDialogEvent"></oneCampsite>
</div>
</template>
<script>
import oneCampsite from './modal/oneCampsiteModal'// 营地
import 'static/css/uploadImg.css';// 引入图片上传组件对话框
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 {
getActivityList,
isShowStatus,
isPublishStatus
} from '../../api/officialWebsit/activity';
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,
oneCampsite
},
data() {
return {
modalTitle: "创建",
BASE_API: process.env.BASE_API,
oneCampsiteDialogVisible: false,//添加、编辑弹框
showLoadingBody: false,
form: {
tagNames:"",//标签
name: undefined,//旅游名称
saleCount: undefined,//销量
stock: undefined,//总数量
},
list: null,
total: null,
listLoading: true,
listQuery: {
page: 1,
limit: 20,
startTime: undefined,
endTime:undefined,
title: '',//关键词
},
inline: true,
textMap: {
update: '编辑',
create: '创建'
},
tableKey: 0,
campsite_btn_save: false,//添加
campsiteshop_btn_update: false,//编辑
campsiteshop_btn_update_salestatus:false,//上下架
campsiteshop_btn_del: false,//删除
}
},
created() {
this.campsite_btn_save = this.elements['campsite:btn_save'];
this.campsiteshop_btn_update = this.elements['campsiteshop:btn_update'];
this.campsiteshop_btn_update_salestatus = this.elements['campsiteshop:btn_update_salestatus'];
this.campsiteshop_btn_del = this.elements['campsiteshop:btn_del'];
this.getList();
},
computed: {
...mapGetters([
'elements'
])
},
methods: {
/**
* 添加
* */
handleCreate() {
this.resetTemp();
this.oneRow = {};
this.modalTitle = '创建';
this.oneCampsiteDialogVisible = true;
},
/**
* 操作-删除
* */
deleteHandler(row) {
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
deleteActivityTag(row.id).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '删除成功',
type: 'success',
duration: 2000
});
this.oneCampsiteDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '删除失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
})
},
/**
* 上架、下架 参数 id status 1-上架;2-下架 post
*/
isShowStatus(row){
let params = {
id: row.id,
state: row.isShow== 1 ? 0 : 1
};
isShowStatus(params.id, params.state).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.oneCampsiteDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 上架、下架 参数 id status 1-上架;2-下架 post
*/
isPublishStatus(row){
let params = {
id: row.id,
state: row.isPublish== 1 ? 0 : 1
};
isPublishStatus(params.id, params.state).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '成功',
type: 'success',
duration: 2000
});
this.oneCampsiteDialogVisible = false;
this.getList();
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 编辑
* */
handleUpdate(row) {
this.modalTitle = '编辑';
this.oneRow = row;
this.oneCampsiteDialogVisible = true;
},
/**
* 下架
* */
undercarriageHandler(row) {
// open dialog
this.departureDialogVisible = true;
this.clearDepartureForm();
let that = this;
let selectArry = [];
this.allCompaniesArr.map(function(item){
item.value = item.name;
selectArry.push(item);
});
this.departureForm.mileage = row.mileage;
this.departureForm.expectArrivalBranchCompanyId = row.subordinateBranch;
this.departureForm.departureBranchCompanyId = row.subordinateBranch;
selectArry.map(function (iitem) {
if( row.subordinateBranch == iitem.id){
that.departureForm.departureBranchCompanyName = iitem.name;
that.departureForm.expectArrivalBranchCompanyName = iitem.name;
}
});
this.departureForm.vehicleId = row.id;
this.departureForm.numberPlate = row.numberPlate;
this.departureForm.departureDate = Date();
},
/**
* 旅游modal传递回来的数据
* */
oneCampsiteDialogEvent(e){
this.oneCampsiteDialogVisible = false;
if(!e){//关闭编辑
this.oneCampsiteDialogVisible = e;
} else if(e){
//编辑成功-重新加载列表
this.getList();
}
},
/**
* 获取旅游列表
* */
getList() {
this.listLoading = true;
if(this.listQuery.startTime){
this.listQuery.startTime = this.listQuery.startTime.getTime();
}
if(this.listQuery.endTime){
this.listQuery.endTime = this.listQuery.endTime.getTime();
}
getActivityList(this.listQuery).then(response => {
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.data) && this.$utils.isInteger(response.data.totalCount)) {
listRs = response.data.data;
totalCountRs = response.data.totalCount;
listRs.map(function(item){
item.visible2 = false;
item.crtTimeStr = timestamp2Date(item.crtTime);
item.starTimetStr = timestamp2Date(item.startTime);
item.endTimeStr = timestamp2Date(item.endTime);
});
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
})
},
getAddrStr(branchCompany) {
let regions = getRegionByCodes([branchCompany.addrProvince, branchCompany.addrCity, branchCompany.addrTown]);
let address = [];
for(let i = 0; i < regions.length; i++){
address.push(regions[i].name);
}
return address.join(" ");
},
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();
},
/**
* 操作-申请预定
* */
handleApply(row) {
this.resetTemp4Apply();
let that = this;
let selectArry = [];
this.allCompaniesArr.map(function(item){
item.value = item.name;
selectArry.push(item);
});
this.form4Apply.liftCompany = row.subordinateBranch;
selectArry.map(function (iitem) {
if( row.subordinateBranch == iitem.id){
that.form4Apply.state3 = iitem.name;
}
});
this.form4Apply.vehicle = row.id;
getBookedInfoIn2Month(row.id)
.then(response => {
this.curBookedInfo3Month = response.data;
this.dialogStatus = 'apply';
this.dialogForm4ApplyVisible = true;
});
},
handleBookInfo(row) {
this.$refs.bookInfoViewer.handleBookInfo(row.id);
},
create(formName) {
const set = this.$refs;
if(!this.form.state2 || this.form.state2 == "全部"){
this.form.subordinateBranch = undefined;
this.$notify({
title: '失败',
message: '请选择分公司',
type: 'warning',
duration: 2000
});
return;
}
set[formName].validate(valid => {
if (valid) {
let formTemp = this.fillDateRange2Object(this.form, 'insuranceDateRange4form', 'insuranceStartDate', 'insuranceEndDate');
convertDate2Str(formTemp);
addObj(formTemp)
.then(response => {
if (response.code === rsCode.RS_CODE_SUC) {
this.dialogFormVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '创建成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
} else {
return false;
}
});
},
cancel(formName) {
this.dialogFormVisible = false;
this.dialogForm4ApplyVisible = false;
this.$refs[formName].resetFields();
},
cancel4Apply(formName) {
this.dialogForm4ApplyVisible = false;
this.$refs[formName].resetFields();
},
update(formName) {
const set = this.$refs;
if(!this.form.state2 || this.form.state2 == "全部"){
this.form.subordinateBranch = undefined;
this.$notify({
title: '失败',
message: '请选择分公司',
type: 'warning',
duration: 2000
});
return;
}
set[formName].validate(valid => {
if (valid) {
let formTemp = this.fillDateRange2Object(this.form, 'insuranceDateRange4form', 'insuranceStartDate', 'insuranceEndDate');
convertDate2Str(formTemp);
putObj(formTemp).then(response => {
if (response.code === rsCode.RS_CODE_SUC) {
this.dialogFormVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '更新成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
} else {
return false;
}
});
},
/**
* 申请预定-确定
* @param formName
*/
apply(formName) {
if(!this.form4Apply.state3 || this.form4Apply.state3 == "全部"){
this.form4Apply.liftCompany = undefined;
this.$notify({
title: '失败',
message: '请选择提车分公司',
type: 'warning',
duration: 2000
});
return;
}
if(!this.form4Apply.state4 || this.form4Apply.state4 == "全部"){
this.form4Apply.retCompany = undefined;
this.$notify({
title: '失败',
message: '请选择还车分公司',
type: 'warning',
duration: 2000
});
return;
}
const set = this.$refs;
set[formName].validate(valid => {
if (valid) {
this.dialogFormVisible = false;
book(this.form4Apply).then(() => {
this.dialogForm4ApplyVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '预定成功',
type: 'success',
duration: 2000
});
});
} else {
return false;
}
});
},
resetTemp() {
this.form = {
tagNames:"",//标签
name: undefined,//旅游名称
saleCount: undefined,//销量
stock: undefined,//总数量
};
},
resetTemp4Apply() {
this.form4Apply = {
bookStartDate: undefined,
bookEndDate: undefined,
state3: '',
state4:'',
retCompany: undefined,
vehicle: undefined,
selectedAccItem: undefined,
liftCompany: undefined,
liftAddr: undefined,
destination: undefined,
remark: undefined
};
},
resetTemp4BookInfo() {
this.form4BookInfo = {
selectedMonth: this.$utils.toDateString(newEast8Date(), 'yyyy-MM'),
vehicle: undefined
};
}
}
}
</script>
<template>
<div class="app-container calendar-list-container" v-loading.body="showLoadingBody">
<div class="filter-container" ref="filter-container">
<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="98">
</el-table-column>
<el-table-column width="160" align="center" label="标题">
<template scope="scope">
<span>{{scope.row.title}}</span>
</template>
</el-table-column>
<el-table-column width="180" align="center" label="类型">
<template scope="scope">
<span>{{scope.row.type==0?"首页":scope.row.type==1?"旅游":scope.row.type==2?"营地":scope.row.type==3?"房车":scope.row.type==4?"活动":scope.row.type==5}}</span>
</template>
</el-table-column>
<el-table-column width="250" align="center" label="banner图">
<template scope="scope">
<img :src="scope.row.cover" style="width:100%;max-height:100px;">
</template>
</el-table-column>
<el-table-column align="center" label="跳转">
<template scope="scope">
<span>{{scope.row.url}}</span>
</template>
</el-table-column>
<el-table-column align="center" width="150" label="操作">
<template scope="scope">
<el-button size="small" class="el-button el-button--text el-button--small" @click="handleUpdate(scope.row)">编辑
</el-button>
<el-button class="el-button el-button--text el-button--small" style="color:red;" size="small" @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.pageNo" :page-sizes="[10,20,30, 50]" :page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
</div>
<!-- banner modal弹窗 -->
<el-dialog :title="modalTitle" :visible.sync="bannerDialogVisible">
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入标题"></el-input>
</el-form-item>
<!--0-app首页,1-app旅游页;2-租车-->
<el-form-item label="类型" prop="type">
<el-radio class="radio" v-model="form.type" label="0">首页</el-radio>
<el-radio class="radio" v-model="form.type" label="1">旅游</el-radio>
<el-radio class="radio" v-model="form.type" label="2">营地</el-radio>
<el-radio class="radio" v-model="form.type" label="3">房车</el-radio>
<el-radio class="radio" v-model="form.type" label="4">活动</el-radio>
</el-form-item>
<!--BASE_API + -->
<el-form-item label="banner图" prop="cover" :style="{display:'block'}">
<el-upload
class="avatar-uploader"
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
:show-file-list="false"
:headers="getHeaderWithToken"
:on-success="handleAvatarSuccess">
<img v-if="$utils.isString(form.cover) && !$utils.isEmpty(form.cover)" :src="form.cover" style="width:500px;max-height:300px;">
<i v-else class="el-icon-plus avatar-uploader-icon" style="lineHeight:100px;width:500px;height: 100px;"></i>
</el-upload>
</el-form-item>
<el-form-item>
建议尺寸:1080*630
</el-form-item>
<el-form-item label="跳转链接">
<el-input v-model="form.url" placeholder="请输入跳转链接"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancelHandel">取 消</el-button>
<el-button v-if="modalTitle=='创建'" type="primary" @click="create('form')">确 定</el-button>
<el-button v-else type="primary" @click="update('form')">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import 'static/css/uploadImg.css';// 引入图片上传组件对话框
import {
formatDate
} from 'utils/dateFormattor';
import {
toEast8Date,
deepCopyDate,
newEast8Date,
convertDate2Str
} from 'utils/dateUtils';
import {
getBannerList,
editBanner,
addBanner,
delBanner
} from 'api/tourManage';
import rsCode from '../../utils/rsCode';
import {mapGetters} from 'vuex';
import {
getToken
} from '../../utils/auth';
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
},
data() {
return {
tableKey:0,
modalTitle: "创建",
BASE_API: process.env.BASE_API,
bannerDialogVisible: false,//添加、编辑弹框
showLoadingBody: false,
form: {
title: "",
url: "",
cover:"",
type: "0",
location: "0",
platform: 1
},
listQuery: {
pageNo: 1,
pageSize: 20,
platform: 1
},
rules: {
title: {
type: 'string',
required: true,
message: '请输入标题',
trigger: 'blur'
},
type:{
type: 'string',
required: true,
message: '请选择banner类型',
trigger: 'blur'
},
location:{
type: "string",
required: true,
message: '请选择位置类型',
trigger: 'blur'
},
cover: {
type: 'string',
required: true,
message: '请上传图片',
},
},
list: null,
total: null,
listLoading: true,
inline: true,
banner_btn_edit: false,//编辑
banner_btn_add: false,//添加
}
},
created() {
this.getList();
this.banner_btn_edit = true;//this.elements['tourManage:btn_edit'];
this.banner_btn_add = true;//this.elements['tourManage:btn_add'];
},
computed: {
...mapGetters([
'elements',
'belong2Type'
]),
getHeaderWithToken() {
return {Authorization: getToken()};
},
},
methods: {
handleSizeChange(val) {
this.listQuery.pageSize = val;
this.getList();
},
handleCurrentChange(val) {
this.listQuery.pageNo = val;
this.getList();
},
/**
* 添加
* */
handleCreate() {
this.cleanForm();
this.modalTitle = '创建';
this.bannerDialogVisible = true;
},
/**
* 操作-编辑
* */
handleUpdate(row) {
this.modalTitle = '编辑';
this.cleanForm();
this.form = row;
this.bannerDialogVisible = true;
},
/**
* 弹框-取消
* */
cancelHandel(){
this.cleanForm();
this.bannerDialogVisible = false;
},
/**
* 清空表单
* */
cleanForm() {
this.form = {
title: "",
cover: "",
url:"",
type: "0",
location: "0",
platform: 1
}
},
showImgDialog(drivingLicensePath) {
this.licenceSrcUrl = this.getDrivingLicenseUrl(drivingLicensePath);
this.dialogForm4LicenceVisible = true;
},
/**
* 获取banner列表数据
* */
getList() {
this.listLoading = true;
getBannerList(this.listQuery).then(response => {
let totalCountRs = undefined;
let listRs = undefined;
if (!this.$utils.isEmpty(response.data.data) && this.$utils.isInteger(response.data.totalCount)) {
listRs = response.data.data;
response.data.data.map(function(item){
item.type = item.type+"";
item.location = item.location?item.location+"": "0";
item.visible2 = false;
});
totalCountRs = response.data.totalCount;
}
this.listLoading = false;
this.list = listRs;
this.total = totalCountRs;
});
},
/**
* 创建
* */
create(formName) {
const set = this.$refs;
set[formName].validate(valid => {
if (valid) {
addBanner(this.form)
.then(response => {
if (response.status === 200) {
this.bannerDialogVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '创建成功',
type: 'success',
duration: 2000
});
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
} else {
return false;
}
});
},
/**
* 编辑-更新
* */
update(formName) {
const set = this.$refs;
set[formName].validate(valid => {
if (valid) {
editBanner(this.form).then(response => {
if (response.status === 200) {
this.bannerDialogVisible = false;
this.getList();
this.$notify({
title: '成功',
message: '编辑成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
} else {
return false;
}
});
},
/**
* 上传图片
* @param file
* @returns {boolean}
*/
beforeAvatarUpload(file) {
const isJPG = file.type === 'image/jpeg' || file.type === 'image/gif';
const isLt2M = file.size / 1024 / 1024 < 10;
if (!isJPG) {
this.$message.error('上传图片只能是 JPG/GIF 格式!');
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 10MB!');
}
this.showLoadingBody = true;
return isJPG && isLt2M;
},
handleAvatarSuccess(res, file) {
this.form.cover = res.data;
this.showLoadingBody = false;
},
/**
* 操作-删除
* */
deleteHandler(row) {
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delBanner(row.id).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '删除成功',
type: 'success',
duration: 2000
});
this.getList();
} else {
this.$notify({
title: '删除失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
})
},
getUrl(drivingLicensePath) {
return process.env.BASE_API +
'/vehicle/vehicleInfo/download/drivingLicense?realFileRelPath=' + encodeURI(drivingLicensePath);
},
}
}
</script>
<template>
<el-dialog :title="form.showTitle" :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-col :span="8">
<el-form-item label="城镇">
<el-select class="filter-item" v-model="listQuery.addrTown" 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,//详细地址
twon:undefined,
longitude: undefined,
latitude:undefined,
eventName: undefined
},
listQuery: {
addrProvince: undefined,
addrCity: undefined,
addrTown: 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'
},
addrTown:{
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;
let row = this.obj;
this.cleanForm();
this.form = this.obj;
this.listQuery.addrProvince = this.obj.province;
this.listQuery.addrCity = this.obj.city;
this.listQuery.addrTown = this.obj.town;
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;
}
if(!this.listQuery.addrTown){
this.$notify({
title: '请选择城镇',
message:'操作失败!',
type: 'error',
duration: 2000
});
return;
}
this.form.province = this.listQuery.addrProvince;
this.form.city = this.listQuery.addrCity;
this.form.town = this.listQuery.addrTown
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,
addrTown : 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 = "activity">
<h4>{{title}}</h4>
<el-form :model="form" :rules="rules" ref="form" label-width="90px">
<el-row>
<el-col :span="8">
<el-form-item label="标题" prop="title">
<el-input v-model="form.title" placeholder="请输入活动标题"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="副标题" prop="subtitle">
<el-input v-model="form.subtitle" placeholder="请输入活动副标题"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="活动主图" :style="{display:'block'}" prop="banner">
<el-upload
class="upload-demo"
:headers="getHeaderWithToken"
:action="BASE_API+'/api/universal/file/app/unauth/admin/upload'"
:show-file-list="false"
:on-success="handleAvatarSuccess"
list-type="picture">
<div slot="tip" class="el-upload__tip"><span style="color: red;">建议尺寸:485*485px</span></div>
<img v-if="$utils.isString(form.banner) && !$utils.isEmpty(form.banner)" :src="form.banner" style="width:300px;max-height:300px;">
<i v-else class="el-icon-plus avatar-uploader-icon" style="lineHeight:100px;width:300px;height: 100px;border: 1px dashed #ccc;"></i>
</el-upload>
</el-form-item>
<el-row>
<el-col :span="8">
<el-form-item label="总人数" prop="limitNum">
<el-input v-model="form.limitNum" placeholder="请输入总人数"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="开始时间" prop="startTime">
<el-date-picker v-model="form.startTime" type="datetime" :editable="true" format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="结束时间" prop="endTime">
<el-date-picker v-model="form.endTime" type="datetime" :editable="true" format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="报名时间" prop="regCloseTime">
<el-date-picker v-model="form.regCloseTime" type="datetime" :editable="true" format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="活动说明" prop="actDesc">
<el-input v-model="form.actDesc" placeholder="请输入活动说明"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="活动地址" prop="address">
<el-input v-model="form.addressStr" readonly placeholder="请输入活动地址" :on-icon-click="selectDestination" icon="edit"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="活动位置">
<el-select class="filter-item" v-model="form.location" placeholder="请选择状态">
<el-option :key="0" label="无限制" :value="0"></el-option>
<el-option :key="1" label="欣欣官网" :value="1"></el-option>
<el-option :key="2" label="滴房车官网" :value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<!--BASE_API + -->
<el-tabs v-model="activeName2" type="card" @tab-click="handleClick">
<el-tab-pane label="活动图文内容" name="first">
<!--<Editor v-if="activeName2=='first'" @input="handelContentIncrease" :value="form.content" :myQuillEditor="'myQuillEditorContent'" :activeName2="activeName2"></Editor>-->
<div class="editor-container" v-if="activeName2=='first'">
<UE :editorId="activeName2" :defaultMsg="form.content" :config=config ref="ue" @ready="editorReadyEvent"></UE>
</div>
</el-tab-pane>
</el-tabs>
<el-form-item></el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel">取 消</el-button>
<el-button type="primary" v-if="title=='创建' && !isCreate && campsiteshop_btn_update" @click="create('form')">确 定</el-button>
<el-button type="primary" v-if="title=='编辑' && !isCreate && campsiteshop_btn_update" @click="update('form')">确 定</el-button>
</div>
<!--编辑营地地址-->
<campsiteModal v-if="showCampsiteVisible && campsiteshop_btn_update" :obj="campsiteObj" v-on:campsiteEvent = "campsiteEvent"></campsiteModal>
<!--编辑营地标签-->
<campsiteLabelModal v-if="editLableVisible && campsiteshop_btn_update" :allLabelList="allLabelList" :checkList="checkList" v-on:tourLabelEvent = "tourLabelEvent"></campsiteLabelModal>
</div>
</template>
<style>
textarea{
display: none;
}
.info{
border-radius: 10px;
line-height: 20px;
padding: 10px;
margin: 10px;
background-color: #ffffff;
}
.el-upload-list{
display: flex;
width: 100px;
}
.el-upload-list li{
margin-left: 10px;
}
</style>
<script>
// import Editor from "../../modal/editorTool";//富文本
import UE from '../../modal/Ueditor';//百度ue富文本
import campsiteLabelModal from "../../tourManage/modal/tourLabelModal";//标签
import campsiteModal from "./campsiteModal";//营地地址
import {
getOneCampsiteShop,
campsiteAllTagList,
editCampsiteShop,
addCampsiteShop,
existCampsiteShop
} from 'api/campsiteManage';
import {
getOneActivityShop,
editActivity
} from 'api/officialWebsit/activity';
import {
getSonRegionByCodes,
getRegionByCodes,
} from 'api/base_info/region/';
import rsCode from '../../../utils/rsCode';
import {
getToken
} from '../../../utils/auth';
import {mapGetters} from 'vuex';
export default {
props: ["oneRow", "title", "campsiteshop_btn_update"],
name: 'upkeepDialog',
components: {
UE,
campsiteModal,
campsiteLabelModal
},
data() {
var checkPhone = (rule, value, callback) => {
if (!value) {
return callback(new Error('手机号不能为空'));
} else {
const reg = /^[1](([3][0-9])|([4][5,7,9])|([5][0-9])|([6][6])|([7][1,2,3,5,6,7,8])|([8][0-9])|([9][1,8,9]))[0-9]{8}$/
console.log(reg.test(value));
if (reg.test(value)) {
callback();
} else {
return callback(new Error('请输入正确的手机号'));
}
}
};
return {
imgPosterFlag:false,
percent_poster:0,
BASE_API: process.env.BASE_API,
defaultMsg: '这里是UE测试',
config: {
initialFrameWidth: null,
initialFrameHeight: 350
},
isExist:false,//名称是否已存在
campsiteObj: {},//营地地址
departureList: [],//出发地列表
departureObj:{name: ""},//出发地
pathway: [],//途径地
isCreate: false,//是否点击了创建-确定
fileList2:[],
activeName2: '',//行程亮点
form: {
id: undefined,
title: undefined,//营地名称
subtitle: undefined,//营地热度
startTime: undefined,//客服电话
endTime: undefined,//联系电话
regCloseTime: undefined,//省份
provinceCode: undefined,//省份名称
province: undefined,//市编号
cityName: undefined,//市名称
cityCode: undefined,//详细地址
city:undefined,
townCode:undefined,
town:undefined,
address:undefined,
latitude: undefined,
longitude: undefined,
limitNum:0,
isShow:0,
isOpenReg:0,
isDel:0,
isPublish:0,
isHomePage:0,
crtUser:undefined,
crtName:undefined,
crtTime:undefined,
actDesc:undefined,
willNum:undefined,
location:undefined,
rank:undefined,
type:undefined,
banner:undefined,
content: '',//营地详情
concat: "",//联系人
logo:undefined,//封面图
configure: '',//配套&收费
campsiteTagListVos: [],//营地类型
carouse:[],//banner轮播
posterBackground:'',//海报背景
},
showCampsiteVisible: false,//编辑营地地址
rules: {
name:{
type: 'string',
required: true,
message: '请输入营地名称',
trigger: 'blur'
},
servicePhone:{
type: 'string',
required: true,
message: '请输入客服电话',
trigger: 'blur'
},
phone:{validator: checkPhone, trigger: 'blur',required: true},
concat:{
type: 'string',
required: true,
message: '请输入联系人',
trigger: 'blur'
},
addressStr:{
type: 'string',
required: true,
message: '请输入营地地址',
}
},
checkList:[],//已选中的标签
allCompanies: {},
allCompaniesArr: [],
oneTourDialogVisible: false,
editLableVisible: false,//营地标签
allLabelList: [],//全部营地标签
}
},
created() {
},
watch: {
oneTourDialogVisible(newValue, oldValue){
if(!newValue){
this.cleanForm();
}
},
},
mounted() {
this.cleanForm();
if(this.title == "编辑"){
let row = this.oneRow;
this.getOne(row.id);
} else {
this.activeName2 = "first";
}
this.oneTourDialogVisible = true;
},
computed: {
getHeaderWithToken() {
return {Authorization: getToken()};
},
},
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
handleChange(id) {
console.log(id)
},
/**
* 编辑营地标签
* */
editLable(list){
console.log(list);
this.editLableVisible = true;
},
isExistCampsiteShop(type, datas){
if(type == "update"){//编辑
this.toUpdate(datas);
}
if(type == "create"){
//创建
this.toCreate(datas);
}
},
/**
* 创建
* */
create(formName){
const set = this.$refs;
if(this.form.startTime && (typeof this.form.startTime == "object")){
this.form.startTime = this.form.startTime.getTime();
}
if(this.form.endTime && (typeof this.form.endTime == "object")){
this.form.endTime = this.form.endTime.getTime();
}
if(this.form.regCloseTime && (typeof this.form.regCloseTime == "object")){
this.form.regCloseTime = this.form.regCloseTime.getTime();
}
set[formName].validate(valid => {
if (valid) {
let params = {
id: this.form.id,
title: this.form.title,//营地名称
subtitle: this.form.subtitle,//营地热度
startTime: this.form.startTime,//客服电话
endTime: this.form.endTime,//联系电话
regCloseTime: this.form.regCloseTime,//省份
provinceCode: this.form.provinceCode,//省份名称
province: this.form.province,//市编号
cityName: this.form.cityName,//市名称
cityCode: this.form.cityCode,//详细地址
city:this.form.city,
townCode:this.form.townCode,
town:this.form.town,
address:this.form.address,
latitude: this.form.latitude,
longitude: this.form.longitude,
limitNum:this.form.limitNum,
isShow:this.form.isShow,
isOpenReg:this.form.isOpenReg,
isDel:this.form.isDel,
isHomePage:this.form.isHomePage,
isHomePage:this.form.isHomePage,
crtUser:this.form.crtUser,
crtName:this.form.crtName,
crtTime:this.form.crtTime,
actDesc:this.form.actDesc,
banner:this.form.banner,
willNum:this.form.willNum,
location:this.form.location,
rank:this.form.rank,
type:this.form.type,
content: this.form.content,//营地详情
};
console.log(params);
this.isExistCampsiteShop("create", params);
} else {
return;
}
});
},
/**
* 编辑
* */
update(formName){
const set = this.$refs;
if(this.form.startTime && (typeof this.form.startTime == "object")){
this.form.startTime = this.form.startTime.getTime();
}
if(this.form.endTime && (typeof this.form.endTime == "object")){
this.form.endTime = this.form.endTime.getTime();
}
if(this.form.regCloseTime && (typeof this.form.regCloseTime == "object")){
this.form.regCloseTime = this.form.regCloseTime.getTime();
}
set[formName].validate(valid => {
if (valid) {
this.isCreate = true;
let params = {
id: this.form.id,
title: this.form.title,//营地名称
subtitle: this.form.subtitle,//营地热度
startTime: this.form.startTime,//客服电话
endTime: this.form.endTime,//联系电话
regCloseTime: this.form.regCloseTime,//省份
provinceCode: this.campsiteObj.province,//省份名称
province: this.campsiteObj.provinceName,//市编号
cityName: this.campsiteObj.cityName,//市名称
cityCode: this.campsiteObj.city,//详细地址
city:this.campsiteObj.cityName,
townCode:this.campsiteObj.townCode,
town:this.campsiteObj.town,
address:this.campsiteObj.address,
latitude: this.campsiteObj.latitude,
longitude: this.campsiteObj.longitude,
limitNum:this.form.limitNum,
isShow:this.form.isShow,
banner:this.form.banner,
isOpenReg:this.form.isOpenReg,
isDel:this.form.isDel,
isHomePage:this.form.isHomePage,
isHomePage:this.form.isHomePage,
crtUser:this.form.crtUser,
crtName:this.form.crtName,
crtTime:this.form.crtTime,
actDesc:this.form.actDesc,
willNum:this.form.willNum,
location:this.form.location,
rank:this.form.rank,
type:this.form.type,
content: this.form.content,//营地详情
};
this.isExistCampsiteShop("update", params);
} else {
return;
}
});
},
/**
* 更新
* */
toUpdate(params){
console.log("............修改")
editActivity(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '编辑成功',
type: 'success',
duration: 2000
});
this.$emit("oneCampsiteDialogEvent", true);
} else {
this.$notify({
title: '编辑失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 创建
* */
toCreate(params){
editActivity(params).then(response => {
if (response.status === 200) {
this.$notify({
title: '成功',
message: '创建成功',
type: 'success',
duration: 2000
});
this.$emit("oneCampsiteDialogEvent", true);
} else {
this.$notify({
title: '创建失败',
message: rsCode.msg[response.code] ? rsCode.msg[response.code] : '操作失败!',
type: 'error',
duration: 2000
});
}
});
},
/**
* 关闭营地地址弹框
* */
campsiteEvent(obj){
this.showCampsiteVisible = false;
if(obj){
this.campsiteObj = obj;
let provinceObj = getRegionByCodes([obj.province]);
let cityObj = getRegionByCodes([obj.city]);
this.campsiteObj.provinceName = provinceObj[0].name;
this.campsiteObj.cityName = cityObj[0].name;
this.form.addressStr = this.campsiteObj.provinceName + this.campsiteObj.cityName + this.campsiteObj.address;
console.log(this.campsiteObj);
}
},
/**
* 编辑营地地址
* */
selectDestination(){
let that = this;
this.campsiteObj.showTitle = "营地地址编辑";
this.campsiteObj.eventName ='campsiteEvent';
this.campsiteObj.keyword = this.campsiteObj.address;
this.showCampsiteVisible = true;
},
/**
* 关闭营地标签弹框
* */
tourLabelEvent(obj){
let that = this;
this.editLableVisible = false;
let arr = [];
let ckeckList = [];
if(obj){
this.allLabelList.map(function(item){
obj.map(function(b){
if(item.name == b){
arr.push(item);
ckeckList.push(b);
}
});
});
this.form.campsiteTagListVos = arr;
this.checkList = ckeckList;
console.log(obj);
}
},
/**
* 获取一条营地
* */
getOne(id){
let that = this;
getOneActivityShop(id).then(response => {
this.form = response.data;
this.campsiteObj = {
address: response.data.address,
province: response.data.provinceCode,
provinceName: response.data.province,
city: response.data.cityCode,
cityName: response.data.city,
townCode:response.data.townCode,
town:response.data.town,
latitude: response.data.latitude,
longitude: response.data.longitude,
townCode:response.data.townCode,
town:response.data.town
};
response.data.addressStr = this.campsiteObj.provinceName + this.campsiteObj.cityName + this.campsiteObj.town + this.campsiteObj.address;
})
},
/**
* 旅游-弹框-取消
* */
cancel() {
this.cleanForm();
this.$emit("oneCampsiteDialogEvent", false);
},
/**
* 配套&收费 富文本
* */
handelIntroduceIncrease(step){
this.form.configure = step;
},
/**
* 富文本 营地详情
* */
editorReadyEvent(instance){
let t = this;
instance.addListener('contentChange', () => {
if(t.activeName2 == "first"){
t.form.content = instance.getContent();
} else if(t.activeName2 == "second"){
t.form.actDesc = instance.getContent();
}
});
},
/**
* 封面图上传
* **/
handleAvatarSuccess(res, file){
console.log(res.data)
this.form.banner = res.data;
},
/**
* 清空旅游弹框数据
*/
cleanForm() {
this.campsiteObj ={name: ""};//营地地址
this.fileList2=[];
this.activeName2= '';//营地详情
this.form = {
id: undefined,
title: undefined,//营地名称
subtitle: undefined,//营地热度
startTime: "",//客服电话
endTime: "",//联系电话
regCloseTime: undefined,//省份
provinceCode: undefined,//省份名称
province: undefined,//市编号
cityName: undefined,//市名称
cityCode: undefined,//详细地址
city:undefined,
townCode:undefined,
town:undefined,
address:undefined,
latitude: undefined,
longitude: undefined,
limitNum:0,
isShow:0,
isOpenReg:0,
isDel:0,
banner:undefined,
isPublish:0,
isHomePage:0,
crtUser:undefined,
crtName:undefined,
crtTime:undefined,
actDesc:undefined,
willNum:undefined,
location:undefined,
rank:undefined,
type:undefined,
content: '',//营地详情
concat: "",//联系人
logo:undefined,//封面图
configure: '',//配套&收费
campsiteTagListVos: [],//营地类型
carouse:[],//banner轮播
posterBackground:'',//海报背景
};
this.showCampsiteVisible= false;//编辑营地地址
}
}
}
</script>
<style>
.activity .edui-editor {
z-index: 2000 !important;
}
</style>
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