Skip to content

P
pica.cloud.web-education-admin
提交 104aa95f 编写于 作者: yi.li's avatar yi.li
浏览文件
操作

云鹊小圈相关内容新增及开发

上级 4e0f639b
隐藏空白字符变更
内嵌 并排
正在显示 包含 1075 行增加 和 2 行删除
src/router/router.js
浏览文件 @ 104aa95f
...@@ -48,6 +48,11 @@ const editCustom = r => require.ensure([], () => r(require('../views/education/e ...@@ -48,6 +48,11 @@ const editCustom = r => require.ensure([], () => r(require('../views/education/e
const noticeEditor = r => require.ensure([], () => r(require('../views/education/notice-editor.vue')), 'notice-editor') const noticeEditor = r => require.ensure([], () => r(require('../views/education/notice-editor.vue')), 'notice-editor')
const yqRange = r => require.ensure([], () => r(require('../views/yqrange/yq-range.vue')), 'yq-range')
const liveManage = r => require.ensure([], () => r(require('../views/yqrange/live-manage.vue')), 'live-manage')
const roleManage = r => require.ensure([], () => r(require('../views/yqrange/role-manage.vue')), 'role-manage')
const createRange = r => require.ensure([], () => r(require('../views/yqrange/create-range.vue')), 'create-range')
export default [{ export default [{
path: '/', path: '/',
component: App, component: App,
...@@ -192,6 +197,22 @@ export default [{ ...@@ -192,6 +197,22 @@ export default [{
path: '/notice-editor', path: '/notice-editor',
component: noticeEditor component: noticeEditor
}, },
{
path: '/yq-range',
component: yqRange
},
{
path: '/live-manage',
component: liveManage
},
{
path: '/role-manage',
component: roleManage
},
{
path: '/create-range',
component: createRange
},
// { // {
// path: '/followup', // path: '/followup',
// name: 'followUp', // name: 'followUp',
......
src/utils/env-config.js
浏览文件 @ 104aa95f
...@@ -10,7 +10,7 @@ export const envConfig = { ...@@ -10,7 +10,7 @@ export const envConfig = {
// baseUrl: 'https://uat-sc.yunqueyi.com/', // baseUrl: 'https://uat-sc.yunqueyi.com/',
// baseUrl: 'http://10.177.15.150:10401/', // baseUrl: 'http://10.177.15.150:10401/',
// baseUrl: 'http://10.177.15.150:11905/', // baseUrl: 'http://10.177.15.150:11905/',
baseUrl: 'https://uat-sc.yunqueyi.com/', baseUrl: 'https://dev-sc.yunqueyi.com/',
// baseUrl: 'https://test1-sc.yunqueyi.com/', // baseUrl: 'https://test1-sc.yunqueyi.com/',
// baseUrl: 'https://sc.yunqueyi.com/', // baseUrl: 'https://sc.yunqueyi.com/',
// baseUrl: 'https://uat-sc.yunqueyi.com/', // baseUrl: 'https://uat-sc.yunqueyi.com/',
......
src/utils/fetch.js
浏览文件 @ 104aa95f
...@@ -54,7 +54,7 @@ service.interceptors.request.use(config => { ...@@ -54,7 +54,7 @@ service.interceptors.request.use(config => {
} }
if( process.env.BUILD_ENV == "development" ){ // 本地开发环境 if( process.env.BUILD_ENV == "development" ){ // 本地开发环境
// console.log('环境变量>>>> ', process.env.BUILD_ENV); // console.log('环境变量>>>> ', process.env.BUILD_ENV);
config.headers['token'] = 'AA3888A4256A49099D14879928E3E919'; config.headers['token'] = '4559D8D1D615430991878A1264830A04';
// config.headers['token'] = localStorage.getItem('storageToken') // config.headers['token'] = localStorage.getItem('storageToken')
}else{ }else{
config.headers['token'] = localStorage.getItem('storageToken') config.headers['token'] = localStorage.getItem('storageToken')
......
src/utils/filter.js
浏览文件 @ 104aa95f
...@@ -446,5 +446,27 @@ const vueFilter = { ...@@ -446,5 +446,27 @@ const vueFilter = {
return value return value
} }
}, },
rangeStatus: (value) => {
if (value == 1) {
return '上线'
}else if (value == 2) {
return '下线'
}else if (value == 3) {
return '已解散'
}else {
return '-'
}
},
liveStatusFilter: (value) => {
if (value == 1) {
return '预告'
}else if (value == 2) {
return '直播中'
}else if (value == 3) {
return '已结束'
}else {
return '-'
}
},
} }
export default vueFilter export default vueFilter
\ No newline at end of file
src/views/layout/slidebar.vue
浏览文件 @ 104aa95f
...@@ -367,12 +367,18 @@ ...@@ -367,12 +367,18 @@
}, },
] ]
} }
const yqRange = {
title: '云鹊小圈',
icon: 'el-icon-setting',
index: 'yq-range'
};
vm.items[1].subs.push(itemComponent); vm.items[1].subs.push(itemComponent);
vm.items[1].subs.push(templateManager); vm.items[1].subs.push(templateManager);
vm.items[1].subs.push(followSider); vm.items[1].subs.push(followSider);
vm.items.push(eduRole); vm.items.push(eduRole);
vm.items.push(cme); vm.items.push(cme);
vm.items.push(yqRange);
}, },
goToMessageSendPage(checkAuth) { goToMessageSendPage(checkAuth) {
......
src/views/yqrange/create-range.vue 0 → 100644
浏览文件 @ 104aa95f
<template>
<div class="yqrange-index-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="yqrange-index-content screenSet" id="screenSet">
<el-row class="step-content">
<el-col :span="14">
<el-steps :active="active" simple class>
<span class="step-num" :class="{ 'on-step': stepData[0] }">1</span>
<el-step title="基础信息"></el-step>
<span class="step-num" :class="{ 'on-step': stepData[1] }">2</span>
<el-step title="选择范围">2</el-step>
</el-steps>
</el-col>
<el-col :span="5" :offset="5">
<el-button v-if="showStorage" size="small" @click="storage">暂存</el-button>
<el-button v-if="active<1" size="small" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="active>=1" size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<div class="first-step" v-if="active == 0">
<p class="p-title">基础信息</p>
<el-form ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
label-suffix="："
class="basic-form">
<el-form-item label="圈子名称" prop="projectName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.projectName"
placeholder="请输入圈子名称"
style="width:70%;"
></el-input>
<span class="word-num">{{(formData.projectName).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
<div class="basic-item-icon">
<el-form-item label="圈子头像" class="required-label">
<el-upload
v-model="formData.imgUrl1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic1"
>
<img
v-if="formData.imgUrl1"
:src="formData.imgUrl1"
@mouseover.stop="imgMouseOver1=true"
class="bg-img"
/>
<img
v-if="!formData.imgUrl1"
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>尺寸:48*48</p>
<p>限制大小: 500kb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage1">请选择圈子头像</p>
</div>
<div class="basic-item-icon">
<el-form-item label="圈子封面" class="required-label">
<el-upload
v-model="formData.imgUrl2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic2"
>
<img
v-if="formData.imgUrl2"
:src="formData.imgUrl2"
@mouseover.stop="imgMouseOver2=true"
class="bg-img"
/>
<img
v-if="!formData.imgUrl2"
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 class="limit-text">
<p>尺寸:750*420</p>
<p>限制大小: 2Mb</p>
<p>支持.jpg,.png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage2">请选择圈子头像</p>
</div>
<el-form-item label="圈子介绍" prop="introduce">
<el-col :span="13">
<el-input
size="small"
v-model="formData.introduce"
placeholder="请输入圈子介绍"
style="width:70%;"
></el-input>
<span class="word-num">{{(formData.introduce).replace(/\s+/g,"").length}}/24</span>
</el-col>
</el-form-item>
<el-form-item label="内容发布权限" prop="contentRole">
<el-select v-model="formData.contentRole" placeholder="请选择发布权限" size="small" clearable>
<el-option
v-for="item in contentList"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</el-form>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
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: '新建小圈',
active: 0,
//页面展示位置
stepData: [true, false, false],
showStorage: true,
formData: {
projectName: '',
imgUrl1: '',
imgUrl1More: {},
imgUrl2: '',
imgUrl2More: {},
introduce: '',
contentRole: '',
},
imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语
imgMouseOver2: false,
uploadImgMessage2: false,
contentList: [
{
value: '1',
label: '所有人可发布动态'
},{
value: '2',
label: '嘉宾可发布动态'
},
],
rules: {
projectName: [
{ required: true, message: "请输入圈子名称", trigger: "blur" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
introduce: [
{ required: true, message: "请输入圈子名称", trigger: "blur" },
{
min: 2,
max: 24,
message: "输入长度为2-24的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
contentRole: [
{ required: true, message: "请选择内容发布权限", trigger: "blur" },
]
}
}
},
methods: {
//上传圈子头像
beforeUploadPic1(file) {
let fileLimit = {
width: 48,
height: 48,
size: 0.5,
sizeText: "500K",
key: "imgUrl1",
more: "imgUrl1More",
show: "uploadImgMessage1"
};
this.beforeUpload(file, fileLimit);
},
beforeUploadPic2(file) {
let fileLimit = {
width: 750,
height: 420,
size: 2,
sizeText: "2Mb",
key: "imgUrl2",
more: "imgUrl2More",
show: "uploadImgMessage2"
};
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("图片格式不符合规范，请根据规范上传图片");
// 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;
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 == "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.imgUrl1 = "";
vm.imgMouseOver1 = false;
}
},
//暂存
storage() {},
//下一步
nextStep() {},
//完成
complete() {},
},
}
</script>
<style lang="scss">
.yqrange-index-wrapper{
.yqrange-index-content{
background: #fff;
padding: 10px;
.step-content{
overflow: hidden;
height: 60px;
padding: 15px 0 50px 0;
border-bottom: 1px solid #efefef;
.is-text {
display: none;
}
.el-steps--simple {
background: #fff;
padding: 10px 8%;
}
.step-num {
display: block;
margin-top: 1.5px;
font-size: 12px;
border: 1px solid #999 !important;
border-radius: 50%;
width: 25px;
height: 18px;
line-height: 15px;
text-align: center;
color: #999;
}
.el-step__title.is-wait {
color: #999;
}
.el-step__title.is-process {
color: #449284;
}
.is-finish {
color: #999 !important;
}
.on-step {
color: #449284;
border: 1px solid #449284 !important;
}
}
.first-step{
margin-top: 20px;
.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;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
}
}
}
.required-label .el-form-item__label::before{
content: '*';
color: #F56C6C;
margin-right: 4px;
}
</style>
src/views/yqrange/live-manage.vue 0 → 100644
浏览文件 @ 104aa95f
<template>
<div class="yqrange-index-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="yqrange-index-content screenSet" id="screenSet">
<div class="header-title">直播管理</div>
<el-form ref="searchForm" :model="searchForm" label-width="75px" label-suffix=":" :inline="true">
<el-row :gutter="30" type="flex" style="margin-top: 10px">
<el-col :span="10">
<el-form-item label="直播名称">
<el-input v-model="searchForm.liveName" size="small" placeholder="请输入直播名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="直播状态">
<el-select v-model="searchForm.liveStatus" placeholder="请选择发布状态" clearable style="margin-left:20px;">
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4" style="text-align: right">
<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-row>
<el-row>
<el-col :span="24" style="text-align: right">
<el-button type="primary" size="small" @click="createLive">新建直播</el-button>
</el-col>
</el-row>
</el-form>
<el-table :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;">
<el-table-column prop="liveName" label="直播名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="liveStatus" label="直播状态" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.liveStatus | liveStatusFilter }}</span>
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" min-width="100" align="center"></el-table-column>
<el-table-column prop="startTime" label="开始时间" min-width="100" align="center"></el-table-column>
<el-table-column prop="endTime" label="结束时间" min-width="100" align="center"></el-table-column>
<el-table-column label="操作" min-width="300" align="center">
<template slot-scope="scope">
<el-button @click="liveLink(scope.row)" type="text" size="small">直播链接</el-button>
<el-button @click="reviewLive(scope.row)" type="text" size="small">回放</el-button>
<el-button @click="shareLive(scope.row)" type="text" size="small">分享直播</el-button>
<el-button @click="editLive(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="deleteLive(scope.row)" type="text" size="small">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleNumChange"
:current-page="searchForm.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchForm.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊小圈',
curmbSecond: '直播管理',
searchForm: {
liveName: '',
liveStatus: '',
pageNo: 1,
pageSize: 10,
},
totalRows: 0,
statusList: [{
value: '1',
label: '预告'
}, {
value: '2',
label: '直播中'
}, {
value: '3',
label: '已结束'
}],
tableData: [
{
liveName: '浙江医学大会第二场',
liveStatus: 1,
createTime: '',
startTime: '',
endTime: '',
}
],
}
},
methods: {
searchList() {
console.log('查询')
},
resetForm() {
console.log('重置')
},
//新建直播
createLive() {},
//直播链接
liveLink(row) {},
//回放
reviewLive(row) {},
//分享直播
shareLive(row) {},
//编辑直播
editLive(row) {},
//删除直播
deleteLive(row) {},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
},
}
</script>
<style lang="scss">
.yqrange-index-wrapper{
.yqrange-index-content{
background: #fff;
padding: 10px;
.header-title{
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
}
.el-button--text{
color: #449284;
font-size: 14px;
&::after{
content: '';
position: relative;
height: 14px;
/*border-right: 1px solid #EBEEF5;*/
border-right: 1px solid #aaaaaa;
padding-right: 10px;
}
&:last-of-type{
&::after{
content: '';
position: relative;
width: 1px;
height: 14px;
border-right: none;
}
}
}
}
</style>
src/views/yqrange/role-manage.vue 0 → 100644
浏览文件 @ 104aa95f
<template>
<div class="yqrange-index-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="yqrange-index-content screenSet" id="screenSet">
<div class="header-title">成员管理</div>
<el-form ref="searchForm" :model="searchForm" label-width="75px" label-suffix=":" :inline="true">
<el-row :gutter="30" type="flex" style="margin-top: 10px">
<el-col :span="10">
<el-form-item label="科室">
<el-select v-model="searchForm.department" placeholder="请选择科室" clearable style="margin-left:20px;">
<el-option
v-for="item in departmentList"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="职称">
<el-select v-model="searchForm.proTitle" placeholder="请选择职称" clearable style="margin-left:20px;">
<el-option
v-for="item in proList"
:key="item.value"
:label="item.label"
:value="item.label">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4" style="text-align: right">
<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-row>
</el-form>
<el-table :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;">
<el-table-column prop="role" label="身份" min-width="100" align="center"></el-table-column>
<el-table-column prop="name" label="姓名" min-width="100" align="center"></el-table-column>
<el-table-column prop="proTitle" label="职称" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.liveStatus | liveStatusFilter }}</span>
</template>
</el-table-column>
<el-table-column prop="department" label="科室" min-width="100" align="center"></el-table-column>
<el-table-column prop="hospital" label="所属机构" min-width="100" align="center"></el-table-column>
<el-table-column label="操作" min-width="300" align="center">
<template slot-scope="scope">
<el-button v-if="scope.row.level == 2" @click="promote(scope.row)" type="text" size="small">升为主管理员</el-button>
<el-button v-if="scope.row.level == 3" @click="promote(scope.row)" type="text" size="small">升为管理员</el-button>
<el-button v-if="scope.row.level != 1" @click="addBlackList(scope.row)" type="text" size="small">加入黑名单</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleNumChange"
:current-page="searchForm.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchForm.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊小圈',
curmbSecond: '成员管理',
searchForm: {
department: '',
proTitle: '',
pageNo: 1,
pageSize: 10,
},
totalRows: 0,
departmentList: [{
value: '1',
label: '外科'
}, {
value: '2',
label: '内科'
}],
proList: [{
value: '1',
label: '主治医师'
}, {
value: '2',
label: '医生'
}],
tableData: [
{
role: '主管理员',
name: '炸弹',
proTitle: '',
department: '',
hospital: '',
level: 1,
}, {
role: '普通成员',
name: '炸弹3号',
proTitle: '医生',
department: '内科',
hospital: '浙江省中医院',
level: 3,
}
],
}
},
methods: {
searchList() {
console.log('查询')
},
resetForm() {
console.log('重置')
},
//管理员升级
promote(row) {
let currentName = '', willName;
if (row.level == 1) {
currentName = '主管理员';
} else if (row.level == 2) {
currentName = '管理员';
willName = '主管理员';
}else if (row.level == 3) {
currentName = '普通成员';
willName = '管理员';
}
this.$confirm(`确定将${currentName}“${row.name}”升为${willName}`, '', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
}).catch(() => {
// cancel
});
},
//加入黑名单
addBlackList(row) {
this.$confirm(`确定将“${row.name}”加入黑名单吗`, '', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
}).catch(() => {
// cancel
});
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
},
}
</script>
<style lang="scss">
.yqrange-index-wrapper{
.yqrange-index-content{
background: #fff;
padding: 10px;
.header-title{
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
}
.el-button--text{
color: #449284;
font-size: 14px;
&::after{
content: '';
position: relative;
height: 14px;
/*border-right: 1px solid #EBEEF5;*/
border-right: 1px solid #aaaaaa;
padding-right: 10px;
}
&:last-of-type{
&::after{
content: '';
position: relative;
width: 1px;
height: 14px;
border-right: none;
}
}
}
}
</style>
src/views/yqrange/yq-range.vue 0 → 100644
浏览文件 @ 104aa95f
<template>
<div class="yqrange-index-wrapper">
<bread-crumb :curmbFirst="curmbFirst"></bread-crumb>
<div class="yqrange-index-content screenSet" id="screenSet">
<div class="header-title">云鹊小圈</div>
<el-form ref="searchForm" :model="searchForm" label-width="75px" label-suffix=":" :inline="true">
<el-row :gutter="30" type="flex" style="margin-top: 10px">
<el-col :span="10">
<el-form-item label="圈子名称">
<el-input v-model="searchForm.name" size="small" placeholder="请输入圈子名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="10">
<el-form-item label="创建时间">
<el-date-picker
v-model="searchForm.createTime"
size="small"
type="datetime"
placeholder="请选择创建时间"
value-format="yyyy-MM-dd HH:mm:ss"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="4" style="text-align: right">
<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-row>
<el-row>
<el-col :span="24" style="text-align: right">
<el-button type="primary" size="small" @click="createRange">新建小圈</el-button>
</el-col>
</el-row>
</el-form>
<el-table :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;">
<el-table-column prop="id" label="圈子ID" min-width="100" align="center"></el-table-column>
<el-table-column prop="createTime" label="创建时间" min-width="100" align="center"></el-table-column>
<el-table-column prop="name" label="圈子名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="num" label="圈子人数" min-width="100" align="center"></el-table-column>
<el-table-column prop="publishRole" label="内容发布权限" min-width="100" align="center"></el-table-column>
<el-table-column prop="status" label="圈子状态" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status | rangeStatus }}</span>
</template>
</el-table-column>
<el-table-column label="操作" min-width="370" align="center">
<template slot-scope="scope">
<el-button @click="publishRange(scope.row)" v-if="scope.row.status == 2" type="text" size="small">上线</el-button>
<el-button @click="unPublishRange(scope.row)" v-if="scope.row.status == 1" type="text" size="small">下线</el-button>
<el-button @click="liveManage(scope.row)" type="text" size="small">直播管理</el-button>
<el-button @click="roleManage(scope.row)" type="text" size="small">成员管理</el-button>
<el-button @click="editRange(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="deleteRange(scope.row)" type="text" size="small">解散圈子</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleNumChange"
:current-page="searchForm.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchForm.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊小圈',
searchForm: {
name: '',
createTime: '',
pageNo: 1,
pageSize: 10,
},
totalRows: 0,
tableData: [
{
id: 123,
createTime: '',
name: '浙江基础疾病',
num: 12,
publishRole: '所有人可发布动态',
status: 1,
}
],
}
},
methods: {
searchList() {
console.log('查询')
},
resetForm() {
console.log('重置')
},
//新建小圈
createRange() {
this.$router.push({
path: '/create-range',
})
},
//上线
publishRange(row) {
this.$confirm(`确定上线“${row.name}”吗？`, '', {
confirmButtonText: '上线',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
}).catch(() => {
// cancel
});
},
//下线
unPublishRange(row) {
this.$confirm(`确定下线“${row.name}”吗？`, '', {
confirmButtonText: '下线',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
}).catch(() => {
// cancel
});
},
//直播管理
liveManage(row) {
this.$router.push({
path: '/live-manage',
})
},
//成员管理
roleManage(row) {
this.$router.push({
path: '/role-manage',
})
},
//编辑
editRange(row) {},
//解散圈子
deleteRange(row) {
this.$confirm(`确定解散“${row.name}”吗？`, '', {
confirmButtonText: '解散',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
}).catch(() => {
// cancel
});
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
},
}
</script>
<style lang="scss">
.yqrange-index-wrapper{
.yqrange-index-content{
background: #fff;
padding: 10px;
.header-title{
padding: 10px 12px;
font-size: 12px;
color: #449284;
border-bottom: 1px solid #efefef;
}
}
.el-button--text{
color: #449284;
font-size: 14px;
&::after{
content: '';
position: relative;
height: 14px;
/*border-right: 1px solid #EBEEF5;*/
border-right: 1px solid #aaaaaa;
padding-right: 10px;
}
&:last-of-type{
&::after{
content: '';
position: relative;
width: 1px;
height: 14px;
border-right: none;
}
}
}
}
.range-make-box{
.el-message-box__btns{
margin-top: 30px;
}
}
</style>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或