Skip to content

C
cust_web
Commit 060b4d61 authored by 曹泽华's avatar 曹泽华
Browse files
Options

话题管理

parent 438d5aaf
Show whitespace changes
Inline Side-by-side
Showing with 1272 additions and 5 deletions
src/api/contentManagement/topic.js 0 → 100644
View file @ 060b4d61
import request from '@/utils/request'
import Qs from 'qs'
/**
* 1. 列表查询
* 2. 查询详细信息
* 3. 新增
* 4. 修改
* 5. 逻辑删除
* 6. 导出
*
*/
// 1. 查询话题列表
export function listOpmTopic(query) {
return request({
url: '/opmTopic/queryOpmTopicByPagination',
method: 'get',
params: query
})
}
// 2. 查询新闻资讯详细信息
export function getOpmTopic(businessId) {
return request({
url: '/opmTopic/detail/' + businessId,
method: 'get'
})
}
// 3. 新增新闻资讯
export function addOpmTopic(data) {
data = Qs.stringify(data)
return request({
url: '/opmTopic/add',
method: 'post',
data: data
})
}
// 4. 修改新闻资讯
export function updateOpmTopic(data) {
const businessId = data.businessId
data = Qs.stringify(data)
return request({
url: '/opmTopic/update/' + businessId,
method: 'post',
data
})
}
// 5. 逻辑删除新闻资讯
export function delOpmTopic(businessId) {
return request({
url: '/opmTopic/delete/' + businessId,
method: 'delete'
})
}
// 6. 导出新闻资讯
export function exportOpmTopic(query) {
return request({
url: '/opmTopic/export',
method: 'get',
params: query,
responseType: 'blob'
})
}
// 7. 修改新闻资讯状态
export function updateStatus(data) {
const businessId = data.businessId
data = Qs.stringify(data)
return request({
url: '/opmTopic/updateStatus/' + businessId,
method: 'post',
data: data
})
}
// 7. 修改审核状态
export function updateExamStatus(data) {
const businessId = data.businessId
data = Qs.stringify(data)
return request({
url: '/opmTopic/updateExamStatus/' + businessId,
method: 'post',
data: data
})
}
export function updateNoExamStatus(data) {
const businessId = data.businessId
data = Qs.stringify(data)
return request({
url: '/opmTopic/updateNoExamStatus/' + businessId,
method: 'post',
data: data
})
}
src/utils/allPageData.js
View file @ 060b4d61
// 命名导出
export { typeField, enableOrDisable, yesOrNo }
export { typeField, enableOrDisable, yesOrNo, isExam }
/** banner管理*/
/** 分类*/
const typeField = [
......@@ -17,3 +17,8 @@ const yesOrNo = [
{ value: 0, label: '是' },
{ value: 1, label: '否' }
]
const isExam = [
{ value: '0', label: '未审核' },
{ value: '1', label: '已审核' }
]
src/views/contentManagement/topic/index.vue
View file @ 060b4d61
<template>
<div>
话题管理
<!-- 话题管理 -->
<div class="app-container">
<div v-show="showSwitch.courseContent" class="courseContent">
<div class="search">
<el-form ref="queryForm" style="padding: 0 0 0 10px" :model="queryParams" :inline="true">
<el-form-item label="发布状态:" prop="flag">
<!-- 发布状态下拉框-->
<el-select v-model="queryParams.flag" placeholder="请选择发布状态">
<el-option
v-for="item in releaseStatusOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="发布日期:" prop="publishDate">
<el-date-picker
v-model="dateRange"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
@change="handleChangeTime"
/>
</el-form-item>
<el-form-item>
<!-- //查询按钮-->
<el-button
:class="commonField.queryClass"
:type="commonField.typePrimary"
:icon="commonField.queryIcon"
:size="commonField.smallSize"
@click="loadData"
>{{ commonField.queryName }}</el-button>
<!-- //重置按钮-->
<el-button
:class="commonField.resetClass"
:icon="commonField.resetIcon"
:size="commonField.smallSize"
@click="resetQuery"
>{{ commonField.resetName }}</el-button>
</el-form-item>
<div style="float: right">
<el-form-item>
<!-- //新增按钮-->
<el-button
v-has-permi="hasAddPerm"
:class="commonField.addClass"
:type="commonField.typePrimary"
:icon="commonField.addIcon"
:size="commonField.smallSize"
@click="handleAdd"
>{{ commonField.addName }}</el-button>
</el-form-item>
</div>
</el-form>
</div><div style="padding:5px 10px">
<div class="tableTitle">话题列表</div>
<el-table v-loading="fullscreenLoading" :data="tableData" border sortable="true" style="text-align: left;">
<span slot="empty">{{ tableDataTips }}</span>
<el-table-column align="center" prop="id" label="序号" min-width="55px">
<template slot-scope="scope">
<span>{{ scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column align="center" prop="topicName" label="话题名称" min-width="200" show-overflow-tooltip />
<el-table-column align="center" prop="examStatus" label="审核状态" min-width="200" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ scope.row.examStatus === '1' ? '已审核' : '未审核' }}</span>
</template>
</el-table-column>
<el-table-column align="center" prop="weight" label="排序" min-width="200" show-overflow-tooltip />
<el-table-column align="center" prop="articleCount" label="动态数" min-width="200" show-overflow-tooltip />
<el-table-column align="left" prop="flag" label="发布状态" min-width="120" show-overflow-tooltip>
<template slot-scope="scope">
<el-switch
v-model="scope.row.flag"
class="switchDisabledStyle"
inactive-value="0"
active-value="1"
@click.native="handleStatusChange(scope.row)"
/>
</template>
</el-table-column>
<!-- <el-table-column align="left" prop="createUser" label="提交人" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ scope.row.nickName }}</span>
</template>
</el-table-column>-->
<!-- <el-table-column align="left" prop="createDate" label="提交时间" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ scope.row.createDate }}</span>
</template>
</el-table-column>-->
<el-table-column align="center" label="操作" min-width="160">
<template slot-scope="scope">
<el-button
v-has-permi="hasDetailPerm"
:class="commonField.updateClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleView(scope.row)"
>查看</el-button>
<el-button
v-has-permi="hasUpdatePerm"
:class="commonField.updateClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleUpdate(scope.row)"
>编辑</el-button>
<el-button
v-show="scope.row.examStatus === '0'"
:class="commonField.resetPasClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleExam(scope.row)"
>审核</el-button>
<el-button
v-show="scope.row.examStatus === '1'"
:class="commonField.resetPasClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="handleNoExam(scope.row)"
>撤回审核</el-button>
<el-button
:class="commonField.resetPasClass"
:type="commonField.typeParent"
:size="commonField.size"
@click="removeCourse(scope.row)"
>删除</el-button>
<!-- <el-button type="text" @click="handleView(scope.row)">查看</el-button>-->
</template>
</el-table-column>
</el-table>
</div>
<pagination
v-show="total>0"
:key="pageKey"
:total="total"
:page.sync="queryParams.page"
:limit.sync="queryParams.rows"
@pagination="loadData"
/>
<footer />
</div>
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="90px">
<el-form-item label="话题名称:" prop="topicName">
<el-input v-model.trim="form.topicName" show-word-limit :maxlength="500" placeholder="请输入话题名称" />
</el-form-item>
<el-form-item label="排序:" prop="weight">
<el-input-number v-model.trim="form.weight" style="width: 100%" controls-position="right" :min="0" />
</el-form-item>
<el-form-item label="动态数:" prop="articleCount">
<el-input-number v-model.trim="form.articleCount" style="width: 100%" controls-position="right" :min="0" />
</el-form-item>
<el-form-item label="状态:">
<el-radio-group v-model="form.flag" style="width: 100%">
<el-radio
v-for="item in enableOrDisable"
:key="item.value"
:label="item.value"
>
{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button class="cancelBtn" @click="cancel">取 消</el-button>
<el-button class="submitBtn" type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import commonField from '@/utils/commonField'
import {
addOpmTopic,
delOpmTopic, getOpmTopic,
listOpmTopic, updateExamStatus, updateNoExamStatus, updateOpmTopic, updateStatus
} from '@/api/contentManagement/topic'
import { updateResponseUrl } from '@/utils/updateUrl'
import { error } from 'autoprefixer/lib/utils'
import { parseTime } from '@/utils'
import { getDataCache, setDataCache } from '@/assets/js/filterData'
import { listCmsActivity } from '@/api/contentManagement/activity'
import { typeField, enableOrDisable } from '@/utils/allPageData'
import { addCmsBanner, getCmsBanner, updateCmsBanner } from '@/api/contentManagement/banner'
export default {
name: 'Index'
name: 'Index',
// components: {
// CurCat
// },
data() {
return {
pageKey: 0,
open: false,
title: '新增话题',
hasAddPerm: ['sys:topic:add'],
hasUpdatePerm: ['sys:topic:update'],
hasDetailPerm: ['sys:topic:query'],
/* imageSrc: require('@/assets/image/test.png'),*/
// 显示开关
showSwitch: {
courseContent: true,
curCat: false
},
// 对话框
dialogFormVisible: false,
dialogVisible: false,
enableOrDisable,
// 新增课程
form: {
id: '',
topicName: '',
examStatus: '',
weight: '',
articleCount: '',
flag: ''
},
// 课程方向
courseDirection: [],
formLabelWidth: '90px',
// 表格
tableData: [],
lineindex: 0,
teacode: '',
// edit form
labelPosition: 'right',
formLabelAlign: {
id: '',
region: '',
couDire: '',
credit: 0,
totalStuHours: 0
},
// 日期范围
dateRange: [],
// 板块选择框
plateOptions: [
{
label: '板块一',
value: '1'
},
{
label: '板块二',
value: '2'
},
{
label: '板块三',
value: '3'
}
],
// 发布状态
releaseStatusOptions: [
{
label: '已发布',
value: '1'
},
{
label: '未发布',
value: '0'
}
],
// 上传提交
uploadList: {
fm: ''
},
// search area
courseid: '',
coursename: '',
queryParams: {
page: 1,
rows: 10,
flag: ''
},
// pagination
total: 0,
actionUrl: '',
filelist: [],
bussid: [],
fullscreenLoading: false,
curCatForm: {
},
tableDataTips: '加载中',
rules: {
topicName: [
{ required: true, message: '请输入话题名称', trigger: 'blur' }
],
weight: [
{ required: true, message: '请输入排序' }
],
articleCount: [
{ required: true, message: '请输入动态数' }
]
}
}
},
computed: {
commonField() {
return commonField
}
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave(to, from, next) {
setDataCache(this.$route.path, this.queryParams)
next()
},
beforeRouteEnter(to, from, next) {
next(vm => {
if (from.path === '/contentManagement/topic/info/detail' ||
from.path === '/contentManagement/topic/info/index' ||
from.path === '/contentManagement/topic/info/update') {
vm.queryParams.page = JSON.parse(getDataCache(vm.$route.path)).page
setTimeout(() => {
vm.loadData()
}, 500)
}
})
},
created() {
},
mounted: function() {
this.loadData()
},
methods: {
step(index) {
return 'step' + index
},
changPlate(data) {
if (data === '1') {
return '板块一'
}
if (data === '2') {
return '板块二'
}
if (data === '3') {
return '板块三'
}
},
/**
* @description: 点击蒙版关闭预览图片
* @author: gaoyu
* @param: imageId
* @return:
**/
handleClickStop(imageId) {
this.$nextTick(() => {
var domImageView = document.querySelector(`#${this.step(imageId)} .el-image-viewer__mask`)
if (!domImageView) {
return
}
var closeButton = document.querySelector(`#${this.step(imageId)} .el-image-viewer__close`)
domImageView.addEventListener('click', () => {
closeButton.click()
})
})
},
// 日期格式转换
replace(time) {
return parseTime(time, '{y}/{m}/{d}/{h}:{i}')
},
submitForm() {
this.$refs['form'].validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
updateOpmTopic(this.form).then(response => {
this.msgSuccess('修改成功')
this.open = false
this.loadData()
})
} else {
addOpmTopic(this.form).then(response => {
this.msgSuccess('新增成功')
this.open = false
this.loadData()
})
}
}
})
},
cancel() {
this.open = false
},
// 表单重置
reset() {
this.form = {
businessId: undefined,
topicName: undefined,
weight: undefined,
articleCount: undefined,
flag: '0'
}
},
/** 重置按钮操作 */
resetQuery() {
this.queryParams = {
page: 1,
rows: 10,
flag: ''
}
this.dateRange = []
this.loadData()
},
handleChangeTime() {
if (this.dateRange && this.dateRange !== '' && this.dateRange !== undefined && this.dateRange.length > 0) {
this.queryParams.beginTime = this.dateRange[0] + ' 00:00:00'
this.queryParams.endTime = this.dateRange[1] + ' 23:59:59'
} else {
this.queryParams.beginTime = ''
this.queryParams.endTime = ''
}
},
/** 查询话题管理列表 */
loadData() {
this.loading = true
listOpmTopic(this.queryParams).then(
response => {
// 处理分页数据里的url
this.tableData = response.data
this.total = response.total
this.loading = false
console.log('response', response)
}
)
},
// 修改状态
handleStatusChange(row) {
const text = row.flag === '1' ? '启用' : '停用'
const params = {
businessId: row.businessId,
flag: row.flag
}
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return updateStatus(params)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
}).catch(function() {
row.flag = row.flag === '0' ? '1' : '0'
})
},
handleExamination(data) {
console.log('data', data)
this.$router.push({
path: '/courseInformation/examinationManagement/index',
query: {
bussinessId: '0bfc7e40e2784ea9a7de7c6e6f07d93e',
name: '测试'
}
})
},
/** 新增按钮操作 */
handleAdd() {
this.open = true
},
/** 修改按钮操作 */
handleUpdate(row) {
// this.reset()
const id = row.businessId
console.log('id', id)
getOpmTopic(id).then(response => {
this.form = response.data
this.open = true
this.title = '编辑话题'
})
},
/** 删除按钮操作 */
removeCourse(row) {
const id = row.businessId
this.$confirm('是否确认操作？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return delOpmTopic(id)
}).then(() => {
this.loadData()
this.$message({
message: '删除成功',
type: 'success'
})
})
},
/** 审核按钮操作 */
handleExam(row) {
const text = row.examStatus === '1' ? '撤回审核' : '审核'
const params = {
businessId: row.businessId,
examStatus: row.examStatus
}
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return updateExamStatus(params)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
this.loadData()
})
},
/** 撤回审核按钮操作 */
handleNoExam(row) {
const text = row.examStatus === '1' ? '撤回审核' : '审核'
const params = {
businessId: row.businessId,
examStatus: row.examStatus
}
this.$confirm('是否确认操作?', '警告', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(function() {
return updateNoExamStatus(params)
}).then(() => {
this.$message({
message: text + '成功',
type: 'success'
})
this.loadData()
})
},
/**
* @description: 查看
* @author: gaoyu
* @param:
* @return:
**/
handleView(row) {
this.$router.push({
path: '/contentManagement/topic/info',
query: {
isOperation: '3',
businessId: row.businessId,
title: ' 查看话题 '
}
})
},
// 获取图片的正确路径
getImagePath() {
return require(`@/assets/image/testImage/test.png`)
},
// 封面图片预览
justEnter(event) {
// 鼠标进入时的操作
},
justOut(event) {
// 鼠标离开时的操作
}
}
}
</script>
<style scoped>
<style lang="scss" scoped>
.app-container {
font-size: 18px;
padding: 0;
::v-deep .el-table td:nth-child(2) .cell {
margin: 10px;
height: 45px;
}
/* ::v-deep .el-table .cell {
text-align: center !important;
}
::v-deep .el-table th .cell{
justify-content: center;
text-align: center !important;
}*/
}
/*
#courseManage{
!*width:calc(100% - 30px);*!
!*height:calc(100% - 60px);*!
}
.courseContent{
!*padding-left: 15px;*!
width:100%;
height:100%;
::v-deep .el-table th .cell{
justify-content: left!important;
}
::v-deep .el-table td .cell{
margin: 10px 0 10px 0;
text-align: left!important;
}
}
#courseManage .table_box{
margin:0;
height:calc(100% - 175px);
}
#courseManage .el-table{height:100%;}
#courseManage .el-table__body-wrapper{
height:calc(100% - 40px);
overflow-x:hidden;
overflow-y:auto;
}
#courseManage .pages{margin-top:15px;}
#courseManage .breadNav{margin-left:0;}
#courseManage .search_area{margin:1em 0;}
#courseManage .info_change{margin-left:0;}
#courseManage .search_area div{width:190px;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none;}
input[type="number"]{-moz-appearance: textfield;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none !important;
margin: 0;
}
*/
</style>
src/views/contentManagement/topic/info/index.vue 0 → 100644
View file @ 060b4d61
<template>
<div class="shiftInformation_update">
<div class="updateContainer">
<div class="topTitle">
<span class="topTitleText">{{ title }}</span>
</div>
<div class="twoTitle">
<el-tag v-if="form.flag==='1'" type="success">已发布</el-tag>
</div>
<div class="updateBoby">
<el-form ref="deviceFormRef" :model="form" :rules="rules" label-position="right" label-width="auto">
<el-row>
<el-col :span="24">
<el-form-item
label="话题名称:"
prop="topicName"
:rules="{ required: !(controls.isOperation === '3'), message: '请输入话题名称', trigger: 'blur' }"
>
<el-input
v-model.trim="form.topicName"
:disabled="secondFromDisabled"
placeholder="请输入标题"
size="small"
class="normalInput"
:maxlength="100"
/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<!-- <el-col :span="12">-->
<!-- &lt;!&ndash; 是否为头条新闻&ndash;&gt;-->
<!-- <el-form-item-->
<!-- label="是否为头条新闻:"-->
<!-- prop="isForntPage"-->
<!-- :rules="{ required: !(controls.isOperation === '3'), message: '请选择是否为头条新闻', trigger: 'blur' }"-->
<!-- >-->
<!-- <el-select v-model="form.isForntPage" placeholder="请选择是否为头条新闻" size="small" class="normalInput" :disabled="secondFromDisabled">-->
<!-- <el-option v-for="item in yesOrNo" :key="item.value" :label="item.label" :value="item.value" />-->
<!-- </el-select>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<el-col :span="12">
<!-- 是否推荐-->
<el-form-item
label="审核状态:"
prop="isRecommended"
:rules="{ required: !(controls.isOperation === '3'), message: '请选择审核状态', trigger: 'change' }"
>
<el-select v-model="form.examStatus" placeholder="请选择审核状态" size="small" class="normalInput" :disabled="secondFromDisabled">
<el-option v-for="item in isExam" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<!-- 是否置顶-->
<el-form-item
label="排序:"
prop="isTop"
:rules="{ required: !(controls.isOperation === '3'), message: '请选择排序', trigger: 'change' }"
>
<el-input-number v-model="form.weight" placeholder="请选择是否置顶公告" size="small" class="normalInput" :disabled="secondFromDisabled">
<el-option v-for="item in yesOrNo" :key="item.value" :label="item.label" :value="item.value" />
</el-input-number>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item
label="动态数:"
prop="releaseDate"
:rules="{ required: !(controls.isOperation === '3'), message: '请选择动态数', trigger: 'blur' }"
>
<el-input-number
v-model="form. articleCount"
:disabled="secondFromDisabled"
placeholder="请输入标题"
size="small"
class="normalInput"
:maxlength="100"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<!-- 是否推荐-->
<el-form-item
label="发布状态:"
prop="isRecommended"
:rules="{ required: !(controls.isOperation === '3'), message: '请选择发布状态', trigger: 'change' }"
>
<el-select v-model="form.flag" placeholder="请选择是否推荐公告" size="small" class="normalInput" :disabled="secondFromDisabled">
<el-option v-for="item in enableOrDisable" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
<!-- 按钮区 -->
<div class="btn-box">
<el-button v-if="controls.isOperation !== '3'" style="width: 80px; height: 40px;font-size: 16px; width: 138px;height: 38px " @click="submit">保存
</el-button>
<el-button v-if="controls.isOperation !== '3'" style="width: 80px; height: 40px;font-size: 16px; width: 138px;height: 38px " type="primary" :loading="pubLoading" @click="publish">发布
</el-button>
<el-button v-if="controls.isOperation === '3'" style="width: 80px; height: 40px;font-size: 16px; width: 138px;height: 38px " @click="goBack">返回
</el-button>
</div>
</div>
</template>
<script >
import {
addOpmTopic,
getOpmTopic, updateOpmTopic
} from '@/api/contentManagement/topic'
import { updateResponseUrl } from '@/utils/updateUrl'
import { VueEditor } from 'vue2-editor'
import { yesOrNo, isExam, enableOrDisable } from '@/utils/allPageData'
/* import { uploadPublic } from '@/api/contentManagement/sysContest'*/
export default {
components: {
VueEditor
},
data() {
return {
title: '查看话题',
pubLoading: false,
businessId: null,
isOperation: null,
// 变更字段存储数组
formChanges: [],
// 板块选择框
plateOptions: [
{
label: '板块一',
value: '1'
},
{
label: '板块二',
value: '2'
},
{
label: '板块三',
value: '3'
}
],
customToolbar: [
['bold', 'italic', 'underline', 'strike'], // 加粗 斜体 下划线 删除线 -----['bold', 'italic', 'underline', 'strike']
['blockquote', 'code-block'], // 引用 代码块-----['blockquote', 'code-block']
[{ list: 'ordered' }, { list: 'bullet' }], // 有序、无序列表-----[{ list: 'ordered' }, { list: 'bullet' }]
[{ header: 1 }, { header: 2 }],
[{ script: 'sub' }, { script: 'super' }], // 上标/下标-----[{ script: 'sub' }, { script: 'super' }]
[{ indent: '-1' }, { indent: '+1' }],
[{ size: [] }], // 配置字号
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题-----[{ header: [1, 2, 3, 4, 5, 6, false] }]
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色-----[{ color: [] }, { background: [] }]
[{ font: [] }], // 显示字体选择
[{ align: [] }], // 对齐方式-----[{ align: [] }]
['clean'], // 清除文本格式-----['clean']
['image'] // 链接、图片、视频-----['link', 'image', 'video']
],
imageUrl: '',
// 控制表单
controls: {
// 1:代表新增 2:代表编辑 3:代表查看
isOperation: '1'
},
fileUpload: '/dev-api/common/fileUpload?file=' + this.file + '&temp=' + 'activity',
// 提交表单
form: {
// 主表id
businessId: undefined,
createBy: undefined,
createDate: undefined,
deptId: undefined,
deptTwoId: undefined,
equipmentName: undefined,
flag: undefined,
photoossId: undefined,
summary: undefined,
weight: undefined,
// isForntPage: undefined,
isRecommended: undefined,
isTop: undefined
},
yesOrNo,
isExam,
enableOrDisable,
// 状态
statusOptions: [
{
label: '启用',
value: '1'
},
{
label: '停用',
value: '0'
}
],
// 校验规则
rules: {
startDateS: [],
endDateS: []
}
}
},
computed: {
// 第一种禁用情况 1.查看的情况
secondFromDisabled() {
return (this.controls.isOperation === '3')
}
},
mounted() {
this.businessId = this.$route.query.businessId
this.title = this.$route.query.title
this.getIsOperation()
this.getDetail()
},
created() {
this.isOperation = this.$route.query.isOperation
// 页面加载时根据 isOperation 设置表单的默认值
this.setFormDefaults()
},
methods: {
setFormDefaults() {
const isOperation = this.isOperation
// 判断是新增、编辑还是查看
if (isOperation === '1') {
// 新增时，默认置顶为'否'（value: '0'）
this.form.isRecommended = 1
this.form.isTop = 1
}
},
queryRules() {
console.log('111111111111')
this.$refs.deviceFormRef.validateField('details')
},
/**
* @description: 处理上传接口
* @author: gaoyu
* @param:
* @return:
**/
handleUpload(file) {
const formData = new FormData()
formData.append('file', file.file)
formData.append('temp', 'newInformation')
uploadPublic(formData).then(res => {
this.form.pictureId = res.data.businessId
this.imageUrl = res.data.url
})
},
handleImageAdded(file, Editor, cursorLocation, reseter) {
const formData = new FormData()
formData.append('file', file)
formData.append('temp', 'newInformation')
uploadPublic(formData).then(res => {
console.log('handleImageAdded', res)
const url = res.data.url
Editor.insertEmbed(cursorLocation, 'image', url)
})
// var formData = new FormData()
// formData.append('image', file)
// $http.post(this.$common.baseUrl + 'upload/image', formData).then(res => {
// const data = res.body
// if (data.code == 200) {
// const url = data.data.url
// Editor.insertEmbed(cursorLocation, 'image', url)
// resetUploader()
// } else { }
// })
},
// 查询详情
getDetail() {
console.log('查询详情')
if (this.$route.query.businessId) {
getOpmTopic(this.$route.query.businessId).then(response => {
if (response.code === 200) {
this.form = response.data
}
})
}
},
handleAvatarSuccess(res, file) {
console.log('res', res)
this.imageUrl = URL.createObjectURL(file.raw)
this.form.pictureId = res.data.businessId
},
beforeAvatarUpload(file) {
// 判断文件是否为图片类型
const isJPG = file.type === 'image/jpeg' || file.type === 'image/png'
const isLt2M = file.size / 1024 / 1024 < 2
if (!isJPG) {
this.$message.error('只能上传图片格式的文件!')
return false
}
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 2MB!')
return false
}
this.file = file
},
goBack() {
this.$router.push({
path: '/contentManagement/topic'
})
},
// 判断要进行什么操作 isOperation值 1:新增 2:编辑 3:查看
getIsOperation() {
if (this.$route.query.isOperation) {
this.controls.isOperation = this.$route.query.isOperation
}
},
// 保存方法
submit() {
// 拷贝form
const form = JSON.parse(JSON.stringify(this.form))
// 转换时间格式
this.$refs.deviceFormRef.validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
// 编辑
updateOpmTopic(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.$router.push({
path: '/contentManagement/activity/index'
})
}
})
} else {
addOpmTopic(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.$router.push({
path: '/contentManagement/activity/index'
})
}
})
}
}
})
},
// 发布方法
publish() {
// 拷贝form
const form = JSON.parse(JSON.stringify(this.form))
// 转换时间格式
this.pubLoading = true
this.$refs.deviceFormRef.validate(valid => {
if (valid) {
if (this.form.businessId !== undefined) {
// 编辑
form.flag = '1'
updateOpmTopic(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.pubLoading = false
this.$router.push({
path: '/contentManagement/activity/index'
})
}
}).catch(() => {
this.pubLoading = false
})
} else {
form.flag = '1'
addOpmTopic(form).then(res => {
if (res.code === 200) {
this.$message({
message: '保存成功',
type: 'success'
})
this.pubLoading = false
this.$router.push({
path: '/contentManagement/activity/index'
})
}
}).catch(() => {
this.pubLoading = false
})
}
} else {
this.pubLoading = false
}
})
}
}
}
</script>
<style scoped lang="scss">
::v-deep.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
::v-deep.avatar-uploader .el-upload:hover {
border-color: #409EFF;
}
::v-deep.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
::v-deep.avatar {
width: 178px;
height: 178px;
display: block;
}
.btn-box{
margin-top: 50px;
margin-bottom: 30px;
//position: absolute;
//bottom: 50px;
}
.shiftInformation_update {
background-color: rgba(243, 243, 255, 1);
width: 98%;
margin-left: 1%;
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-evenly;
.normalInput {
width: 100%;
background: #F9F9F9;
border-radius: 5px;
}
.updateContainer {
width: 100%;
border-radius: 6px;
.updateBoby {
padding: 0 40px 0 40px;
width: 100%;
margin-top: 40px;
}
.topTitle {
text-align: center;
padding-top: 30px;
}
.topTitleText{
font-size: 24px;
font-weight: bold;
color: #333333;
line-height: 24px;
}
.twoTitle {
text-align: center;
padding-top: 20px;
}
.twoTitleText{
font-size: 16px;
font-weight: bold;
color: green;
line-height: 24px;
}
}
.buttonArea {
justify-content: end;
align-items: end;
display: flex;
height: 500px;
width: 82%;
.alter {
border-radius: 6px;
background-color: rgba(52, 51, 153, 1);
color: rgba(255, 255, 255, 1);
font-size: 14px;
}
.Back {
border-radius: 6px;
background-color: rgba(255, 255, 255, 1);
border: 1px solid rgba(52, 51, 153, 1);
color: rgba(52, 51, 153, 1)
}
}
.applicationDialog {
.right-section {
margin-left: 20px;
}
.left-scrollable-area{
overflow: auto;
height: 170px;
}
.scrollable-area{
overflow: auto;
height: 213px;
}
.left-section {
width: 98%;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment