提交 c2e65ce3 编写于 作者: 张平's avatar 张平

Merge branch 'dev-phrase2.5.1-0205' into 'release'

教培2.5.1新需求完成 code reviewer: 张平

教培2.5.1新需求完成 code reviewer: 张平

See merge request !139
......@@ -56,7 +56,7 @@ service.interceptors.request.use(config => {
// console.log('环境变量>>>> ', process.env.BUILD_ENV);
// config.headers['token'] = 'BFD804F3A3194FBBBE113962222839F6';
// config.headers['token'] = 'F8209898391C40A0B8DBC1ED9E157291';
config.headers['token'] = '2E46B77D801C479DBA1C550CE70D348F';
config.headers['token'] = '3167CD6495A14C14AEF28AB99F69984D';
}else{
config.headers['token'] = localStorage.getItem('storageToken')
}
......
......@@ -55,6 +55,7 @@ service.interceptors.request.use(config => {
if( process.env.BUILD_ENV == "development" ){ // 本地开发环境
// console.log('环境变量>>>> ', process.env.BUILD_ENV);
// config.headers['token'] = '29D71EAAB92E4580AFB16A8011BE7206';
// config.headers['token'] = '3167CD6495A14C14AEF28AB99F69984D';
config.headers['token'] = localStorage.getItem('storageToken')
}else{
config.headers['token'] = localStorage.getItem('storageToken')
......
<template>
<div class="edit-entry-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title">{{ title }}</div>
<div class="button-group">
<el-button v-show="showStorage" size="small" @click="complete(1)">暂存</el-button>
<el-button type="primary" size="small" @click="complete(2)">完成</el-button>
</div>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
class="basic-form"
>
<el-form-item label="入口名称:" prop="entryName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.entryName"
placeholder="请输入名称"
style="width:83%;"
:disabled="peopleLevel == 'L3'"
></el-input>
<span class="word-num">{{(formData.entryName).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
<el-form-item label="发起机构:" prop="organizationName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.organizationName"
placeholder="请输入发起机构名称"
style="width:83%;"
:disabled="peopleLevel == 'L3'"
@input="changeOrganizationName"
@blur="blurName"
@focus="focusName"
></el-input>
<span class="word-num">{{(formData.organizationName).replace(/\s+/g,"").length}}/12</span>
</el-col>
<el-popover
class="popover-content"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
@click="checkDefault"
>
<p @click="checkDefault">我的机构: {{ organizationContent }}</p>
</el-popover>
</el-form-item>
<el-form-item label="项目时间:" required>
<el-col :span="5">
<el-form-item prop="entryBegintime">
<el-date-picker
v-model="formData.entryBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions0"
style="width: 100%;"
:disabled="peopleLevel == 'L3'"
></el-date-picker>
</el-form-item>
</el-col>
<el-col class="line" :span="1">~</el-col>
<el-col :span="5">
<el-form-item label prop="entryEndtime">
<el-date-picker
v-model="formData.entryEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="23:59:59"
style="width: 100%;"
:disabled="peopleLevel == 'L3'"
></el-date-picker>
</el-form-item>
</el-col>
</el-form-item>
<el-form-item label="入口简介:" prop="entryIntro">
<el-col :span="13">
<el-input
size="small"
type="textarea"
:autosize="{ minRows: 5}"
placeholder="请输入入口简介"
v-model="formData.entryIntro"
style="width:83%;"
:disabled="peopleLevel == 'L3'"
></el-input>
<span class="word-num">{{(formData.entryIntro).replace(/\s+/g,"").length}}/200</span>
</el-col>
</el-form-item>
<div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="列表图片:">
<el-upload
v-model="formData.attachmentUrl1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadListPic"
:disabled="peopleLevel == 'L3'"
>
<img
v-if="formData.attachmentUrl1"
@mouseover.stop="imgMouseOver=true && peopleLevel != 'L3'"
:src="formData.attachmentUrl1"
class="bg-img"
/>
<img
v-if="!formData.attachmentUrl1"
class="bg-img"
src="../../assets/image/small.png"
/>
<div
class="img-delete"
v-show="imgMouseOver"
@click.stop="deleteImg(1)"
@mouseout.stop="imgMouseOver=false"
>
<i class="el-icon-delete"></i>
</div>
<div class="limit-text">
<p>尺寸:230*172</p>
<p>限制大小: 500Kb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage">请选择列表图片</p>
</div>
<el-form-item label="封面类型:">
<el-radio-group
size="small"
v-model="formData.type"
@change="changeCover"
:disabled="peopleLevel == 'L3'"
>
<el-radio :label="1">图片</el-radio>
<el-radio :label="2">视频</el-radio>
</el-radio-group>
</el-form-item>
<div class="basic-item-icon">
<span class="require">*</span>
<el-form-item label="封面文件:">
<el-upload
v-model="formData.attachmentUrl2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadCoverPic"
:disabled="peopleLevel == 'L3'"
>
<img
v-if="formData.type == 1 && formData.attachmentUrl2"
:src="formData.attachmentUrl2"
@mouseover.stop="imgMouseOver2=true && peopleLevel != 'L3'"
class="bg-img"
/>
<video
v-if="formData.type == 2 && formData.attachmentUrl2"
width="100"
controls
class="bg-video"
@mouseover.stop="imgMouseOver2=true && peopleLevel != 'L3'"
>
<source :src="formData.attachmentUrl2" type="video/mp4" />浏览器不支持mp4
</video>
<img
v-if="!formData.attachmentUrl2"
class="bg-img"
src="../../assets/image/small.png"
/>
<div
class="img-delete"
v-show="imgMouseOver2"
@click.stop="deleteImg(2)"
@mouseout.stop="imgMouseOver2=false"
>
<i class="el-icon-delete"></i>
</div>
<div v-show="formData.type == 1" class="limit-text">
<p>尺寸:750*420</p>
<p>限制大小: 2.0 Mb</p>
<p>支持.jpg,.png格式</p>
</div>
<div v-show="formData.type == 2" class="limit-text">
<p></p>
<p>限制大小: 500 Mb</p>
<p>支持.mp4</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage2">请选择封面</p>
</div>
<el-form-item label="关联项目:">
<el-col :span="10">
<!-- :disabled="projectStatus == 3 || projectStatus == 4 || projectStatus == 5 || projectStatus == 6" -->
<el-select
v-model="formData.project"
multiple
collapse-tags
style="width: 350px"
placeholder="关联项目"
@change="changeValue"
filterable
>
<el-option
v-for="item in optionsProject"
:key="item.value"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="已选择:" class="check-project">
<el-col :span="10" class="tags-list">
<el-tag
class="tags-project"
v-for="tag in tagsProject"
v-bind:class="{'tags-project-online': tag.disabled === true }"
:key="tag.value"
closable
:type="tag.type"
style="margin-left: 10px;"
@close="handleCloseProject(tag)"
>{{tag.name}}</el-tag>
</el-col>
</el-form-item>
</el-form>
<el-dialog title="确认上架" :visible.sync="dialogUp" width="30%" center>
<p class="dialog_p">该项目已关联<span> 0 </span>个子项目</p>
<p class="dialog_p">继续上架,将在APP端无法显示该项目</p>
<span slot="footer" class="dialog-footer">
<el-button @click="insertOrUpdate(2)">确认上架</el-button>
<el-button type="primary" @click="dialogUp = false">取消</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { mapGetters } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import * as operationData from "../../utils/operation";
import Sortable from "sortablejs";
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
callback(new Error("请勿输入字符“ \\ "));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . "));
} else {
callback();
}
};
return {
curmbFirst: "教培项目",
curmbSecond: "项目组件",
curmbThird: "新建入口",
title: "",
showStorage: false,
entryId: null,
peopleLevel: null,
uploadImgMessage: false,
uploadImgMessage2: false,
imgMouseOver: false,
imgMouseOver2: false,
organizationContent: "云鹊医",
statusValue: 0,
dialogUp: false,
formData: {
entryName: "",
entryBegintime: "",
entryEndtime: "",
entryIntro: "",
type: 1,
attachmentUrl1: "",
attachmentUrl2: "",
attachmentMore1: {},
attachmentMore2: {},
organizationName: "",
project: []
},
optionsProject: [],
tagsProject: [],
visibleName: false,
entryOptionData: {},
pickerOptions0: {
disabledDate: time => {
if (
this.formData.entryEndtime != "" &&
this.formData.entryEndtime != null
) {
return (
time.getTime() > new Date(this.formData.entryEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
time.getTime() < new Date(this.formData.entryBegintime).getTime()
); //减去一天的时间代表可以选择同一天;
}
},
rules: {
entryName: [
{ required: true, message: "请输入项目名称", trigger: "blur" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容,可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
organizationName: [
{ required: true, message: "请填写发起机构名称", trigger: "blur" },
{
min: 1,
max: 12,
message: "超过12个最大字数限制,请精简字数或使用简称",
trigger: "blur"
}
],
entryBegintime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
entryEndtime: [
{
required: true,
message: "请选择时间",
trigger: "change"
}
],
type: [
{
type: "array",
required: true,
message: "请至少选择一个活动性质",
trigger: "change"
}
],
entryIntro: [
{ required: true, message: "请填写项目简介", trigger: "blur" },
{ min: 1, max: 200, message: "超出可输入的最大长度", trigger: "blur" }
],
attachmentUrl1: [
{ required: true, message: "请选择列表图片", trigger: "blur" }
],
attachmentUrl2: [
{ required: true, message: "请选择封面", trigger: "blur" }
]
}
};
},
computed: {
...mapGetters(["_token"])
},
created() {
vm = this;
vm.entryId = vm.getUrlSearch(window.location.href, "entryId");
vm.peopleLevel = vm.getUrlSearch(window.location.href, "level");
vm.initTitle();
vm.initOption();
// vm.getEntryData();
},
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
initTitle() {
if (vm.entryId == null) {
vm.title = "新建入口";
vm.curmbThird = "新建入口";
vm.showStorage = true;
} else {
vm.title = "编辑入口";
vm.curmbThird = "编辑入口";
vm.showStorage = false;
}
},
setOption(data) {
let list = [];
for(let i = 0; i<data.length ; i++) {
let obj = {
value: data[i].projectId,
label: data[i].projectName,
}
list.push(obj);
}
return list;
},
initOption() {
vm.optionsProject = [];
let req = {};
openLoading(vm);
vm.GET("portal/entryInfo/getProjectList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.optionsProject = vm.setOption(res.data);
vm.getEntryData();
}
});
},
submitForm(formName) {
let flag = null;
this.$refs[formName].validate(valid => {
if (valid) {
flag = true;
} else {
console.log("error submit!!");
flag = false;
}
});
return flag;
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
// 删除图片
deleteImg(type) {
if (type == 1) {
vm.formData.attachmentUrl1 = "";
vm.imgMouseOver = false;
} else {
vm.formData.attachmentUrl2 = "";
vm.imgMouseOver2 = false;
}
},
changeCover(radio) {
this.formData.attachmentUrl2 = "";
},
beforeUploadListPic(file) {
let fileLimit = {
width: 230,
height: 172,
size: 0.5,
sizeText: "500K",
key: "attachmentUrl1",
more: "attachmentMore1",
show: "uploadImgMessage"
};
this.beforeAvatarUpload(file, fileLimit);
},
beforeUploadCoverPic(file) {
let fileLimit = {
width: 750,
height: 420,
size: 2,
sizeText: "2.0M",
key: "attachmentUrl2",
more: "attachmentMore2",
show: "uploadImgMessage2"
};
if (this.formData.type == 1) {
this.beforeAvatarUpload(file, fileLimit);
} else {
this.beforeUploadMp4(file);
}
},
beforeAvatarUpload(file, fileLimit) {
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
this.$message.error("图片不符合规范,请根据规范上传图片");
return;
}
if (!isLt2M) {
this.$message.error("图片不符合规范,请根据规范上传图片 ");
return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function(theFile) {
let image = new Image();
image.src = theFile.target.result;
image.onload = function() {
let _this = this;
if (
_this.width != fileLimit.width ||
_this.height != fileLimit.height
) {
vm.$message.error("图片不符合规范,请根据规范上传图片");
} else {
openLoading(vm);
doUpload(
vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
1
).then(function(path) {
closeLoading(vm);
console.log(path);
if (fileLimit.show == "uploadImgMessage") {
vm.uploadImgMessage = 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
};
console.log("!!!" + vm.formData[fileLimit.key]);
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
beforeUploadMp4(file) {
console.log(file);
const isMP4 = file.type === "video/mp4";
const isLt = file.size / 1024 / 1024 < 500;
if (!isLt) {
this.$message.error("视频不符合规范,请根据规范上传视频");
return;
}
if (!isMP4) {
this.$message.error("视频不符合规范,请根据规范上传视频");
} else {
openLoading(vm);
doUpload(
vm,
file,
getFilePath(file, null),
"preview4",
"progress1",
""
).then(function(path) {
closeLoading(vm);
console.log(path);
vm.uploadImgMessage2 = false;
vm.formData.attachmentUrl2 = path.fullPath;
vm.$message.success("上传成功");
});
}
},
checkDefault() {
vm.formData.organizationName = vm.organizationContent;
vm.visibleName = false;
},
blurName() {
vm.visibleName = false;
setTimeout(function() {
// console.log('失去焦点');
vm.submitForm("formData");
}, 200);
},
focusName() {
let textLength = vm.formData.organizationName.length;
if (textLength == 0) {
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// console.log("文字长度", textLength);
if (textLength == 0) {
vm.visibleName = true;
} else {
vm.visibleName = false;
}
},
tagDrop() {
this.$nextTick(function() {
if (vm.tagsProject.length > 0) {
const ele = document.querySelector(".check-project .el-col-10");
// console.log('ele',ele);
Sortable.create(ele, {
onEnd({ newIndex, oldIndex }) {
const currRow = vm.tagsProject.splice(oldIndex, 1)[0];
vm.tagsProject.splice(newIndex, 0, currRow);
}
});
}
});
},
changeValue(value) {
this.tagsProject = [];
let len = 0;
for (let i = 0; i < value.length; i++) {
for (let j = 0; j < this.optionsProject.length; j++) {
if (value[i] == this.optionsProject[j].value) {
this.tagsProject[len] = {};
this.tagsProject[len] = this.optionsProject[j];
this.tagsProject[len].value = this.optionsProject[j].value;
this.tagsProject[len].name = this.optionsProject[j].label;
len++;
}
}
}
vm.tagDrop();
},
initTags(value) {
vm.tagsProject = [];
let len = 0;
for (let i = 0; i < value.length; i++) {
for (let j = 0; j < vm.optionsProject.length; j++) {
if (value[i] == vm.optionsProject[j].value) {
vm.tagsProject[len] = {};
vm.tagsProject[len].value = vm.optionsProject[j].value;
vm.tagsProject[len].name = vm.optionsProject[j].label;
len++;
}
}
}
},
handleCloseProject(tag) {
if (tag.disabled == true) {
return;
}
vm.tagsProject.splice(vm.tagsProject.indexOf(tag), 1);
vm.formData.project = [];
for (let j = 0; j < vm.tagsProject.length; j++) {
vm.formData.project[j] = vm.tagsProject[j].value;
}
},
getEntryData() {
if (vm.entryId == null) {
return;
}
let req = {
entryId: vm.entryId
};
openLoading(vm);
vm.GET("portal/entryInfo/getEntry", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.setEditData(res.data);
vm.entryOptionData = res.data;
vm.statusValue = res.data.portalEntry.entryStatus;
// console.log("portalEntryUniInfo", vm.entryOptionData);
} else {
vm.$message(res.message);
}
});
},
setProject(data) {
let list = [];
for(let i = 0; i<data.length; i++) {
list.push(data[i]);
}
return list;
},
setEditData(data) {
if(data.portalEntry.entryStatus === 1) {
vm.showStorage = true;
}
vm.formData = {
entryName: data.portalEntry.entryName,
organizationName: data.portalEntry.organizationName,
entryBegintime: data.portalEntry.entryBegintime,
entryEndtime: data.portalEntry.entryEndtime,
entryIntro: data.portalEntry.entryIntro,
// type: 1,
// attachmentUrl1: "",
// attachmentUrl2: "",
type: data.attachments[1].attachmentType,
attachmentUrl1: data.attachments[0].attachmentUrl,
attachmentUrl2: data.attachments[1].attachmentUrl,
attachmentMore1: {
attachmentName: data.attachments[0].attachmentName,
},
attachmentMore2: {
attachmentName: data.attachments[1].attachmentName,
},
project: data.projectIds,
};
let projectEdit = data.projectIds;
vm.initTags(projectEdit);
},
complete(type) {
//1是暂存,2是完成
if (type == 2) {
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
} else {
vm.uploadImgMessage = false;
}
if (!vm.formData.attachmentUrl2) {
vm.uploadImgMessage2 = true;
} else {
vm.uploadImgMessage2 = false;
}
let completeState = vm.submitForm("formData");
if (
completeState === true &&
vm.formData.attachmentUrl1 != "" &&
vm.formData.attachmentUrl2 != ""
) {
if(vm.statusValue === 3 && vm.formData.project.length == 0) {
vm.dialogUp = true;
} else {
vm.insertOrUpdate(type);
}
}
//完成
} else {
//暂存
if(vm.formData.entryName == '') {
vm.$message('请输入入口名称!');
} else {
vm.insertOrUpdate(type);
}
}
},
insertOrUpdate(isCompleted) {
//option
let portalEntryUniInfo = {};
if (vm.entryId == null) {
portalEntryUniInfo = {
portalEntry: {
entryBegintime: vm.formData.entryBegintime,
entryEndtime: vm.formData.entryEndtime,
entryIntro: vm.formData.entryIntro,
entryName: vm.formData.entryName,
organizationName: vm.formData.organizationName
},
attachments: [
{
attachmentType: 1,
attachmentUrl: vm.formData.attachmentUrl1,
attachmentName: vm.formData.attachmentMore1.attachmentName,
// attachmentExt: vm.formData.attachmentMore1.attachmentExt,
// attachmentSize: vm.formData.attachmentMore1.attachmentSize,
kind: 1,
// seqNo: 1
},
{
attachmentType: vm.formData.type,
attachmentUrl: vm.formData.attachmentUrl2,
attachmentName: vm.formData.attachmentMore2.attachmentName,
// attachmentExt: vm.formData.attachmentMore2.attachmentExt,
// attachmentSize: vm.formData.attachmentMore2.attachmentSize,
kind: 2,
// seqNo: 1
}
],
projectIds: []
};
for(let i = 0;i < vm.tagsProject.length ; i++) {
// portalEntryUniInfo.subprojects[i] = {
// projectId: vm.tagsProject[i].value,
// projectName: vm.tagsProject[i].label,
// }
portalEntryUniInfo.projectIds[i] = vm.tagsProject[i].value;
}
} else {
portalEntryUniInfo = {
portalEntry: {
createdId: vm.entryOptionData.portalEntry.createdId,
createdName: vm.entryOptionData.portalEntry.createdName,
createdTime: vm.entryOptionData.portalEntry.createdTime,
deleteFlag: vm.entryOptionData.portalEntry.deleteFlag,
entryBegintime: vm.formData.entryBegintime,
entryEndtime: vm.formData.entryEndtime,
entryIntro: vm.formData.entryIntro,
entryName: vm.formData.entryName,
entryStatus: vm.entryOptionData.portalEntry.entryStatus,
id: vm.entryOptionData.portalEntry.id,
organizationId: 0,
organizationName: vm.formData.organizationName
},
attachments: [
{
attachmentType: 1,
attachmentUrl: vm.formData.attachmentUrl1,
attachmentName: vm.formData.attachmentMore1.attachmentName,
entryId: vm.entryOptionData.portalEntry.id,
id: vm.entryOptionData.portalEntry.id,
kind: 1,
// seqNo: 1
},
{
attachmentType: vm.formData.type,
attachmentUrl: vm.formData.attachmentUrl2,
attachmentName: vm.formData.attachmentMore2.attachmentName,
entryId: vm.entryOptionData.portalEntry.id,
id: vm.entryOptionData.portalEntry.id,
kind: 2,
// seqNo: 1
}
],
projectIds: []
};
for(let i = 0;i < vm.tagsProject.length ; i++) {
// portalEntryUniInfo.subprojects[i] = {
// projectId: vm.tagsProject[i].value,
// projectName: vm.tagsProject[i].label,
// }
portalEntryUniInfo.projectIds[i] = vm.tagsProject[i].value;
}
// console.log('tagsProject',vm.tagsProject);
}
// console.log("portalEntryUniInfo", portalEntryUniInfo);
openLoading(vm);
vm.POST(
"portal/entryInfo/updateInsertEntry?isCompleted=" + isCompleted,
portalEntryUniInfo
).then(res => {
closeLoading(vm);
if (res.code == "000000") {
if(vm.statusValue === 3) {
vm.$message({
message: '发布成功',
type: 'success'
});
}
vm.$router.push("entry-manager");
} else {
if(vm.statusValue === 3) {
vm.$message.error('发布失败');
vm.$message(res.message);
} else {
vm.$message(res.message);
}
}
});
}
}
};
</script>
<style lang="scss">
.edit-entry-wrap {
.component-content {
position: relative;
padding: 10px;
background: #fff;
.dialog_p {
text-align: center;
span{
font-weight: 700;
}
}
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.button-group {
position: absolute;
margin-top: 10px;
right: 5%;
z-index: 999;
}
.basic-form {
::-webkit-scrollbar
{
width: 4px;
height: 20px;
background-color: #D8D8D8;
}
::-webkit-scrollbar-thumb {
background-color: #D8D8D8;
}
position: relative;
margin-top: 10px;
.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 {
img {
float: left;
}
.bg-img {
width: 84px;
height: 100px;
}
.bg-video {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
}
}
}
.el-popover--plain {
padding: 18px 20px;
top: 40px;
}
.check-project {
top: 95%;
right: 5%;
position: absolute;
z-index: 999;
.tags-list {
border: 1px #e8e8e8 solid;
height: 350px;
min-width: 280px;
overflow-y: scroll;
.el-tag {
margin-top: 5px;
display: table;
background-color: #e6f1fc;
color: #389efe;
}
.tags-project-online {
color: #9aceff;
background-color: #f3f8fe;
border-color: #d5eafe;
}
}
}
}
}
}
</style>
\ No newline at end of file
......@@ -20,28 +20,32 @@
size="small"
v-model="formData.entryName"
placeholder="请输入名称"
style="width:83%;"
style="width:70%;"
:disabled="peopleLevel == 'L3'"
></el-input>
<span class="word-num">{{(formData.entryName).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
<el-form-item label="发起机构:" prop="organizationName">
<el-col :span="13">
<!-- <el-form-item label="发起机构:" prop="organizationName"> -->
<el-form-item label="发起机构:">
<el-col :span="13" v-for="(item, index) in formData.organizationNameList" :key="index">
<el-input
size="small"
v-model="formData.organizationName"
v-model="formData.organizationNameList[index]"
placeholder="请输入发起机构名称"
style="width:83%;"
style="width:70%;"
maxlength=16
:disabled="peopleLevel == 'L3'"
@input="changeOrganizationName"
@blur="blurName"
@focus="focusName"
@focus="focusName(index)"
></el-input>
<span class="word-num">{{(formData.organizationName).replace(/\s+/g,"").length}}/12</span>
<span class="word-num">{{(formData.organizationNameList[index]).replace(/\s+/g,"").length}}/16</span>
<img @click="plusOrg(index)" class="edit-img" src="../../assets/image/plus.png" />
<img @click="deleteOrg(index)" v-if="index >= 1" class="edit-img" src="../../assets/image/trash.png" />
</el-col>
<el-popover
class="popover-content"
class="popover-content" :style="{'top': orgListIndex * 41 + 'px'}"
placement="bottom"
:content="organizationContent"
v-model="visibleName"
......@@ -270,6 +274,7 @@ export default {
callback();
}
};
return {
curmbFirst: "教培项目",
curmbSecond: "项目组件",
......@@ -296,8 +301,10 @@ export default {
attachmentMore1: {},
attachmentMore2: {},
organizationName: "",
organizationNameList: [''],
project: []
},
orgListIndex: 0,
optionsProject: [],
tagsProject: [],
visibleName: false,
......@@ -336,7 +343,7 @@ export default {
{ required: true, message: "请填写发起机构名称", trigger: "blur" },
{
min: 1,
max: 12,
max: 16,
message: "超过12个最大字数限制,请精简字数或使用简称",
trigger: "blur"
}
......@@ -391,6 +398,12 @@ export default {
commonUtil.resizeHeight();
},
methods: {
plusOrg(index) {
vm.formData.organizationNameList.splice(index + 1, 0, '');
},
deleteOrg(index) {
vm.formData.organizationNameList.splice(index, 1);
},
initTitle() {
if (vm.entryId == null) {
vm.title = "新建入口";
......@@ -425,6 +438,26 @@ export default {
}
});
},
checkOrgNameList() {
let nameList = this.formData.organizationNameList;
for(let i = 0; i < nameList.length; i ++) {
if(!nameList[i]) {
this.$message.error('发起机构名称不可以为空');
return false;
}
}
for(let i = 0; i < nameList.length - 1; i ++) {
for(let j = i + 1; j < nameList.length; j ++) {
if(nameList[i] == nameList[j]) {
this.$message.error('发起机构名称不能重复');
return false;
}
}
}
return true;
},
submitForm(formName) {
let flag = null;
this.$refs[formName].validate(valid => {
......@@ -565,7 +598,10 @@ export default {
}
},
checkDefault() {
vm.formData.organizationName = vm.organizationContent;
// vm.formData.organizationNameList[0] = vm.organizationContent;
vm.formData.organizationNameList.splice(this.orgListIndex, 1, vm.organizationContent);
// vm.formData.organizationNameList.push(vm.organizationContent);
// vm.formData.organizationName = vm.organizationContent;
vm.visibleName = false;
},
blurName() {
......@@ -575,9 +611,10 @@ export default {
vm.submitForm("formData");
}, 200);
},
focusName() {
let textLength = vm.formData.organizationName.length;
focusName(index) {
let textLength = vm.formData.organizationNameList[index].length;
if (textLength == 0) {
this.orgListIndex = index;
vm.visibleName = true;
} else {
vm.visibleName = false;
......@@ -585,7 +622,6 @@ export default {
},
changeOrganizationName() {
let textLength = vm.formData.organizationName.length;
// console.log("文字长度", textLength);
if (textLength == 0) {
vm.visibleName = true;
} else {
......@@ -680,6 +716,7 @@ export default {
vm.formData = {
entryName: data.portalEntry.entryName,
organizationName: data.portalEntry.organizationName,
organizationNameList: data.portalEntry.organizationNameList,
entryBegintime: data.portalEntry.entryBegintime,
entryEndtime: data.portalEntry.entryEndtime,
entryIntro: data.portalEntry.entryIntro,
......@@ -703,6 +740,7 @@ export default {
complete(type) {
//1是暂存,2是完成
if (type == 2) {
if(!this.checkOrgNameList()) return;
if (!vm.formData.attachmentUrl1) {
vm.uploadImgMessage = true;
} else {
......@@ -745,7 +783,8 @@ export default {
entryEndtime: vm.formData.entryEndtime,
entryIntro: vm.formData.entryIntro,
entryName: vm.formData.entryName,
organizationName: vm.formData.organizationName
organizationName: vm.formData.organizationName,
organizationNameList: vm.formData.organizationNameList
},
attachments: [
{
......@@ -790,7 +829,8 @@ export default {
entryStatus: vm.entryOptionData.portalEntry.entryStatus,
id: vm.entryOptionData.portalEntry.id,
organizationId: 0,
organizationName: vm.formData.organizationName
organizationName: vm.formData.organizationName,
organizationNameList: vm.formData.organizationNameList
},
attachments: [
{
......@@ -980,4 +1020,9 @@ export default {
}
}
}
.popover-content {
position: relative;
top: 0;
left: 0;
}
</style>
\ No newline at end of file
因为 它太大了无法显示 源差异 。您可以改为 查看blob
因为 它太大了无法显示 源差异 。您可以改为 查看blob
<template>
<div class="item-component-wrap">
<bread-crumb
:curmbFirst="curmbFirst"
:curmbSecond="curmbSecond">
</bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="search-title">查询条件</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="serchForm" :model="searchParam" label-width="75px" style="width:100%;">
<el-col :span="6">
<el-form-item label="组件名称:">
<el-input v-model="searchParam.name" size="small" placeholder="请输入组件名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="发布状态:">
<el-select v-model="searchParam.status" size="small" style="width: 100%;" placeholder="请选择发布状态">
<el-option
v-for="(item,index) in statuSelect"
:key="index"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="search(1)">查询</el-button>
<el-button type="default" size="small" @click="reseat" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-row :gutter="10" class="row create-button" style="margin-right:0;">
<el-button type="primary" size="small" :disabled="idType == 2 && masterAdministratorFlag == 'false'" @click="createComponent">新建项目组件</el-button>
</el-row>
<el-table
:data="tableData"
style="width: 100%">
<el-table-column prop="id" label="ID编号" min-width="100" align="center"></el-table-column>
<el-table-column prop="name" label="组件名称" min-width="200" align="center"></el-table-column>
<el-table-column prop="createdName" label="发起人" min-width="100" align="center"></el-table-column>
<el-table-column prop="status" label="状态" min-width="80" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status | statusFileter }}</span>
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center" min-width="200">
<template slot-scope="scope">
<el-button type="primary" size="small" @click="editComponentList(scope.row)">编辑</el-button>
<el-button type="primary" v-if="scope.row.status == 2 || scope.row.status == 4" size="small" @click="enableAndDisable(scope.row,1)">启用</el-button>
<el-button type="primary" v-if="scope.row.status == 3" size="small" @click="enableAndDisable(scope.row,2)">禁用</el-button>
<el-button type="primary" v-if="scope.row.status == 1 || scope.row.status == 2" size="small" @click="deleteComponent(scope.row)">删除</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<!-- 分页 -->
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="searchParam.pageNo"
:page-sizes="[15, 30, 50, 100, 200, 500, 700, 1000, 1500, 2000]"
:page-size="searchParam.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows">
</el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from '../../components/breadcrumb.vue'
import { doUpload, getFilePath } from "../../utils/qiniu-util"
import { validateWord } from "../../utils/validate.js"
import { mapGetters,mapActions } from 'vuex'
import { openLoading, closeLoading } from '../../utils/utils'
import * as commonUtil from '../../utils/utils'
let vm = null
export default {
components: {
BreadCrumb
},
data() {
return {
curmbFirst: '教培项目',
curmbSecond: '项目组件',
idType:'',
masterAdministratorFlag: false,
searchParam: {
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
},
statuSelect: [
{
label: '草稿',
value: '1'
},{
label: '未启用',
value: '2'
},{
label: '已启用',
value: '3'
},{
label: '已禁用',
value: '4'
}
],
tableData: [],
totalRows: 0,
basicRule: {
"name": [
{ required: true, message: '输入长度为2-20个中文', trigger: 'blur' },
{ validator: function(rule, value, callback) {
validateWord(rule, value, callback, '输入长度为2-20个中文')
},
trigger: 'blur' }
],
"introduce": [
{ required: true, message: '请输入组件简介', trigger: 'blur' },
],
}
}
},
computed: {
...mapGetters([
'_token',
// 'idType',
// 'masterAdministratorFlag'
])
},
created() {
vm = this
vm.idType = localStorage.getItem('storageIdType')
vm.masterAdministratorFlag = localStorage.getItem('storageMaster')
if(this.$route.query.pageNum){
console.log(this.$store.state.common.itemComponents)
vm.searchParam.status = this.$store.state.common.itemComponents.status
vm.searchParam.name = this.$store.state.common.itemComponents.name
vm.searchParam.pageNo = parseInt(this.$route.query.pageNum)
}
vm.search()
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight()
},
methods: {
...mapActions([
'updateItemComponents'
]),
// 列表查询
search(flag) {
if(flag) vm.searchParam.pageNo = 1
vm.searchParam.idType = vm.idType
openLoading(vm)
vm.GET('portal/portalComponent/queryPortalComponent',vm.searchParam).then((res) => {
closeLoading(vm)
if( res.code == '000000' ) {
vm.tableData = res.data.queryList
vm.totalRows = res.data.total
}else {
vm.$message.info(res.message)
}
})
},
// 重置
reseat() {
vm.searchParam = Object.assign({},{
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
})
vm.search()
},
// 新建组件
createComponent() {
vm.$router.push({path: 'create-component'})
},
// 编辑(验证可编辑范围)
editComponentList(row) {
let req = {
token: vm._token,
componentId: row.id
}
vm.GET('portal/portalComponent/componentEditRange',req).then((res) => {
if(res.code == "000000") {
vm.updateItemComponents({name:vm.searchParam.name,status:vm.searchParam.status})
vm.$router.push({path: 'create-component',query: {id:row.id,status: row.status,resultFlag: res.data.resultFlag,pageNum:vm.searchParam.pageNo}})
}else {
vm.$message.info(res.message)
}
})
},
// 启用(禁用)
enableAndDisable(row,flag) {
let req = null
let text = ''
if(flag == 1) { // 启用
req = {
id: row.id,
status: 3
}
text = '组件一经启用,将无法进行修改,确定启用吗?'
}else if(flag == 2) { // 禁用
req = {
id: row.id,
status: 4
}
text = '确定禁用吗?'
}
vm.$confirm(text, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/disableOrStart',req).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '操作成功!'
});
vm.search()
if(res.message != 'success') {
vm.$message({
message: res.message,
type: 'warning'
})
}
}else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
});
});
},
// 删除
deleteComponent(row) {
vm.$confirm('确定要删除该组件吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/deleteComponentById',{id: row.id}).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '删除成功!'
});
vm.search()
} else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
})
})
},
handleSizeChange(value) {
vm.searchParam.pageSize = value
vm.search()
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value
vm.search()
}
}
}
</script>
<style lang="scss">
.item-component-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
img{
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
</style>
......@@ -74,249 +74,325 @@
</el-pagination>
</div>
</div>
<!-- 删除 弹窗 -->
<el-dialog
title="确认删除"
:show-close=false
:visible.sync="deleteVisible"
:close-on-click-modal="false"
width="600px"
center>
<p style="text-align: center;">删除后将不可撤销,确认删除吗?</p>
<span slot="footer" class="dialog-footer">
<el-button @click="confirmDelete">删 除</el-button>
<el-button type="primary" @click="hideDeleteFrom">取 消</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import BreadCrumb from '../../components/breadcrumb.vue'
import { doUpload, getFilePath } from "../../utils/qiniu-util"
import { validateWord } from "../../utils/validate.js"
import { mapGetters,mapActions } from 'vuex'
import { openLoading, closeLoading } from '../../utils/utils'
import * as commonUtil from '../../utils/utils'
let vm = null
import BreadCrumb from "../../components/breadcrumb.vue";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { validateWord } from "../../utils/validate.js";
import { mapGetters, mapActions } from "vuex";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
return {
curmbFirst: '教培项目',
curmbSecond: '项目组件',
idType:'',
masterAdministratorFlag: false,
searchParam: {
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
},
statuSelect: [
{
label: '草稿',
value: '1'
},{
label: '未启用',
value: '2'
},{
label: '已启用',
value: '3'
},{
label: '已禁用',
value: '4'
}
],
tableData: [],
totalRows: 0,
basicRule: {
"name": [
{ required: true, message: '输入长度为2-20个中文', trigger: 'blur' },
{ validator: function(rule, value, callback) {
validateWord(rule, value, callback, '输入长度为2-20个中文')
},
trigger: 'blur' }
],
"introduce": [
{ required: true, message: '请输入组件简介', trigger: 'blur' },
],
}
components: {
BreadCrumb
},
data() {
return {
curmbFirst: "教培项目",
curmbSecond: "项目组件",
idType: "",
masterAdministratorFlag: false,
searchParam: {
idType: "",
name: "",
status: "",
pageNo: 1,
pageSize: 15
},
statuSelect: [
{
label: "草稿",
value: "1"
},
{
label: "未启用",
value: "2"
},
{
label: "已启用",
value: "3"
},
{
label: "已禁用",
value: "4"
}
},
computed: {
...mapGetters([
'_token',
// 'idType',
// 'masterAdministratorFlag'
])
],
tableData: [],
totalRows: 0,
basicRule: {
name: [
{ required: true, message: "输入长度为2-20个中文", trigger: "blur" },
{
validator: function(rule, value, callback) {
validateWord(rule, value, callback, "输入长度为2-20个中文");
},
trigger: "blur"
}
],
introduce: [
{ required: true, message: "请输入组件简介", trigger: "blur" }
]
},
currentRow: {},
deleteVisible: false
};
},
computed: {
...mapGetters([
"_token"
// 'idType',
// 'masterAdministratorFlag'
])
},
created() {
vm = this;
vm.idType = localStorage.getItem("storageIdType");
vm.masterAdministratorFlag = localStorage.getItem("storageMaster");
if (this.$route.query.pageNum) {
console.log(this.$store.state.common.itemComponents);
vm.searchParam.status = this.$store.state.common.itemComponents.status;
vm.searchParam.name = this.$store.state.common.itemComponents.name;
vm.searchParam.pageNo = parseInt(this.$route.query.pageNum);
}
vm.search();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
...mapActions(["updateItemComponents"]),
// 列表查询
search(flag) {
if (flag) vm.searchParam.pageNo = 1;
vm.searchParam.idType = vm.idType;
openLoading(vm);
vm
.GET("portal/portalComponent/queryPortalComponent", vm.searchParam)
.then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.queryList;
vm.totalRows = res.data.total;
} else {
vm.$message.info(res.message);
}
});
},
created() {
vm = this
vm.idType = localStorage.getItem('storageIdType')
vm.masterAdministratorFlag = localStorage.getItem('storageMaster')
if(this.$route.query.pageNum){
console.log(this.$store.state.common.itemComponents)
vm.searchParam.status = this.$store.state.common.itemComponents.status
vm.searchParam.name = this.$store.state.common.itemComponents.name
vm.searchParam.pageNo = parseInt(this.$route.query.pageNum)
// 重置
reseat() {
vm.searchParam = Object.assign(
{},
{
idType: "",
name: "",
status: "",
pageNo: 1,
pageSize: 15
}
vm.search()
);
vm.search();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight()
// 新建组件
createComponent() {
vm.$router.push({ path: "create-component" });
},
methods: {
...mapActions([
'updateItemComponents'
]),
// 列表查询
search(flag) {
if(flag) vm.searchParam.pageNo = 1
vm.searchParam.idType = vm.idType
openLoading(vm)
vm.GET('portal/portalComponent/queryPortalComponent',vm.searchParam).then((res) => {
closeLoading(vm)
if( res.code == '000000' ) {
vm.tableData = res.data.queryList
vm.totalRows = res.data.total
}else {
vm.$message.info(res.message)
}
})
},
// 重置
reseat() {
vm.searchParam = Object.assign({},{
idType: '',
name: '',
status: '',
pageNo: 1,
pageSize: 15
})
vm.search()
},
// 新建组件
createComponent() {
vm.$router.push({path: 'create-component'})
},
// 编辑(验证可编辑范围)
editComponentList(row) {
let req = {
token: vm._token,
componentId: row.id
// 编辑(验证可编辑范围)
editComponentList(row) {
let req = {
token: vm._token,
componentId: row.id
};
vm.GET("portal/portalComponent/componentEditRange", req).then(res => {
if (res.code == "000000") {
vm.updateItemComponents({
name: vm.searchParam.name,
status: vm.searchParam.status
});
vm.$router.push({
path: "create-component",
query: {
id: row.id,
status: row.status,
resultFlag: res.data.resultFlag,
pageNum: vm.searchParam.pageNo
}
vm.GET('portal/portalComponent/componentEditRange',req).then((res) => {
if(res.code == "000000") {
vm.updateItemComponents({name:vm.searchParam.name,status:vm.searchParam.status})
vm.$router.push({path: 'create-component',query: {id:row.id,status: row.status,resultFlag: res.data.resultFlag,pageNum:vm.searchParam.pageNo}})
}else {
vm.$message.info(res.message)
}
})
},
// 启用(禁用)
enableAndDisable(row,flag) {
let req = null
let text = ''
if(flag == 1) { // 启用
req = {
id: row.id,
status: 3
}
text = '组件一经启用,将无法进行修改,确定启用吗?'
}else if(flag == 2) { // 禁用
req = {
id: row.id,
status: 4
});
} else {
vm.$message.info(res.message);
}
});
},
// 启用(禁用)
enableAndDisable(row, flag) {
let req = null;
let text = "";
if (flag == 1) {
// 启用
req = {
id: row.id,
status: 3
};
text = "组件一经启用,将无法进行修改,确定启用吗?";
} else if (flag == 2) {
// 禁用
req = {
id: row.id,
status: 4
};
text = "确定禁用吗?";
}
vm
.$confirm(text, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
vm
.GET("portal/portalComponent/disableOrStart", req)
.then(res => {
if (res.code == "000000") {
vm.$message({
type: "success",
message: "操作成功!"
});
vm.search();
if (res.message != "success") {
vm.$message({
message: res.message,
type: "warning"
});
}
text = '确定禁用吗?'
}
vm.$confirm(text, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/disableOrStart',req).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '操作成功!'
});
vm.search()
if(res.message != 'success') {
vm.$message({
message: res.message,
type: 'warning'
})
}
}else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
});
} else {
vm.$message.info(res.message);
}
})
.catch(function(error) {
vm.$message.error(error);
});
},
// 删除
deleteComponent(row) {
vm.$confirm('确定要删除该组件吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vm.GET('portal/portalComponent/deleteComponentById',{id: row.id}).then((res) => {
if(res.code == "000000") {
vm.$message({
type: 'success',
message: '删除成功!'
});
vm.search()
} else {
vm.$message.info(res.message)
}
}).catch(function (error) {
vm.$message.error(error);
});
}).catch(() => {
vm.$message({
type: 'info',
message: '已取消'
})
})
.catch(() => {
vm.$message({
type: "info",
message: "已取消"
});
});
},
// 删除
deleteComponentOld(row) {
vm
.$confirm("确定要删除该组件吗?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
vm
.GET("portal/portalComponent/deleteComponentById", { id: row.id })
.then(res => {
if (res.code == "000000") {
vm.$message({
type: "success",
message: "删除成功!"
});
vm.search();
} else {
vm.$message.info(res.message);
}
})
},
handleSizeChange(value) {
vm.searchParam.pageSize = value
vm.search()
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value
vm.search()
}
.catch(function(error) {
vm.$message.error(error);
});
})
.catch(() => {
vm.$message({
type: "info",
message: "已取消"
});
});
},
// 删除组件
confirmDelete() {
let req = {};
vm.GET("portal/portalComponent/deleteComponentById", { id: this.currentRow.id })
.then(res => {
this.deleteVisible = false;
if (res.code == "000000") {
vm.$message({
type: "success",
message: "删除成功!"
});
vm.search();
} else {
vm.$message.info(res.message);
}
})
.catch(function(error) {
vm.$message.error(error);
});
},
// 删除
deleteComponent(row) {
this.currentRow = row;
this.deleteVisible = true;
},
hideDeleteFrom() {
this.deleteVisible = false;
},
handleSizeChange(value) {
vm.searchParam.pageSize = value;
vm.search();
},
handleCurrentChange(value) {
vm.searchParam.pageNo = value;
vm.search();
}
}
}
};
</script>
<style lang="scss">
.item-component-wrap {
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
img{
width: 100px;
}
p {
margin-top: -50px;
}
}
.component-content {
padding: 10px;
background: #fff;
// margin: 84px 20px 20px;
.search-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.create-button {
padding: 0 0 15px;
margin-top: 0 !important;
text-align: right;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
</style>
<template>
<div class="item-manager-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title">项目管理</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-col :span="5">
<el-form-item label="项目名称:">
<el-input v-model="formInline.projectName" size="small" placeholder="请输入项目名称"></el-input>
</el-form-item>
</el-col>
<!-- <el-col :span="8">
<el-form-item label="项目时间:">
<el-date-picker
v-model="formInline.duringTime"
size="small"
type="daterange"
start-placeholder="请选择开始时间"
end-placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
></el-date-picker>
</el-form-item>
</el-col>-->
<el-col :span="6">
<el-form-item label="项目时间:">
<el-date-picker
v-model="formInline.projectBegintime"
size="small"
type="datetime"
placeholder="请选择开始时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions0"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="~">
<el-date-picker
v-model="formInline.projectEndtime"
size="small"
type="datetime"
placeholder="请选择结束时间"
value-format="yyyy-MM-dd HH:mm:ss"
:picker-options="pickerOptions1"
default-time="23:59:59"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8" style="padding:0;text-align:right;padding-right:15px;">
<el-button type="primary" size="small" @click="searchList">查询</el-button>
<el-button type="default" size="small" @click="resetForm" style="margin-left:0;">重置</el-button>
</el-col>
</el-form>
</el-row>
<el-row>
<el-col :span="5">
<el-form ref="formInline" :model="formInline" label-width="75px" style="width:100%;">
<el-form-item label="发布状态:">
<el-select size="small" v-model="formInline.projectStatus" placeholder="请选择发布状态">
<el-option
v-for="item in optionStatus"
:key="item.value"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-form :model="formInline" class="demo-form-inline">
<el-form-item>
<el-button class="add-button" :disabled="idType == 2 && masterAdministratorFlag == 'false'" size="small" type="primary" @click="openProject()">新建项目</el-button>
</el-form-item>
</el-form>
<el-table :data="tableData" style="width: 100%">
<el-table-column prop="id" label="ID编号" min-width="100" align="center"></el-table-column>
<el-table-column prop="projectName" label="项目名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="createdName" label="创建人" align="center"></el-table-column>
<el-table-column prop="projectLeader" label="项目负责人" align="center"></el-table-column>
<el-table-column prop="projectTypeValue" label="项目类型" align="center"></el-table-column>
<el-table-column prop="createdTime" label="创建时间" width="100" align="center"></el-table-column>
<!-- <el-table-column
prop="projectIntro"
label="项目简介"
align="center"
min-width="100"
show-overflow-tooltip
></el-table-column> -->
<el-table-column prop="projectBegintime" label="项目开始时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectEndtime" label="项目结束时间" min-width="90" align="center"></el-table-column>
<el-table-column prop="projectStatus" label="状态" align="center">
<template slot-scope="scope">
<span>{{ [scope.row.projectStatus , idType] | statusProject }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" min-width="360" align="center">
<template slot-scope="scope">
<el-button
@click="changeStatus(scope.row,0)"
v-show="showButton(scope.row,0)"
type="primary"
size="small"
>编辑</el-button>
<el-button
@click="changeStatus(scope.row,1)"
v-show="showButton(scope.row,1)"
type="primary"
size="small"
>暂存</el-button>
<el-button
@click="changeStatus(scope.row,2)"
v-show="showButton(scope.row,2)"
type="primary"
size="small"
>完成</el-button>
<el-button
@click="changeStatus(scope.row,3)"
v-show="showButton(scope.row,3)"
type="primary"
size="small"
>发布</el-button>
<el-button
@click="changeStatus(scope.row,4)"
v-show="showButton(scope.row,4)"
type="primary"
size="small"
>通过</el-button>
<el-button
@click="changeStatus(scope.row,5)"
v-show="showButton(scope.row,5)"
type="primary"
size="small"
>下架</el-button>
<el-button
@click="changeStatus(scope.row,7)"
v-show="showButton(scope.row,7)"
type="primary"
size="small"
:disabled="scope.row.checkStatus==1"
>提醒审核</el-button>
<el-button
@click="changeStatus(scope.row,8)"
v-show="showButton(scope.row,8)"
type="primary"
size="small"
>取消审核</el-button>
<el-button
@click="changeStatus(scope.row,6)"
v-show="showButton(scope.row,6)"
type="primary"
size="small"
>拒绝</el-button>
<el-button
@click="delItem(scope.row,9)"
v-show="showButton(scope.row,9)"
type="primary"
size="small"
>删除</el-button>
<el-button
@click="hanldeCmeClick(scope.row)"
v-show="showCMEButton(scope.row)"
type="primary"
size="small"
>{{ handleCmeOperate(scope.row.projectStatus) }}</el-button>
<el-button
@click="toShield(scope.row)"
v-show="scope.row.blackModifiable == true"
type="primary"
size="small"
>屏蔽</el-button>
<el-button
@click="addOrModifyNotice(scope.row, 0)"
v-if="masterAdministratorFlag == 'true'"
type="primary"
size="small"
>公告</el-button>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png">
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formInline.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
<!-- 初审 弹窗 -->
<el-dialog
title="项目初审"
:visible.sync="firstCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》初审结果为?` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
<!-- 新建项目弹窗 -->
<el-dialog
title="请选择项目类型"
:visible.sync="centerDialogVisible"
width="600px"
:close-on-click-modal="false"
@close="handleTypeClose"
center>
<span style="margin: 0 20px;">项目类型:</span>
<el-radio-group v-model="newProjectType">
<el-radio :label="1">普通项目</el-radio>
<el-radio :label="2">CME项目</el-radio>
</el-radio-group>
<span slot="footer" class="dialog-footer">
<el-button @click="centerDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="handleCreateProject">确 定</el-button>
</span>
</el-dialog>
<!-- 复审 弹窗 -->
<el-dialog
title="项目复审"
:visible.sync="secondCheckVisible"
width="600px"
:close-on-click-modal="false"
center>
<span style="margin: 0 20px;">{{ `项目《${currentRow.projectName}》复审结果为?` }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="handleCheckLeft">通 过</el-button>
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { mapGetters,mapActions } from 'vuex'
import { returnData } from "../../utils/mock";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import { setTimeout } from 'timers';
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
return {
idValue: '',
curmbFirst: "教培项目",
curmbSecond: "项目管理",
centerDialogVisible: false, // 新建项目弹窗
firstCheckVisible: false, // 各种操作的确认弹窗
secondCheckVisible: false,
newProjectType: 1, // 1 普通项目 2 CME项目
searchParam: {
name: "",
status: "",
pageNo: 1,
pageSize: 10
},
cmeBtnText: '',
currentRow: {},
optionStatus: [
{
value: 1,
label: "草稿"
},
{
value: 2,
label: "未上架"
},
{
value: 3,
label: "审核中/待审核"
},
{
value: 4,
label: "已上架"
},
{
value: 5,
label: "已下架"
},
{
value: 6,
label: "已拒绝/未上架"
},
{
value: 7,
label: "待初审"
},
{
value: 8,
label: "初审未通过"
},
{
value: 9,
label: "待复审"
},
{
value: 10,
label: "复审未通过"
},
{
value: 11,
label: "复审通过"
},
// 加上去 。。。。。。。CME
],
tableData: [],
totalRows: 0,
loading: true,
timingTime: "",
currentPage: 1,
formInline: {
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10
},
pickerOptions0: {
disabledDate: time => {
if (this.formInline.projectEndtime != "" && this.formInline.projectEndtime !=null) {
return (
time.getTime() >
new Date(this.formInline.projectEndtime).getTime()
);
}
}
},
pickerOptions1: {
disabledDate: time => {
return (
time.getTime() <
new Date(this.formInline.projectBegintime).getTime()
); //减去一天的时间代表可以选择同一天;
}
},
idType: '',
masterAdministratorFlag: false
};
},
computed: {
...mapGetters([
"_token",
// "idType",
// "masterAdministratorFlag"
])
},
created() {
vm = this;
vm.idType = localStorage.getItem('storageIdType');
vm.masterAdministratorFlag = localStorage.getItem('storageMaster');
console.log('idType:',vm.idType);
if(this.$route.query.pageNum){
this.formInline = {...this.$store.state.common.itemManager}
this.formInline.pageNo = parseInt(this.$route.query.pageNum)
}
this.$nextTick(function() {;
this.getProjectList();
});
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
...mapActions([
'updateItemManager'
]),
openProject() {
if(vm.masterAdministratorFlag == 'true') {
this.centerDialogVisible = true;
} else {
this.toPage();
}
},
toPage() {
this.$router.push("edit-manager?projectType=1");
},
toCmePage() {
console.log('跳转至 cme 新建项目');
this.$router.push("edit-cme?projectType=2");
},
toShield(row) {
this.$router.push("item-shield?projectId="+row.id);
},
handleTypeClose() {
this.centerDialogVisible = false;
this.newProjectType = 1;
},
handleCreateProject() {
if (this.newProjectType == 1) { // 1 普通项目 2 CME项目
this.toPage();
} else if (this.newProjectType == 2) {
this.toCmePage();
}
},
hanldeCmeClick(row) {
this.currentRow = row;
let status = row.projectStatus;
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
this.firstCheckVisible = true;
} else if (status == 9 || status == 10) { // 按钮显示 复审
this.secondCheckVisible = true;
} else if (status == 11) { // 按钮显示 发布
this.changeStatus(row,3)
}
},
handleCheckLeft() { // 左边通过
this.goToCheckAuth(1);
},
handleCheckRight() {
this.goToCheckAuth(2);
},
goToCheckAuth(refuse) {
let row = this.currentRow;
let req = {};
openLoading(vm);
// refuse = 1 : 同意 refuse = 2:拒绝
vm.GET(`portal/cme/verifyProject?projectId=${row.id}&refuse=${refuse}`, req).then(res => {
closeLoading(vm);
// debugger;
vm.firstCheckVisible = false;
vm.secondCheckVisible = false;
if (res.code == "000000") {
vm.getProjectList();
this.$message({
message: '审核成功',
type: 'success'
});
} else {
this.$message.error(res.message);
}
});
},
searchList() {
this.formInline.pageNo = 1;
this.getProjectList();
},
//查询项目列表
getProjectList() {
let req = {};
req = this.formInline;
openLoading(vm);
vm.GET("portal/portalInfo/getProjectList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.data;
//console.log(vm.tableData);
vm.totalRows = res.data.totalRows;
}
});
},
showCMEButton(row, type) {
// if(row.projectType == 2) {
// return true;
// } else {
// return false;
// }
// CME 专属状态码 为7~11,是这些代码的直接走新逻辑,别的走老逻辑
let cmeStatus = [7, 8, 9, 10, 11];
let currentStatus = parseInt(row.projectStatus);
if ( cmeStatus.indexOf(currentStatus) > -1 ) {
return true;
} else {
return false;
}
},
//按钮展示情况
showButton(row, type) {
// debugger;
// 按钮type类型: 0-编辑
// 1-暂存 2-完成 3-上架 4-通过 5-下架 6-拒绝
// 7- 提醒审核 8(2)-取消审核 9-删除
let projectStatus = row.projectStatus;
let idType = row.idType;
let level = row.level;
let flag = false;
let typeStr = parseInt(type);
//console.log("状态:"+projectStatus+ "等级:" + level + " 按钮类型:" + type);
//console.log('idType',idType);
let buttonStatus = "";
if (idType == 1) {
//内部项目
buttonStatus = returnData().buttonStatusIn;
} else {
//外部项目
buttonStatus = returnData().buttonStatusOut;
}
if(projectStatus == null) {
return false;
}
if (level != null) {
let tempStatus = JSON.parse(JSON.stringify(projectStatus));
if (tempStatus > 6) {
tempStatus = 1;
}
let statusSet = buttonStatus[tempStatus - 1][level];
let flagValue = statusSet.indexOf(typeStr);
if (flagValue >= 0) {
flag = true;
} else {
flag = false;
}
}
//flag = true;
return flag;
},
handleCmeOperate(status) {
let text = '';
// 7.待初审 8.初审未通过 9.待复审 10.复审未通过 11.复审通过
if (status == 7 || status == 8) { // 按钮显示 初审
text = '初审';
} else if (status == 9 || status == 10) { // 按钮显示 复审
text = '复审';
} else if (status == 11) { // 按钮显示 发布
text = '发布';
}
this.cmeBtnText = text;
return text;
// return true / false;
},
//改变状态
changeStatus(row, type) {
let projectId = row.id;
let level = row.level;
if (type === 0) {
this.updateItemManager(this.formInline)
//编辑
if(row.projectType === 1) {
this.$router.push("edit-manager?projectType=1&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
} else if(row.projectType === 2) {
this.$router.push("edit-cme?projectType=2&projectId=" + projectId +"&level="+level+'&pageNum='+this.formInline.pageNo);
}
} else if (type === 7) {
//提醒审核
let req = {
portalProjectId: projectId,
warnType: 1
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
vm.getProjectList();
if (res.code == "000000") {
console.log(res);
//vm.getProjectList();
}
});
} else {
// if (type === 8) {
// //取消审批值对应2
// type = 2;
// let req = {
// portalProjectId: projectId,
// warnType: 5
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
// if (type == 4 || type == 6) {
// //发送消息
// let warnType = "";
// if (type == 4) {
// warnType = 3;
// } else if (type == 6) {
// warnType = 4;
// }
// let req = {
// portalProjectId: projectId,
// warnType: warnType
// };
// vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
// vm.$message.info(res.message);
// if (res.code == "000000") {
// console.log(res);
// vm.getProjectList();
// }
// });
// }
let req = {
projectId: projectId,
changeStatus: vm.getType(type)
};
vm.POST("portal/portalInfo/changeStatus", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
vm.getProjectList();
//changeStatus之后remindPortalCheck
if (type == 4 || type == 6 || type == 8) {
//发送消息
let warnType = "";
if (type == 4) {
warnType = 3;
} else if (type == 6) {
warnType = 4;
} else if (type == 8) {
warnType = 5;
}
let req = {
portalProjectId: projectId,
warnType: warnType
};
vm.GET("portal/portalCheck/remindPortalCheck", req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
vm.getProjectList();
}
});
}
}
});
}
},
getType(value) {
let data = value;
if(data == 8) {
data = 2;
}
return data;
},
//删除项目
delItem(row) {
let req = {};
console.log(row);
vm.DELETE("portal/portalInfo/delete/" + row.id, req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
vm.getProjectList();
}
});
},
//重置表单
resetForm() {
vm.formInline = Object.assign(
{},
{
projectName: "",
projectBegintime: "",
projectEndtime: "",
projectStatus: "",
pageNo: 1,
pageSize: 10,
duringTime: ""
}
);
vm.getProjectList();
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formInline.pageSize = val;
this.handleCurrentChange(this.searchParam.pageNo);
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formInline.pageNo = val;
this.getProjectList();
//需要判断是否检索
// if (!this.flag) {
// this.currentChangePage(this.tableDataEnd);
// } else {
// this.currentChangePage(this.filterTableDataEnd);
// }
}, //组件自带监控当前页码
currentChangePage(list) {
let from = (this.currentPage - 1) * this.pageSize;
let to = this.currentPage * this.pageSize;
this.tableDataEnd = [];
for (; from < to; from++) {
if (list[from]) {
this.tableDataEnd.push(list[from]);
}
}
},
addOrModifyNotice(row) {
this.$router.push("edit-notice?projectId=" + row.id);
}
}
};
</script>
<style lang="scss">
.item-manager-wrap {
.component-content {
background: #fff;
//margin-top: 88px;
padding: 10px;
.header-title {
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
// .table-option span {
// color: #409eff;
// }
.add-button {
float: right;
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
.el-tooltip__popper {
max-width:50%
}
</style>
......@@ -244,6 +244,20 @@
<el-button @click="handleCheckRight">不通过</el-button>
</span>
</el-dialog>
<!-- 删除 弹窗 -->
<el-dialog
title="确认删除"
:show-close=false
:visible.sync="deleteVisible"
:close-on-click-modal="false"
width="600px"
center>
<p style="text-align: center;">删除后将不可撤销,确认删除吗?</p>
<span slot="footer" class="dialog-footer">
<el-button @click="confirmDelete">删 除</el-button>
<el-button type="primary" @click="hideDeleteFrom">取 消</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
......@@ -357,7 +371,8 @@ export default {
}
},
idType: '',
masterAdministratorFlag: false
masterAdministratorFlag: false,
deleteVisible: false,
};
},
computed: {
......@@ -388,6 +403,10 @@ export default {
...mapActions([
'updateItemManager'
]),
hideDeleteFrom() {
this.deleteVisible = false;
},
openProject() {
if(vm.masterAdministratorFlag == 'true') {
this.centerDialogVisible = true;
......@@ -649,19 +668,25 @@ export default {
}
return data;
},
//删除项目
delItem(row) {
this.deleteVisible = true
this.currentRow = row;
},
hideDeleteFrom() {
this.deleteVisible = false;
},
// 删除项目
confirmDelete() {
let req = {};
console.log(row);
vm.DELETE("portal/portalInfo/delete/" + row.id, req).then(res => {
vm.DELETE("portal/portalInfo/delete/" + this.currentRow.id, req).then(res => {
vm.$message.info(res.message);
if (res.code == "000000") {
console.log(res);
this.deleteVisible = false;
vm.getProjectList();
}
});
},
//重置表单
// 重置表单
resetForm() {
vm.formInline = Object.assign(
{},
......
<template>
<div class="item-role-wrap">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird"></bread-crumb>
<div class="component-content screenSet" id="screenSet">
<div class="header-title">
查询条件
<el-upload
v-if="activeUser == 'L1' && authorityType == 1"
class="upload-excel"
action="#"
accept=".xlsx"
multiple
:limit="1"
:before-upload="beforeUpload"
>
<el-button size="small">导入角色权限</el-button>
<el-button class="down-button" slot="tip" size="small" @click="download('model')">下载导入模板</el-button>
</el-upload>
</div>
<el-row :gutter="30" class="row" type="flex" style="margin-top: 10px;">
<el-form :model="formInline" ref="formInline" label-width="75px" class="form-inline">
<el-col :span="6">
<el-form-item label="所属机构:">
<!-- <el-select size="small" v-model="formInline.organizationName" placeholder="请选择所属机构">
<el-option
v-for="(item, index) in organizationList"
:key="index"
:label="item"
:value="item"
></el-option
</el-select>-->
<el-input size="small" v-model="formInline.organizationName" placeholder="请输入机构名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="姓名:">
<el-input size="small" v-model="formInline.userName" placeholder="请输入人员名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="角色:">
<el-select size="small" v-model="formInline.projeceRole" placeholder="请选择角色">
<el-option
v-for="(item, index) in roleList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<!-- <el-col :span="5">
<el-form-item label="所属科室:">
<el-select size="small" v-model="formInline.departmentsName" placeholder="请选择所属科室">
<el-option
v-for="(item, index) in departmentsList"
:key="index"
:label="item"
:value="item"
></el-option>
</el-select>
</el-form-item>
</el-col>-->
<el-col :span="6" style="padding:0;text-align:right;padding-right:10px;">
<el-button type="primary" size="small" @click="searchList()">查询</el-button>
<el-button
type="default"
size="small"
@click="resetForm('formInline')"
style="margin-left:0;"
>重置</el-button>
</el-col>
</el-form>
</el-row>
<el-table :data="tableData" style="width: 100%">
<!-- <el-table-column prop="userId" label="用户ID" align="center"></el-table-column> -->
<el-table-column prop="userName" label="姓名" align="center"></el-table-column>
<el-table-column prop="countyName" label="所属区县" align="center"></el-table-column>
<el-table-column prop="organizationName" label="所属机构" align="center"></el-table-column>
<el-table-column prop="departmentsName" label="科室" align="center"></el-table-column>
<el-table-column prop="projeceRole" label="角色" align="center">
<template slot-scope="scope">
<span>{{ scope.row.projeceRole | projeceRoleType }}</span>
</template>
</el-table-column>
<el-table-column prop="area" label="负责区域" align="center">
<template slot-scope="scope">
<span v-if="scope.row.projeceRole == 'L2'">全部地区</span>
<span v-if="scope.row.projeceRole == 'L0'">-</span>
<span v-if="scope.row.projeceRole == 'L3' && scope.row.regions.length == 0">-</span>
<span
v-if="scope.row.projeceRole == 'L3' && scope.row.regions.length == 1"
>{{ scope.row.regions[0] }}</span>
<el-popover
v-if="scope.row.projeceRole == 'L3' && scope.row.regions.length > 1"
placement="bottom"
title
width="200"
trigger="hover"
class="more-text"
>
<p class="more-text">{{ scope.row.regions | areaList }}</p>
<p slot="reference">{{ scope.row | areaText }}</p>
</el-popover>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="350" align="left">
<template slot-scope="scope" >
<!-- v-if="scope.row.projeceRole != 'L2'" -->
<div v-if="authorityType == 2">
<el-button
class="button-text"
type="text"
size="small"
v-if="scope.row.projeceRole != 'L2'"
v-show="showButton2(scope.row)"
@click="proChange(scope.row,'L2')"
>升级项目负责人</el-button>
<el-button
class="button-text"
type="text"
size="small"
v-else
v-show="showButton2(scope.row)"
@click="proChange(scope.row,'')"
>取消项目负责人</el-button>
</div>
<div v-if="authorityType == 1">
<el-button
class="button-text"
type="text"
size="small"
v-show="showButton(scope.row,'L2')"
@click="openDialog(scope.row,'L2')"
>升级项目负责人</el-button>
<el-button
class="button-text"
type="text"
size="small"
v-show="showButton(scope.row,'L3')"
@click="openDialog(scope.row,'L3')"
>升级次级负责人</el-button>
<el-button
class="button-text"
type="text"
size="small"
v-show="showButton(scope.row,'L3_2')"
@click="openDialog(scope.row,'L3_2')"
>降为次级负责人</el-button>
<el-button
class="button-text"
type="text"
size="small"
v-show="showButton(scope.row,'L0')"
@click="openDialog(scope.row,'L0')"
>降为普通用户</el-button>
<el-button
class="button-text"
type="text"
size="small"
v-show="showAppend(scope.row.projeceRole)"
@click="addArea(scope.row)"
>追加区域权限</el-button>
</div>
</template>
</el-table-column>
<div slot="empty">
<div class="table-empty">
<img src="../../assets/image/no-content1.png" />
<p>没有查询到相关结果</p>
</div>
</div>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="formInline.pageNo"
:page-sizes="[10, 20, 30, 100]"
:page-size="formInline.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
<el-dialog title :visible.sync="changeDialog.show" width="30%" center>
<p v-html="changeDialog.txt">
</p>
<span slot="footer" class="dialog-footer">
<el-button type="default" size="small" @click="changeDialog.show = false">取消</el-button>
<el-button type="primary" size="small" @click="changeFunRole()">确定</el-button>
</span>
</el-dialog>
<el-dialog title :visible.sync="dialog.show" width="30%" center>
<!-- <p v-if="numL3 > 1" class="dialog-p">
确认将{{ dialog.role }}
<span class="user-name">"{{ dialog.name }}"</span>
{{ dialog.option }}吗?"
</p>
<p v-else >该用户为此机构仅有的次级负责人,确认需要降级吗?</p>-->
<p
v-if="numL3 <= 1 && scopeRow.projeceRole == 'L3'"
class="dialog-p"
>该用户为此机构仅有的次级负责人,确认需要降级吗?</p>
<p v-else>
确认将{{ dialog.role }}
<span class="user-name">"{{ dialog.name }}"</span>
{{ dialog.option }}吗?
</p>
<span slot="footer" class="dialog-footer">
<el-button type="default" size="small" @click="dialog.show = false">取消</el-button>
<el-button type="primary" size="small" @click="changeRole()">确定</el-button>
</span>
</el-dialog>
<el-dialog title :visible.sync="dialogFull" width="30%" center>
<p class="dialog-p">
添加数量已达上限,不可继续添加
<!-- <span class="user-name">5人</span> -->
</p>
<span slot="footer" class="dialog-footer">
<el-button type="default" size="small" @click="dialogFull = false">取消</el-button>
<el-button type="primary" size="small" @click="dialogFull = false">确定</el-button>
</span>
</el-dialog>
<el-dialog
title="导入成功"
:visible.sync="dialogSuccess"
width="30%"
class="dialog-success"
center
>
<p>
本次成功导入
<span class="upload-text">{{ updateNum }}条</span> 数据
</p>
<span slot="footer" class="dialog-footer">
<el-button type="primary" size="small" @click="dialogSuccess = false">关闭</el-button>
</span>
</el-dialog>
<el-dialog title="导入失败" :visible.sync="dialogFail" width="30%" class="dialog-fail" center>
<div class="fail-type" v-if="failType == 1">
<p>导入数据量已超限额,请修正后再次导入</p>
<p class="fail-notice">仅支持一次导入5000条数据</p>
</div>
<div class="fail-type" v-if="failType == 2">
<p>
<span class="fail-num">{{ failNum }}条</span> 数据不符合格式要求,请修正后再次导入
</p>
<p class="fail-notice">仅支持xlsx格式的文件</p>
<p class="fail-link" @click="download('fail')">下载错误数据></p>
</div>
<span slot="footer" class="dialog-footer">
<el-button class="fail-close" size="small" @click="dialogFail = false">取消</el-button>
<el-upload
class="upload-button"
action="#"
accept=".xlsx"
multiple
:limit="1"
:before-upload="beforeUpload"
>
<el-button
stype="position: absolute;top: -14px;"
type="primary"
size="small"
@click="updateAgain()"
>重新导入</el-button>
</el-upload>
</span>
</el-dialog>
<el-dialog title="追加区域权限" :visible.sync="dialogArea" width="70%" class="dialog-area" center>
<el-col class="area-choose" :span="15">
<el-tree
default-expand-all
:data="treeData"
show-checkbox
node-key="id"
ref="tree"
highlight-current
:props="defaultProps"
@check="onChecked"
>
<span class="custom-tree-node" slot-scope="{ node, data }">
<span>{{ node.label }}</span>
<span>
<el-button
type="text"
icon="el-icon-caret-bottom"
size="small"
@click="() => append(data,node)"
></el-button>
</span>
</span>
</el-tree>
</el-col>
<el-col class="area-choose" :span="8">
<p class="area-p">
<i class="el-icon-bottom"></i>
追加下列区域的学情报告查看权限 已选择({{ tagsRegion.length }})
</p>
<el-tag
v-for="tag in tagsRegion"
:key="tag.name"
closable
:type="tag.type"
@close="handleCloseTree(tag)"
>{{tag.name}}</el-tag>
</el-col>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogArea = false">取消</el-button>
<el-button type="primary" size="small" @click="updateAttachRegion()">确认</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "../../components/breadcrumb.vue";
import { create } from "domain";
import { openLoading, closeLoading } from "../../utils/utils";
import * as commonUtil from "../../utils/utils";
import { getExeclUrl } from "@/utils/index";
import { uploadExcel } from "@/utils/education/educationApi";
import * as operationData from "../../utils/operation";
let vm = null;
export default {
components: {
BreadCrumb
},
data() {
const item = {
userId: "298490",
userName: "李雪",
projeceRole: "L0",
organizationName: "浙江省人民医院",
departmentsName: "外科"
};
return {
curmbFirst: "系统管理",
curmbSecond: "角色管理",
curmbThird: "项目角色",
tableData: [],
loading: true,
timingTime: "",
totalRows: 0,
currentPage: 1,
formInline: {
portalProjectId: "",
pageNo: 1,
pageSize: 10,
departmentsName: "",
organizationName: "",
projeceRole: "",
userName: ""
},
departmentsList: [],
organizationList: [],
roleList: [
// {
// label: "内部管理员",
// value: "L1"
// },
{
label: "全部",
value: ""
},
{
label: "项目负责人",
value: "L2"
},
{
label: "次级负责人",
value: "L3"
},
{
label: "普通用户",
value: "L0"
}
],
numL2: 0,
numL3: 0,
dialog: {
show: false,
role: "项目负责人",
name: "李雷",
option: "升级为项目负责人",
full: false,
},
changeDialog:{
show: false,
txt:''
},
dialogFull: false,
scopeRow: {},
activeUser: "",
updateNum: 0,
dialogSuccess: false,
failType: 2,
failNum: 0,
failExcelUrl: "",
dialogFail: false,
defaultProps: {
children: "children",
label: "label",
isLeaf: "isLeaf"
},
treeData: [],
dialogArea: false,
tagsRegion: [],
doctorId: "",
allSelectedKeys: [],
attachRegionId: "",
creator: false,
hospitalMasterAdmin: false,
optionType:'',
optionItem:{},
authorityType:0,
};
},
created() {
vm = this;
this.queryRoleList();
},
// 挂载到Dom完成时
mounted: function() {
commonUtil.resizeHeight();
},
methods: {
//add 升、降项目负责人
proChange(item,str){
if (str == "L2" && this.numL2 >= 5) {
this.dialogFull = true;
return;
}
this.optionType = str;
this.optionItem = item;
let s = ''
s = str != '' ? '确认将项目负责人 <span class="user-name">'+item.userName+'</span> 升级为项目负责人吗?' : '确认取消 <span class="user-name">'+ item.userName+'</span> 项目负责人权限吗?'
this.changeDialog = {
show: true,
txt:s
}
},
changeFunRole() {
let req = {
portalProjectId: this.formInline.portalProjectId,
updateL: this.optionType == '' ? 'L3' : 'L2',
userId: this.optionItem.userId,
numL2: this.numL2,
nowL: this.optionItem.projeceRole
};
// vm.GET("portal/portalProjectOrRole/roleLevelUpdate", req).then(res => {
vm.GET("portal/v2/role/roleLevelUpdate", req).then(res => {
vm.dialog.show = false;
if (res.code == "000000") {
console.log(res);
vm.queryRoleList();
vm.$message({
message: "设置成功!",
type: "success"
});
this.changeDialog = {
show: false,
txt:''
}
} else {
this.$message.error(res.code);
}
});
},
updateAgain() {
vm.dialogFail = false;
},
download(type) {
let downloadUrl = "";
if (type == "model") {
downloadUrl = getExeclUrl(
"%E6%95%99%E5%9F%B9%E9%A1%B9%E7%9B%AE%E8%A7%92%E8%89%B2%E5%AF%BC%E5%85%A5%E6%A8%A1%E6%9D%BF.xlsx"
);
} else if (type == "fail") {
downloadUrl = vm.failExcelUrl;
}
console.log("下载", type, downloadUrl);
setTimeout(() => {
window.open(downloadUrl);
}, 500);
},
beforeUpload(file) {
vm.dialogFail = false;
console.log(file);
let arr = file.type.split("/");
let ext = "." + arr[1];
let name = file.name;
let reader = new FileReader();
reader.onload = function(e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
let fileArray = [
{
type: "",
base64: fileJson
}
];
let req = {
fileArray: fileArray
};
let projectId = vm.formInline.portalProjectId;
console.log("req", req);
let reqStr = JSON.stringify(req);
console.log("reqStr", reqStr);
openLoading(vm);
uploadExcel(reqStr, projectId).then(res => {
setTimeout(function() {
closeLoading(vm);
if (res.code == "000000") {
if (res.data.success == true) {
//导入成功
vm.dialogSuccess = true;
vm.updateNum = res.data.total;
vm.queryRoleList();
} else {
if (res.data.outCount == true) {
//导入数据超5000
vm.failType = 1;
vm.dialogFail = true;
vm.failNum = res.data.total;
vm.failExcelUrl = res.data.url;
} else {
//导入失败
// setTimeout(function() {
vm.failType = 2;
vm.dialogFail = true;
vm.failNum = res.data.total;
vm.failExcelUrl = res.data.url;
// }, 800);
}
}
} else {
//接口失败
vm.$message.error(res.message);
}
console.log(res);
}, 1000);
});
};
reader.readAsDataURL(file);
},
searchList() {
this.formInline.pageNo = 1;
this.queryRoleList();
},
//查询用户列表
queryRoleList() {
this.formInline.portalProjectId = vm.getUrlSearch(
window.location.href,
"portalProjectId"
);
if (this.formInline.portalProjectId == null) {
this.formInline.portalProjectId = "";
}
let req = {};
req = this.formInline;
openLoading(vm);
vm.GET("portal/v2/role/queryRoleList", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
vm.tableData = res.data.projectRoleInfoModels;
vm.authorityType = res.data.authorityType
vm.totalRows = res.data.total;
vm.activeUser = res.data.activeUser;
vm.creator = res.data.creator;
vm.hospitalMasterAdmin = res.data.hospitalMasterAdmin;
//this.roleList = setRoleList(res.data.roleList);
this.organizationList = res.data.organizationList;
this.departmentsList = res.data.departmentsList;
this.numL2 = res.data.numL2;
this.numL3 = res.data.numL3;
}
});
},
//改变等级
changeRole() {
let req = {
portalProjectId: this.formInline.portalProjectId,
updateL: this.scopeRow.updateL,
userId: this.scopeRow.userId,
numL2: this.numL2,
nowL: this.scopeRow.projeceRole
};
// vm.GET("portal/portalProjectOrRole/roleLevelUpdate", req).then(res => {
vm.GET("portal/v2/role/roleLevelUpdate", req).then(res => {
vm.dialog.show = false;
if (res.code == "000000") {
console.log(res);
vm.queryRoleList();
vm.$message({
message: "设置成功!",
type: "success"
});
} else {
this.$message.error(res.code);
}
});
},
handleSizeChange(val) {
console.log(`每页 ${val} 条`);
this.formInline.pageSize = val;
},
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
this.formInline.pageNo = val;
this.queryRoleList();
},
//重置表单
resetForm() {
vm.formInline = Object.assign(
{},
{
portalProjectId: "",
pageNo: 1,
pageSize: 10,
departmentsName: "",
organizationName: "",
projeceRole: "",
userName: ""
}
);
vm.queryRoleList();
},
//authorityType == 2 情况下按钮展示判断
showButton2(row) {
let flag = false;
if (vm.activeUser == "L1") {
//当前内部管理员
flag = true;
}
if(vm.activeUser == "L2" && vm.creator == true) {
//当前项目管理员且创建者
flag = true;
}
return flag;
},
//按钮展示情况
showButton(row, projeceRole) {
let flag = false;
if (vm.activeUser == "L1") {
//当前内部管理员
if (row.projeceRole == "L2") {
if (projeceRole == "L0" || projeceRole == "L3_2") {
flag = true;
}
} else if (row.projeceRole == "L3") {
if (projeceRole == "L2" || projeceRole == "L0") {
flag = true;
}
} else if (row.projeceRole == "L0") {
if (projeceRole == "L2" || projeceRole == "L3") {
flag = true;
}
}
} else if (vm.activeUser == "L2") {
//当前项目负责人
//新规则
if (vm.creator == true) {
//项目负责人是:项目创建者
if (row.projeceRole == "L3") {
if (projeceRole == "L2" || projeceRole == "L0") {
flag = true;
}
} else if (row.projeceRole == "L0") {
if (projeceRole == "L2" || projeceRole == "L3") {
flag = true;
}
} else if (row.projeceRole == "L2") {
//创建项目项目管理员可以修改其他项目管理员
if (projeceRole == "L0" || projeceRole == "L3_2") {
flag = true;
}
}
} else {
//不是项目创建者
if (row.projeceRole == "L3") {
if (projeceRole == "L0") {
flag = true;
}
} else if (row.projeceRole == "L0") {
if (projeceRole == "L3") {
flag = true;
}
}
}
} else if (vm.activeUser == "L3") {
//当前次级负责人
//新规则
if (vm.hospitalMasterAdmin == true) {
//次级负责人是:构主管理员
if (row.projeceRole == "L3") {
if (projeceRole == "L0") {
flag = true;
}
} else if (row.projeceRole == "L0") {
if (projeceRole == "L3") {
flag = true;
}
}
}
}
return flag;
},
showAppend(projeceRole) {
let flag = false;
if (vm.activeUser == "L1" || vm.activeUser == "L2") {
if (projeceRole == "L3") {
flag = true;
}
}
return flag;
},
//打开弹出框
openDialog(row, projeceRole) {
console.log(row);
if (projeceRole == "L2" && this.numL2 >= 5) {
this.dialogFull = true;
} else {
this.dialog.show = true;
}
this.dialog.name = row.userName;
this.scopeRow = row;
this.scopeRow.updateL = projeceRole;
if (projeceRole == "L3_2") {
this.scopeRow.updateL = "L3";
}
if (row.projeceRole == "L2") {
this.dialog.role = "项目负责人";
if (projeceRole == "L0") {
this.dialog.option = "降级为普通用户";
} else if (projeceRole == "L3_2") {
this.dialog.option = "降级为次级负责人";
}
} else if (row.projeceRole == "L3") {
this.dialog.role = "次级负责人";
if (projeceRole == "L2") {
this.dialog.option = "升级为项目负责人";
} else if (projeceRole == "L0") {
this.dialog.option = "降级为普通用户";
}
} else if (row.projeceRole == "L0") {
this.dialog.role = "普通用户";
if (projeceRole == "L2") {
this.dialog.option = "升级为项目负责人";
} else if (projeceRole == "L3") {
this.dialog.option = "升级为次级负责人";
}
}
},
addArea(row) {
vm.dialogArea = true;
vm.treeData = [];
vm.tagsRegion = [];
vm.getAdministrative(row);
},
getAdministrative(row) {
vm.doctorId = row.userId;
// let req = {
// projectId: vm.formInline.portalProjectId
// };
let req = {
projectId: vm.formInline.portalProjectId,
doctorId: row.userId
};
openLoading(vm);
// vm.GET("portal/portalProjectOrRole/getAttachRegion", req).then(res => {
vm.GET("portal/v2/role/getAttachRegion", req).then(res => {
closeLoading(vm);
if (res.code == "000000") {
let administrativeAll = res.data.administrativeAll;
let administrative = res.data.administrative;
this.treeData = [];
this.treeData[0] = administrativeAll;
this.setTreeData(administrative);
vm.attachRegionId = res.data.attachRegionId;
}
});
},
//初始化范围树
setTreeData(administrative) {
let treeIdList = [];
let checkList = [];
for (let i = 0; i < administrative.length; i++) {
treeIdList.push(administrative[i].id);
checkList[i] = {};
checkList[i].name = administrative[i].label;
checkList[i].key = administrative[i].id;
}
//console.log(treeIdList);
this.$refs.tree.setCheckedKeys(treeIdList);
this.tagsRegion = checkList;
},
initCheckList(allSelectedKeys) {
this.tagsRegion = [];
// console.log(allSelectedKeys);
// console.log(this.$refs.tree.getCheckedNodes());
let nodeData = this.$refs.tree.getCheckedNodes();
for (let i = 0; i < nodeData.length; i++) {
for (let j = 0; j < allSelectedKeys.length; j++) {
if (
allSelectedKeys[j].type == 1 &&
nodeData[i].id == allSelectedKeys[j].key
) {
let tagObj = {};
tagObj.name = nodeData[i].label;
tagObj.key = nodeData[i].id;
this.tagsRegion.push(tagObj);
}
}
}
},
onChecked() {
// let cData = [],
// oldData = (this.treeData.length && this.treeData.slice()) || [],
// checkedKeys = this.$refs.tree.getCheckedKeys(),
// halfCheckedKeys = this.$refs.tree.getHalfCheckedKeys(),
// savedCheckedKeys = this.handlerCheckedData(oldData, checkedKeys).map(
// key => {
// return { type: 1, key: key };
// }
// ),
// savedHalfCheckedKeys = halfCheckedKeys.map(key => {
// return { type: 2, key: key };
// }),
// allSelectedKeys = savedCheckedKeys.concat(savedHalfCheckedKeys);
// vm.allSelectedKeys = allSelectedKeys;
console.log(
"getHalfCheckedKeys():",
this.$refs.tree.getHalfCheckedKeys()
);
console.log(
"getSimpleCheckedNodes():",
operationData.getSimpleCheckedNodes(this.$refs.tree.store)
);
let checkedTree = operationData.getSimpleCheckedNodes(
this.$refs.tree.store
);
let halfCheckedTree = this.$refs.tree.getHalfCheckedKeys();
vm.allSelectedKeys = operationData.setSelectedKeys(
checkedTree,
halfCheckedTree
);
console.log("vm.allSelectedKeys", vm.allSelectedKeys);
vm.initCheckList(vm.allSelectedKeys);
},
getTreeCheck() {
// let cData = [],
// oldData = (this.treeData.length && this.treeData.slice()) || [],
// checkedKeys = this.$refs.tree.getCheckedKeys(),
// halfCheckedKeys = this.$refs.tree.getHalfCheckedKeys(),
// savedCheckedKeys = this.handlerCheckedData(oldData, checkedKeys).map(
// key => {
// return { type: 1, key: key };
// }
// ),
// savedHalfCheckedKeys = halfCheckedKeys.map(key => {
// return { type: 2, key: key };
// }),
// allSelectedKeys = savedCheckedKeys.concat(savedHalfCheckedKeys);
let checkedTree = operationData.getSimpleCheckedNodes(
this.$refs.tree.store
);
let halfCheckedTree = this.$refs.tree.getHalfCheckedKeys();
let allSelectedKeys = operationData.setSelectedKeys(
checkedTree,
halfCheckedTree
);
vm.allSelectedKeys = allSelectedKeys;
return allSelectedKeys;
},
// // 递归删除列表中所有子节点
// delSubKeysByNode(node, checkedKeys) {
// let idIndex;
// if (node.children && node.children.length) {
// if (node.children && node.children.length) {
// node.children.forEach(elm => {
// idIndex = checkedKeys.findIndex(id => {
// return id === elm.id;
// });
// if (idIndex > -1) {
// checkedKeys.splice(idIndex, 1);
// }
// if (elm.children && elm.children.length) {
// this.delSubKeysByNode(elm, checkedKeys);
// }
// });
// }
// }
// },
// // 去除子节点
// handlerCheckedData(oldData, checkedKeys) {
// oldData.forEach(element => {
// for (let i = 0; i < checkedKeys.length; i++) {
// // 如果此节点被选中,则删除所有子节点
// if (element.id === checkedKeys[i]) {
// this.delSubKeysByNode(element, checkedKeys);
// } else {
// if (element.children && element.children.length) {
// this.handlerCheckedData(element.children, checkedKeys);
// }
// }
// }
// });
// return checkedKeys;
// },
//添加子节点
append(data, node) {
console.log("data:", data);
console.log("node:", node);
if (data.children.length == 0) {
//let id = data.id + "add";
let statusValue = 0;
if (node.checked == true) {
statusValue = 1;
}
let req = {
id: data.id,
status: statusValue,
disabled: data.disabled
};
vm.GET("portal/scope/v1/administrative/children", req).then(res => {
if (res.code == "000000") {
let administrative = res.data.administrative;
//console.log(administrative);
data.children = administrative;
this.appendCheck(administrative, node.checked);
}
});
}
},
//子节点选中
appendCheck(administrative, checked) {
//console.log(checked,administrative)
let checkList = [];
checkList = this.$refs.tree.getCheckedKeys();
if (checked) {
for (let i = 0; i < administrative.length; i++) {
checkList.push(administrative[i].id);
// console.log(checkList);
}
}
this.$nextTick(function() {
this.$refs.tree.setCheckedKeys(checkList);
});
},
//通过key设置tree
setCheckedKeys(tagsRegion) {
console.log(tagsRegion);
let treeKeyList = [];
for (let index = 0; index < tagsRegion.length; index++) {
treeKeyList[index] = tagsRegion[index].key;
}
console.log(treeKeyList);
this.$refs.tree.setCheckedKeys(treeKeyList);
},
//删除label节点 同步树结构
handleCloseTree(tag) {
this.tagsRegion.splice(this.tagsRegion.indexOf(tag), 1);
this.setCheckedKeys(this.tagsRegion);
},
//设定的行政范围内容
getScope(type) {
let scope = "";
let noChangeTree = this.getTreeCheck();
console.log("this.allSelectedKeys", this.allSelectedKeys);
if (this.allSelectedKeys.length > 0) {
for (let i = 0; i < this.allSelectedKeys.length; i++) {
scope +=
this.allSelectedKeys[i].key + ":" + this.allSelectedKeys[i].type;
if (i < this.allSelectedKeys.length - 1) {
scope += "|";
}
}
} else {
// let noChangeTree = this.getTreeCheck();
console.log("noChangeTree值", noChangeTree);
if (noChangeTree.length > 0) {
for (let i = 0; i < noChangeTree.length; i++) {
scope += noChangeTree[i].key + ":" + noChangeTree[i].type;
if (i < noChangeTree.length - 1) {
scope += "|";
}
}
} else {
//选全国项目
if (this.tagsRegion.length > 0 && this.tagsRegion[0].key == "000") {
scope = "000:1";
console.log(this.tagsRegion, "scope", scope);
}
}
}
//console.log(scope);
return scope;
},
updateAttachRegion() {
let req = {
attachRegionId: vm.attachRegionId,
doctorId: vm.doctorId,
projectId: vm.formInline.portalProjectId,
scopeOfAdministrative: vm.getScope()
};
console.log("req", req);
vm.POST("portal/v2/role/insertOrUpdateAttachRegion", req).then(res => {
if (res.code == "000000") {
vm.$message({
message: "设置成功",
type: "success"
});
vm.dialogArea = false;
vm.queryRoleList();
} else {
vm.$message.error(res.message);
}
});
}
}
};
</script>
<style lang="scss">
.item-role-wrap {
.component-content {
padding: 10px;
background: #fff;
.form-inline {
margin-left: 30px;
}
.header-title {
position: relative;
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
.upload-excel {
position: absolute;
top: -2px;
right: 27px;
float: right;
}
.down-button {
margin-left: 10px;
}
}
.button-text {
color: #449284;
}
.user-name {
color: #449284;
}
.more-text {
max-height: 40px;
overflow-y: scroll;
}
.dialog-p {
text-align: center;
span {
color: #449284;
}
}
.dialog-success {
p {
text-align: center;
.upload-text {
color: #449284;
}
}
}
.dialog-fail {
.fail-close {
margin-left: -70px;
}
.upload-button {
position: absolute;
float: right;
width: 80px;
bottom: 20px;
right: 120px;
}
.fail-type {
p {
margin-top: 10px;
}
.fail-num {
color: #db3f52;
}
.fail-notice {
color: #e3e3e3;
font-size: 13px;
}
.fail-link {
text-align: center;
color: #449284;
cursor: pointer;
}
}
}
.dialog-area {
.el-tree-node__expand-icon {
display: none;
}
.el-dialog {
height: 700px;
.el-dialog__body {
overflow: hidden;
.area-choose {
padding: 10px 0 0 10px;
height: 515px;
overflow-y: scroll;
border: 1px solid #dddddd;
.el-icon-caret-bottom {
color: #449284;
}
.area-p {
color: #449284;
margin-bottom: 10px;
}
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #449284;
border-color: #449284;
}
.is-checked .el-checkbox__inner {
background-color: #449284;
border-color: #449284;
}
}
}
}
.el-tag {
margin: 0 10px 10px 0;
border: 1.3px solid #48a8fe;
color: #1e92fe;
background-color: #e7f6fe;
.el-icon-close {
width: 13px;
height: 13px;
line-height: 13px;
font-size: 12px;
background-color: #0486fe;
border-radius: 50%;
color: #d4edfe;
}
}
}
.table-empty {
img {
width: 100px;
}
p {
margin-top: -50px;
}
}
}
}
.el-popover {
::-webkit-scrollbar
{
width: 4px;
height: 10px;
background-color: #D8D8D8;
}
::-webkit-scrollbar-thumb {
background-color: #D8D8D8;
}
.more-text {
padding: 0 5px 0 5px;
max-height: 55px;
overflow-y: scroll;
}
}
</style>
......@@ -432,6 +432,7 @@ export default {
created() {
vm = this;
this.queryRoleList();
this.curmbThird = this.$route.query && this.$route.query.projectName || ''
},
// 挂载到Dom完成时
mounted: function() {
......
......@@ -176,7 +176,7 @@ export default {
vm.search();
},
toPage(row) {
this.$router.push("item-role?portalProjectId=" + row.id);
this.$router.push("item-role?portalProjectId=" + row.id + '&projectName=' + row.projectName);
},
handleSizeChange(val) {
this.formInline.pageSize = val;
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册