Skip to content

P
pica.cloud.web-education-admin
提交 2b9da3c7 编写于 作者: bo.dang's avatar bo.dang
浏览文件
操作

增加广告位配置和排行榜配置

上级 ad8ec6aa
隐藏空白字符变更
内嵌 并排
正在显示 包含 1336 行增加 和 0 行删除
src/components/yqrange/ads-manage.vue 0 → 100644
浏览文件 @ 2b9da3c7
<template>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
label-suffix="："
class="basic-form">
<el-form-item label="是否显示广告位" class="required-label">
<el-radio-group v-model="formData.adShowFlag" size="small" class="required-label">
<el-radio :label="0">否</el-radio>
<el-radio :label="1">是</el-radio>
</el-radio-group>
</el-form-item>
<div class="basic-item-icon" v-if="formData.adShowFlag == 1">
<el-form-item label="图片" class="required-label">
<el-upload
v-model="formData.adImageUrl"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic1"
>
<img
v-if="formData.adImageUrl"
:src="formData.adImageUrl"
@mouseover.stop="imgMouseOver1=true"
class="bg-img"
/>
<img v-if="!formData.adImageUrl" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete"
v-show="imgMouseOver1"
@click.stop="deleteImg(1)"
@mouseout.stop="imgMouseOver1=false"
>
<i class="el-icon-delete"></i>
</div>
<div class="limit-text">
<p>限制大小: 500kb</p>
<p>最小尺寸：690*120</p>
<p>支持jpeg, png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage1">请选择图片</p>
</div>
<el-form-item label="链接类型" class="required-label" v-if="formData.adShowFlag == 1">
<el-select v-model="formData.adModuleDto.linkType" placeholder="请选择链接类型" style="width:88%">
<el-option
v-for="item1 in linkSelect"
:key="item1.value"
:label="item1.label"
:value="item1.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="选择模块" v-if="formData.adShowFlag == 1 && formData.adModuleDto.linkType == 4" class="required-label">
<el-select @focus="moduleIndex(index)" filterable v-model="formData.adModuleDto.name" @change="moduleChange" placeholder="请选择模块" style="width:88%">
<el-option
v-for="item2 in moduleArray.nameList"
:key="item2.id"
:label="item2.name"
:value="item2.name">
</el-option>
</el-select>
</el-form-item>
<div v-for="(i,j) in formData.adModuleDto.paramList2" :key="j" class="required-label" v-if="formData.adShowFlag == 1 && formData.adModuleDto.linkType == 4">
<el-form-item label="选择参数" v-if="formData.adModuleDto.paramFlag == 1">
<el-select v-model="formData.adModuleDto.paramList[j].value" filterable placeholder="请选择参数" style="width:88%">
<el-option
v-for="(item3,index3) in i"
:key="index3"
:label="item3.name"
:value="item3.id + '&'+ item3.name">
</el-option>
</el-select>
</el-form-item>
</div>
<div style="margin-top: 60px;margin-left: 250px;">
<el-button type="primary" @click="save()" center>保存</el-button>
<!--<el-button @click="cancle()">取 消</el-button>-->
</div>
<el-dialog
class="dialog-title-border-old"
title="图片裁剪"
:visible.sync="showCropper"
:width="currentOption.cropDialogWidth"
center>
<div slot="title" style="text-align: left;">
<span style="font-weight: 700;">图片裁剪</span>
</div>
<div v-if="showCropper" style="margin-bottom: 20px;">
<Cropper
:cropOption="currentOption"
@getCropImg="getCropImg(arguments)"
:originImg="slide2.oriUrl"
/>
</div>
</el-dialog>
</el-form>
</template>
<script>
let vm = null;
import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { getCircleAds, saveCircleAds, getLinkType, getParamData, getModuleData } from "../../utils/yqrange/yqrangeApi";
import Cropper from '@/components/common/cropper.vue'
export default {
components: {
Cropper
},
created() {
vm = this;
console.log("circleId: " + this.$route.query.id);
// const mobilePhone = localStorage.getItem("mobilePhone");
//
// if(mobilePhone == "13341740525" || mobilePhone == "18251938586"){
// this.deptFlag = true;
// }
// else {
// this.deptFlag = false;
// }
vm.getAds();
vm.getLinkType();
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
return {
showCropper: false,
moduleArray: [],
formData: {
circleId: this.$route.query.id,
adShowFlag: 0,
adImageUrl: "",
adModuleDto: {
linkType: 8, // 跳转类型:1 链接，4 模块， 8 无跳转
name: "", // 模块名称
paramFlag: 0, // 是否有参数标志1为有2为没有参数
paramList: [
{
id: "",
seqNo: '', // 选择参数的索引值
value: '',
key: '', // 参数名称，默认param
type:'' // 模块参数类型:1 int类型字符串 4String类型 8时间戳类型字符串
}
],
paramList2: [],
type: 0 // 类型:1 列表页，4 详情页
}
},
linkSelect: [], // 连接类型数组
currentOption: {
offset_x: 120,
offset_y: 185,
width: 160,
height: 120,
cvWidth: 1000,
cvHeight: 800,
uploadType: 1,
cropDialogWidth: '900px',
cropBoxResizable: true,
minCropBoxWidth: 100,
minCropBoxHeight: 100,
aspectRatio: 16/9
},
slide2: {
oriUrl: '', // 原图
},
rules: {
name: [
{ required: true, message: "请输入圈子名称", trigger: "blur" },
{
min: 2,
max: 14,
message: "输入长度为2-14的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
introduce: [
{ required: true, message: "请输入圈子介绍", trigger: "blur" },
{
min: 2,
max: 40,
message: "输入长度为2-40的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
adImageUrl: [
{ required: true, message: "请选择图片", trigger: "blur" }
],
dynamicFlag: [
{ required: true, message: "请选择内容发布权限", trigger: "blur" },
],
type: [
{ required: true, message: "请选择圈子类型", trigger: "blur" },
],
deptId: [
{ required: true, message: "请选择对接部门", trigger: "blur" }
]
},
imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语
contentList: [
{
value: 1,
label: '所有人可发布'
}, {
value: 2,
label: '管理员可发布'
},
],
deptList: [
{
value: 1,
label: '铁军部'
}, {
value: 2,
label: '医疗事业部'
},{
value: 3,
label: '商业化部'
},
],
deptFlag: false,
shareFlag: false
}
},
methods: {
getAds(){
let req = {
circleId: vm.formData.circleId
};
getCircleAds(req).then(function (res) {
if(res.code == "000000") {
vm.formData = res.data;
if(vm.formData.adModuleDto == null){
vm.formData.adModuleDto = {
linkType: 8, // 跳转类型:1 链接，4 模块， 8 无跳转
name: "", // 模块名称
paramFlag: 0, // 是否有参数标志1为有2为没有参数
paramList: [
{
id: "",
seqNo: '', // 选择参数的索引值
value: '',
key: '', // 参数名称，默认param
type:'' // 模块参数类型:1 int类型字符串 4String类型 8时间戳类型字符串
}
],
paramList2: [],
type: 0 // 类型:1 列表页，4 详情页
}
}
vm.getModuleData();
}
}).catch(function (error) {
vm.$message.error(error);
});
},
checkAdImagUrl(){
if(vm.formData.adShowFlag == 1 && vm.formData.adImageUrl == ""){
vm.$message.error("请上传图片！");
return false;
}
else {
return true;
}
},
save(){
let req = vm.formData;
if(vm.formData.adShowFlag == 0){
vm.formData.adImageUrl = "";
}
if(!vm.checkAdImagUrl()){
return;
}
saveCircleAds(req).then(function (res) {
if(res.code == "000000") {
vm.$message.success("保存成功！");
// vm.formData = res.data;
}
}).catch(function (error) {
vm.$message.error(error);
});
},
//上传圈子头像
beforeUploadPic1(file) {
this.currentOption.aspectRatio = 1/1;
this.currentOption.cropBoxResizable = true;
this.currentOption.minCropBoxWidth = 160;
this.currentOption.minCropBoxHeight = 160;
let fileLimit = {
width: 690,
height: 120,
size: 0.5,
sizeText: "500K",
key: "adImageUrl",
more: "imgUrl1More",
show: "uploadImgMessage1"
};
this.beforeUpload(file, fileLimit);
},
//上传图片
beforeUpload(file, fileLimit) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
vm.$message.error("图片必须是jpeg或png格式，同时长宽尺寸和图片大小需符合要求");
// return;
}
// if (!isLt2M) {
// vm.$message.error("图片大小不符合规范，请根据规范上传图片 ");
// return;
// }
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
// if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
if (_this.width < fileLimit.width || _this.height < fileLimit.height) {
vm.$message.error("图片必须是jpeg或png格式，同时长宽尺寸和图片大小需符合要求");
return;
}
else if(_this.width > fileLimit.width || _this.height > fileLimit.height){
vm.showCropper = true;
vm.currentOption.cvWidth = _this.width;
vm.currentOption.cvHeight = _this.height;
return;
}
else {
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
console.log('上传成功后路径', path);
if (fileLimit.show == "uploadImgMessage1") {
vm.uploadImgMessage1 = false;
} else if (fileLimit.show == "uploadImgMessage2") {
vm.uploadImgMessage2 = false;
}
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.name,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
//删除图片
deleteImg(type) {
if (type == 1) {
vm.formData.adImageUrl = "";
vm.imgMouseOver1 = false;
}
},
// 获取裁剪的图片数据
getCropImg(argument) {
this.showCropper = false;
this.cropData = argument[1]
vm.doUploadQiNiu(argument[2])
argument[3] && argument[3].destroy();
// vm.slide2.oriUrl = "";
},
// 上传七牛
doUploadQiNiu(file){
doUpload(this,file, getFilePath(file,null), 'preview4', 'uploadProgress1', '').then(function (path) {
vm.formData.adImageUrl = path.fullPath;
vm.$message.success('上传成功');
});
},
cancle(){
const _this = this;
setTimeout(function () {
_this.$router.go(-1)
}, 100);
},
changeType(){
if(vm.formData.type == 1 || vm.formData.type == 2){
vm.shareFlag = true;
}
else {
vm.shareFlag = false;
}
},
// 获取链接类型下拉数据
getLinkType() {
let req = {
code: 'C005'
};
getLinkType(req).then(function (res) {
if(res.code == "000000") {
let linkObject = JSON.parse(JSON.stringify(res.data)) //通过这个实现深拷贝
let keys = Object.keys(linkObject)
for(let i = 0; i < keys.length; i++) {
vm.linkSelect.push({
label: linkObject[keys[i]],
value: keys[i] - 0
})
}
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取模块下拉数据
getModuleData() {
getModuleData().then(function (res) {
if(res.code == "000000") {
vm.moduleArray = JSON.parse(JSON.stringify(res.data));
for(let j = 0;j < vm.moduleArray.nameList.length; j++) {
if(vm.formData.adModuleDto.name == vm.moduleArray.nameList[j].name){// 通过name找到对应的id
vm.getParamData(vm.moduleArray.nameList[j].id,vm.formData.adModuleDto.paramFlag,j,1)
}
}
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取参数下拉数据
getParamData(id,flag,index,a) {
if(flag != 1) return; // 判断是否有参数选择
let req = {
id: id
}
getParamData(req).then(function (res) {
if(res.code == "000000") {
vm.paramArray = res.data.paramList;
vm.paramConfig = res.data.config;
// for(let i=0;i<vm.tabContent.length;i++) {
// if(i == index) {
vm.formData.adModuleDto.paramFlag = 1
vm.formData.adModuleDto.paramList2 = vm.paramArray
if(a == 2) { // 判断是初始化还是改变module调的获取参数接口
vm.formData.adModuleDto.paramList = [];
for(let j = 0 ;j < vm.paramArray.length; j++) {
vm.formData.adModuleDto.paramList.push({
id: vm.paramConfig[j].id,
seqNo: vm.paramConfig[j].seqNo, // 选择参数的索引值
value: '',
key: vm.paramConfig[j].paramKey,
type: vm.paramConfig[j].type // 通过选择参数中获取
// status: 2
})
}
}else{
//for(let k = 0;k < vm.paramConfig.length; k++) {
// vm.formData.paramList[k].seqNo = vm.paramConfig[k].seqNo
// vm.formData.paramList[k].key = vm.paramConfig[k].paramKey
// vm.formData.paramList[k].type = vm.paramConfig[k].type
// vm.formData.paramList.push({
// seqNo: vm.paramConfig[k].seqNo,
// key: vm.paramConfig[k].paramKey,
// type: vm.paramConfig[k].type
// })
let arr = vm.formData.adModuleDto.paramList;
vm.formData.adModuleDto.paramList = [];
if(arr.length < vm.paramConfig.length) {
for(let k = 0;k < arr.length; k++) {
vm.formData.adModuleDto.paramList.push({
id: vm.paramConfig[k].id,
seqNo: vm.paramConfig[k].seqNo,
key: vm.paramConfig[k].paramKey,
type: vm.paramConfig[k].type,
value: arr[k].value
})
}
for(let j = arr.length;j < vm.paramConfig.length;j++) {
vm.formData.adModuleDto.paramList.push({
id: vm.paramConfig[j].id,
seqNo: vm.paramConfig[j].seqNo,
key: vm.paramConfig[j].paramKey,
type: vm.paramConfig[j].type,
value: ''
})
}
}else {
for(let k = 0;k < vm.paramConfig.length; k++) {
console.log("id: " + vm.paramConfig[k].id);
console.log("value: " + arr[k].value);
vm.formData.adModuleDto.paramList.push({
id: vm.paramConfig[k].id,
seqNo: vm.paramConfig[k].seqNo,
key: vm.paramConfig[k].paramKey,
type: vm.paramConfig[k].type,
value: arr[k].value
})
}
}
// }
}
// break
// }
// }
}
}).catch(function (error) {
vm.$message.error(error);
})
},
// change链接类型
selectLink(value) {
// if(value == 8) {
// for(let k = 0; k < vm.tabContent.length; k++) {
// if(vm.linkIndexValue == k) {
// vm.formData.adModuleDto.name = ""
// vm.formData.adModuleDto.paramFlag = 2
// }
// }
// }
},
linkIndex(index) {
vm.linkIndexValue = index
},
// change模块选择数据
moduleChange(value) {
for(let i = 0; i < vm.moduleArray.nameList.length; i++) {
if(value == vm.moduleArray.nameList[i].name) {
vm.getCodeAndType(vm.moduleArray.nameList[i].code,vm.moduleArray.nameList[i].type,vm.moduleArray.nameList[i].paramFlag)
vm.getParamData(vm.moduleArray.nameList[i].id,vm.moduleArray.nameList[i].paramFlag,vm.moduleIndexValue,2)
}
}
},
moduleIndex(index) {
vm.moduleIndexValue = index
},
getCodeAndType(code,type,paramFlag) {
// for(let i = 0; i < vm.tabContent.length; i++) {
// if(vm.moduleIndexValue == i) {
vm.formData.adModuleDto.code = code
vm.formData.adModuleDto.type = type
vm.formData.adModuleDto.paramFlag = paramFlag
// }
// }
}
}
}
</script>
<style lang="less">
.p-title {
padding-left: 10px;
margin-bottom: 15px;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
.bg-img {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
text-align: left;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.required-label .el-form-item__label::before {
content: "*";
color: #f56c6c;
margin-right: 4px;
}
.label-type {
width: 100%;
margin-top: 10px;
}
</style>
src/components/yqrange/gp-ranking.vue 0 → 100644
浏览文件 @ 2b9da3c7
<template>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
label-suffix="："
class="basic-form">
<el-form-item label="显示排行榜" class="required-label">
<el-radio-group v-model="formData.rankShowFlag" size="small" class="required-label">
<el-radio :label="0">关闭</el-radio>
<el-radio :label="1">开启</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="最多上榜人数" class="required-label" v-if="formData.rankShowFlag == 1">
<el-radio-group v-model="formData.maxQuantity" size="small" class="required-label">
<el-radio :label="0">50</el-radio>
<el-radio :label="1">100</el-radio>
<el-radio :label="1">200</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="榜单类型" class="required-label" v-if="formData.rankShowFlag == 1">
<el-checkbox-group v-model="formData.orgRankFlag">
<el-checkbox size="small" :label="1">本院排行</el-checkbox>
<el-checkbox size="small" :label="3">本市排行</el-checkbox>
<el-checkbox size="small" :label="5">本圈排行</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="显示规则" class="required-label" v-if="formData.rankShowFlag == 1">
<el-radio-group v-model="formData.ruleShowFlag" size="small" class="required-label">
<el-radio :label="0">关闭</el-radio>
<el-radio :label="1">开启</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="规则跳转模块" v-if="formData.rankShowFlag == 1 && formData.ruleShowFlag == 1" class="required-label">
<el-select @focus="moduleIndex(index)" filterable v-model="formData.rankModule.name" @change="moduleChange" placeholder="请选择模块" style="width:88%">
<el-option
v-for="item2 in moduleArray.nameList"
:key="item2.id"
:label="item2.name"
:value="item2.name">
</el-option>
</el-select>
</el-form-item>
<div v-for="(i,j) in formData.rankModule.paramList2" :key="j" class="required-label" v-if="formData.rankShowFlag == 1 && formData.ruleShowFlag == 1">
<el-form-item label="选择参数" v-if="formData.rankModule.paramFlag == 1">
<el-select v-model="formData.rankModule.paramList[j].value" filterable placeholder="请选择参数" style="width:88%">
<el-option
v-for="(item3,index3) in i"
:key="index3"
:label="item3.name"
:value="item3.id + '&'+ item3.name">
</el-option>
</el-select>
</el-form-item>
</div>
<el-form-item label="不参与排行的成员" v-if="formData.rankShowFlag == 1">
<div v-for="(item, index) in formData.mobilePhones" :key="index">
<el-row>
<el-col :span="10">
<el-form-item label="手机号" label-width="80px">
<el-input maxlength="11"
size="small"
v-model="item.phone"
placeholder="请输入手机号"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<img
@click="addGuest(index)"
class="edit-img"
src="../../assets/image/plus.png"
/>
<img
@click="delGuest(index)"
v-if="index >= 1"
class="edit-img"
src="../../assets/image/trash.png"
/>
</el-col>
</el-row>
</div>
</el-form-item>
<div style="margin-top: 60px;margin-left: 250px;">
<el-button type="primary" @click="save()" center>保存</el-button>
<el-button @click="cancle()">取 消</el-button>
</div>
</el-form>
</template>
<script>
let vm = null;
import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { getParamData, getModuleData, getRankConfig, saveRankConfig } from "../../utils/yqrange/yqrangeApi";
import Cropper from '@/components/common/cropper.vue'
export default {
name: "baseinfo",
components: {
Cropper
},
created() {
vm = this;
// const mobilePhone = localStorage.getItem("mobilePhone");
//
// if(mobilePhone == "13341740525" || mobilePhone == "18251938586"){
// this.deptFlag = true;
// }
// else {
// this.deptFlag = false;
// }
vm.getRank();
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
return {
showCropper: false,
moduleArray: [],
formData: {
circleId: this.$route.query.id,
rankShowFlag: 0,
maxQuantity: 50,
orgRankFlag: 0,
cityRankFlag: 0,
groupRankFlag: 0,
ruleShowFlag: 0,
mobilePhones: [],
rankModule: {
linkType: 8, // 跳转类型:1 链接，4 模块， 8 无跳转
name: "", // 模块名称
paramFlag: 0, // 是否有参数标志1为有2为没有参数
paramList: [
{
id: "",
seqNo: '', // 选择参数的索引值
value: '',
key: '', // 参数名称，默认param
type:'' // 模块参数类型:1 int类型字符串 4String类型 8时间戳类型字符串
}
],
paramList2: [],
type: 0 // 类型:1 列表页，4 详情页
}
},
linkSelect: [], // 连接类型数组
currentOption: {
offset_x: 120,
offset_y: 185,
width: 160,
height: 120,
cvWidth: 1000,
cvHeight: 800,
uploadType: 1,
cropDialogWidth: '900px',
cropBoxResizable: true,
minCropBoxWidth: 100,
minCropBoxHeight: 100,
aspectRatio: 16/9
},
slide2: {
oriUrl: '', // 原图
},
rules: {
name: [
{ required: true, message: "请输入圈子名称", trigger: "blur" },
{
min: 2,
max: 14,
message: "输入长度为2-14的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
introduce: [
{ required: true, message: "请输入圈子介绍", trigger: "blur" },
{
min: 2,
max: 40,
message: "输入长度为2-40的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
headUrl: [
{ required: true, message: "请选择圈子头像", trigger: "blur" }
],
dynamicFlag: [
{ required: true, message: "请选择内容发布权限", trigger: "blur" },
],
type: [
{ required: true, message: "请选择圈子类型", trigger: "blur" },
],
deptId: [
{ required: true, message: "请选择对接部门", trigger: "blur" }
]
},
imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语
contentList: [
{
value: 1,
label: '所有人可发布'
}, {
value: 2,
label: '管理员可发布'
},
],
deptList: [
{
value: 1,
label: '铁军部'
}, {
value: 2,
label: '医疗事业部'
},{
value: 3,
label: '商业化部'
},
],
deptFlag: false,
shareFlag: false
}
},
methods: {
getRank(){
let req = {
circleId: vm.formData.circleId
};
getRankConfig(req).then(function (res) {
if(res.code == "000000") {
vm.formData = res.data;
if(vm.formData.rankModule == null){
vm.formData.rankModule = {
linkType: 8, // 跳转类型:1 链接，4 模块， 8 无跳转
name: "", // 模块名称
paramFlag: 0, // 是否有参数标志1为有2为没有参数
paramList: [
{
id: "",
seqNo: '', // 选择参数的索引值
value: '',
key: '', // 参数名称，默认param
type:'' // 模块参数类型:1 int类型字符串 4String类型 8时间戳类型字符串
}
],
paramList2: [],
type: 0 // 类型:1 列表页，4 详情页
}
}
vm.getModuleData();
}
}).catch(function (error) {
vm.$message.error(error);
});
},
returnTypeData(name) {
this.$emit('returnTypeData', {
name: name,
val: this.formData[name]
})
},
//表单校验
submitForm() {
let req = vm.formData;
saveRankConfig(req).then(function (res) {
if(res.code == "000000") {
vm.$message.success("保存成功！");
// vm.formData = res.data;
}
}).catch(function (error) {
vm.$message.error(error);
});
},
save(){
this.submitForm();
},
cancle(){
const _this = this;
setTimeout(function () {
_this.$router.go(-1)
}, 100);
},
// 获取模块下拉数据
getModuleData() {
getModuleData().then(function (res) {
if(res.code == "000000") {
vm.moduleArray = JSON.parse(JSON.stringify(res.data));
for(let j = 0;j < vm.moduleArray.nameList.length; j++) {
if(vm.formData.rankModule.name == vm.moduleArray.nameList[j].name){// 通过name找到对应的id
vm.getParamData(vm.moduleArray.nameList[j].id,vm.formData.rankModule.paramFlag,j,1)
}
}
}
}).catch(function (error) {
vm.$message.error(error);
});
},
// 获取参数下拉数据
getParamData(id,flag,index,a) {
if(flag != 1) return; // 判断是否有参数选择
let req = {
id: id
}
getParamData(req).then(function (res) {
if(res.code == "000000") {
vm.paramArray = res.data.paramList;
vm.paramConfig = res.data.config;
// for(let i=0;i<vm.tabContent.length;i++) {
// if(i == index) {
vm.formData.rankModule.paramFlag = 1
vm.formData.rankModule.paramList2 = vm.paramArray
if(a == 2) { // 判断是初始化还是改变module调的获取参数接口
vm.formData.rankModule.paramList = [];
for(let j = 0 ;j < vm.paramArray.length; j++) {
vm.formData.rankModule.paramList.push({
id: vm.paramConfig[j].id,
seqNo: vm.paramConfig[j].seqNo, // 选择参数的索引值
value: '',
key: vm.paramConfig[j].paramKey,
type: vm.paramConfig[j].type // 通过选择参数中获取
// status: 2
})
}
}else{
//for(let k = 0;k < vm.paramConfig.length; k++) {
// vm.formData.paramList[k].seqNo = vm.paramConfig[k].seqNo
// vm.formData.paramList[k].key = vm.paramConfig[k].paramKey
// vm.formData.paramList[k].type = vm.paramConfig[k].type
// vm.formData.paramList.push({
// seqNo: vm.paramConfig[k].seqNo,
// key: vm.paramConfig[k].paramKey,
// type: vm.paramConfig[k].type
// })
let arr = vm.formData.rankModule.paramList;
vm.formData.rankModule.paramList = [];
if(arr.length < vm.paramConfig.length) {
for(let k = 0;k < arr.length; k++) {
vm.formData.rankModule.paramList.push({
id: vm.paramConfig[k].id,
seqNo: vm.paramConfig[k].seqNo,
key: vm.paramConfig[k].paramKey,
type: vm.paramConfig[k].type,
value: arr[k].value
})
}
for(let j = arr.length;j < vm.paramConfig.length;j++) {
vm.formData.rankModule.paramList.push({
id: vm.paramConfig[j].id,
seqNo: vm.paramConfig[j].seqNo,
key: vm.paramConfig[j].paramKey,
type: vm.paramConfig[j].type,
value: ''
})
}
}else {
for(let k = 0;k < vm.paramConfig.length; k++) {
console.log("id: " + vm.paramConfig[k].id);
console.log("value: " + arr[k].value);
vm.formData.rankModule.paramList.push({
id: vm.paramConfig[k].id,
seqNo: vm.paramConfig[k].seqNo,
key: vm.paramConfig[k].paramKey,
type: vm.paramConfig[k].type,
value: arr[k].value
})
}
}
// }
}
// break
// }
// }
}
}).catch(function (error) {
vm.$message.error(error);
})
},
// change链接类型
selectLink(value) {
// if(value == 8) {
// for(let k = 0; k < vm.tabContent.length; k++) {
// if(vm.linkIndexValue == k) {
// vm.formData.rankModule.name = ""
// vm.formData.rankModule.paramFlag = 2
// }
// }
// }
},
linkIndex(index) {
vm.linkIndexValue = index
},
// change模块选择数据
moduleChange(value) {
for(let i = 0; i < vm.moduleArray.nameList.length; i++) {
if(value == vm.moduleArray.nameList[i].name) {
vm.getCodeAndType(vm.moduleArray.nameList[i].code,vm.moduleArray.nameList[i].type,vm.moduleArray.nameList[i].paramFlag)
vm.getParamData(vm.moduleArray.nameList[i].id,vm.moduleArray.nameList[i].paramFlag,vm.moduleIndexValue,2)
}
}
},
moduleIndex(index) {
vm.moduleIndexValue = index
},
getCodeAndType(code,type,paramFlag) {
// for(let i = 0; i < vm.tabContent.length; i++) {
// if(vm.moduleIndexValue == i) {
vm.formData.rankModule.code = code
vm.formData.rankModule.type = type
vm.formData.rankModule.paramFlag = paramFlag
// }
// }
}
}
}
</script>
<style lang="less">
.p-title {
padding-left: 10px;
margin-bottom: 15px;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
.bg-img {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
text-align: left;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.required-label .el-form-item__label::before {
content: "*";
color: #f56c6c;
margin-right: 4px;
}
.label-type {
width: 100%;
margin-top: 10px;
}
</style>
src/utils/yqrange/yqrangeApi.js
浏览文件 @ 2b9da3c7
......@@ -171,4 +171,77 @@ export const getCircleDept = (params) => {
})
};
export const getCircleAds = (params) => {
return fetch({
headers,
url: getBaseUrl(`circle/circle/ad/${params.circleId}`),
method: 'get',
data: params,
description: '查询广告栏位信息',
})
};
export const saveCircleAds = (params) => {
return fetch({
headers,
url: getBaseUrl(`circle/circle/ad/save`),
method: 'post',
data: params,
description: 'B端保存广告栏位信息',
})
};
export const getLinkType = (params) => {
return fetch({
headers,
url: getBaseUrl(`contents/commonComstant/selectByTypeCode?code=${params.code}`),
method: 'get',
data: params,
description: '获取链接类型下拉数据',
})
};
export const getModuleData = (params) => {
return fetch({
headers,
url: getBaseUrl(`contents/moduleConfig/selectName`),
method: 'get',
data: params,
description: '获取模块下拉数据',
})
};
export const getParamData = (params) => {
return fetch({
headers,
url: getBaseUrl(`contents/moduleConfig/selectParam?id=${params.id}`),
method: 'get',
data: params,
description: '获取参数下拉数据',
})
};
export const getRankConfig = (params) => {
return fetch({
headers,
url: getBaseUrl(`circle/rank/config?circleId=${params.circleId}`),
method: 'get',
data: params,
description: '获取排行榜配置',
})
};
export const saveRankConfig = (params) => {
return fetch({
headers,
url: getBaseUrl(`circle/rank/save`),
method: 'post',
data: params,
description: '保存排行榜配置',
})
};
src/views/yqrange/range-manage.vue
浏览文件 @ 2b9da3c7
......@@ -21,6 +21,12 @@
<el-tab-pane label="应用配置" name="fourth">
<range-setting></range-setting>
</el-tab-pane>
<el-tab-pane label="广告位管理" name="five">
<ads-manage></ads-manage>
</el-tab-pane>
<el-tab-pane label="排行榜管理" name="six">
<gp-ranking></gp-ranking>
</el-tab-pane>
</el-tabs>
</div>
<div v-if="active == 4">
......@@ -39,8 +45,12 @@ import { getRangeList,updateRangeStatus, getCircleSettingList, saveCircleSetting
import LiveManage from "./live-manage";
import RangeSetting from "./range-setting";
import Mebman from "../../components/yqrange/mebman";
import AdsManage from "../../components/yqrange/ads-manage";
import GpRanking from "../../components/yqrange/gp-ranking";
export default {
components: {
GpRanking,
AdsManage,
Mebman,
RangeSetting,
LiveManage,
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或