初始化项目

This commit is contained in:
18500206848
2024-02-02 15:04:47 +08:00
parent 12664d0204
commit 7aec486f06
718 changed files with 152280 additions and 1 deletions

View File

@@ -0,0 +1,131 @@
<template>
<basic-container>
<jl-go-back></jl-go-back>
<el-form :model="formOption" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item label="内容标题" prop="title">
<el-input v-model="formOption.title"></el-input>
</el-form-item>
<el-form-item label="一级分类" prop="firstId">
<el-select v-model="formOption.firstId" placeholder="请选择一级分类" @change="secondList">
<el-option v-for="(item, index) in first" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
</el-form-item>
<el-form-item label="二级分类" prop="secondId">
<el-select v-if="formOption.firstId" v-model="formOption.secondId" placeholder="请选择二级分类">
<el-option v-for="(item, index) in second" :key="index" :label="item.name" :value="item.id"></el-option>
</el-select>
<el-select v-else disabled v-model="formOption.secondId" placeholder="请选择二级分类"></el-select>
</el-form-item>
<el-form-item label="编辑内容" prop="content">
<Tinymce v-model="formOption.content" ref="tinymce"></Tinymce>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')" :loading="btnLoading">保存</el-button>
<el-button @click="resetForm('ruleForm')">取消</el-button>
</el-form-item>
</el-form>
</basic-container>
</template>
<script>
import Tinymce from "@/components/Tinymce";
import {
getAllContentCategoryFirstList,
getAllContentCategorySecondList
} from '@/api/help/classify'
import {
contentSave,
contentEdit
} from '@/api/help/content/allContent'
export default {
name: "addContent",
props: {
id: Number,
type: String
},
components: {
Tinymce
},
data () {
return {
btnLoading: false,
formOption: {
firstId: '',
secondId: ''
},
rules: {
title: [
{ required: true, message: '请输入内容标题', trigger: 'blur' }
],
firstId: [
{ required: true, message: '请选择一级分类', trigger: 'blur' }
],
secondId: [
{ required: true, message: '请选择二级分类', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入内容', trigger: 'blur' }
],
},
first: [],
second: []
}
},
mounted() {
this.firstList()
},
methods: {
firstList(){
if (this.id && this.type == 'edit') {
this.formOption = JSON.parse(this.id)
this.searchSecondList(this.formOption.firstId)
}
getAllContentCategoryFirstList().then(res => {
this.first = res.data.data
})
},
secondList (id) {
getAllContentCategorySecondList (id).then(res => {
this.formOption.secondId = ''
this.second = res.data.data
})
},
searchSecondList (id) {
getAllContentCategorySecondList (id).then(res => {
this.second = res.data.data
})
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.btnLoading = true
if (this.type === 'add') {
contentSave(JSON.stringify(this.formOption)).then(res => {
this.$message.success('添加成功');
this.btnLoading = false
this.$router.go(-1);
})
} else if (this.type === 'edit') {
contentEdit(JSON.stringify(this.formOption)).then(res => {
this.$message.success('修改成功');
this.btnLoading = false
this.$router.go(-1);
})
}
}
});
},
resetForm(formName) {
this.viewDrawer = false
this.$refs[formName].resetFields();
},
}
}
</script>
<style scoped>
.el-form-item{
margin-bottom: 28px !important;
}
</style>

View File

@@ -0,0 +1,177 @@
<template>
<basic-container>
<avue-crud
:option="option"
:table-loading="loading"
:data="data"
:page.sync="page"
ref="crud"
@search-change="searchChange"
@current-change="currentChange"
@size-change="sizeChange"
@refresh-change="refreshChange"
@search-reset="searchReset"
@on-load="onLoad"
>
<template slot="menuLeft">
<el-button size="small" type="primary" @click="add">新增内容</el-button>
</template>
<template slot="menu" slot-scope="{row}">
<el-button size="small" type="text" @click="modify(row)">编辑</el-button>
<el-button size="small" type="text" @click="del(row)">删除</el-button>
</template>
</avue-crud>
</basic-container>
</template>
<script>
import {getAllContentCategoryFirst} from '@/api/help/classify'
import {getContentList, contentDel} from '@/api/help/content/allContent'
export default {
name: "index",
data () {
return {
loading:false,
viewDrawer:false,
drawerTitle: '新增内容',
query: {},
option: {
height: "auto",
tip: false,
searchShow: true,
searchMenuSpan: 6,
border: true,
index: true,
indexLabel: "序号",
selection: false,
viewBtn: false,
addBtn: false,
editBtn:false,
delBtn: false,
columnBtn: false,
menuWidth: 300,
labelWidth: 151,
dialogClickModal: false,
dialogType: "drawer",
dialogFullscreen: true,
column: [
{
label: "内容标题",
prop: "title",
display: false,
search: true
},
{
label: "一级分类",
prop: "firstId",
display: false,
search: true,
type: "tree",
dicUrl: getAllContentCategoryFirst(),
props: {
label: "name",
value: "id"
},
},
{
label: "二级分类",
prop: "secondName",
display: false,
},
{
label: "更新时间",
prop: "createTime",
display: false,
type: "datetime",
format: "yyyy/MM/dd",
}
]
},
data: [
{
title: '测试标题',
type: '常见问题',
tag: '规范',
time: '2021.7.2',
note: '<p>测试内容</p>'
}
],
page: {
pageSize: 10,
currentPage: 1,
total: 100,
},
first: [],
second: []
}
},
methods: {
add () {
this.$router.push({ name: '添加/修改内容', params: { type: 'add', id: null } })
},
modify (row) {
this.$router.push({ name: '添加/修改内容', params: { type: 'edit', id: JSON.stringify(row) } })
},
del (row) {
this.$confirm('是否删除此数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
contentDel(JSON.stringify(row)).then(res => {
this.$message({
type: 'success',
message: '删除成功!'
});
this.onLoad(this.page);
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
/* 表格方法 */
onLoad(page, params = {}) {
this.loading = true;
getContentList(
page.currentPage,
page.pageSize,
Object.assign(this.query, params)
).then((res) => {
this.data = res.data.data.records;
this.page.total = res.data.data.total;
this.loading = false;
});
},
searchReset() {
this.query = {};
this.onLoad(this.page);
},
searchChange(params,done) {
this.query = params;
this.page.currentPage = 1;
this.onLoad(this.page, params);
done();
},
currentChange(val) {
this.page.currentPage = val
},
sizeChange(val) {
this.page.currentPage = 1
this.page.pageSize = val
},
refreshChange () {
this.page.currentPage = 1;
this.onLoad(this.page)
}
}
}
</script>
<style scoped>
</style>

View File

@@ -0,0 +1,309 @@
<template>
<basic-container>
<avue-crud
:option="option"
:table-loading="loading"
:data="data"
:page.sync="page"
ref="crud"
@search-change="searchChange"
@current-change="currentChange"
@size-change="sizeChange"
@refresh-change="refreshChange"
@tree-load="treeLoad"
@on-load="onLoad"
>
<template slot="menuLeft">
<el-button size="small" type="primary" @click="addFirst">新增一级分类</el-button>
</template>
<template slot="menu" slot-scope="{row}">
<el-button size="small" type="text" @click="modify(row)">编辑</el-button>
<el-button size="small" type="text" @click="del(row)">删除</el-button>
<el-button size="small" type="text" @click="addSecond(row)" v-if="!row.firstId">新增二级</el-button>
</template>
</avue-crud>
<!-- 新增编辑 -->
<el-drawer :title="drawerTitle" :visible.sync="viewDrawer" size="60%">
<el-form :model="formOption" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
<el-form-item v-if="formOption.firstId" label="分类名称" prop="secondName">
<el-input v-model="formOption.secondName"></el-input>
</el-form-item>
<el-form-item v-else label="分类名称" prop="name">
<el-input v-model="formOption.name"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')" :loading="btnLoading">保存</el-button>
<el-button @click="resetForm('ruleForm')">取消</el-button>
</el-form-item>
</el-form>
</el-drawer>
</basic-container>
</template>
<script>
import {getContentCategoryFirstList,
contentCategoryAdd,
contentCategoryFirstEdit,
contentCategoryFirstDel,
contentCategorySecondAdd,
contentCategorySecondEdit,
contentCategorySecondDel
} from '@/api/help/content/classify'
import {
getAllContentCategorySecondList
} from '@/api/help/classify'
export default {
name: "index",
data () {
return {
btnLoading:false,
loading:false,
viewDrawer:false,
drawerTitle: '新增一级分类',
formOption: {
name: ''
},
rules: {
name: [
{ required: true, message: '请输入分类名称', trigger: 'blur' },
{ max: 20, message: '最大输入20个汉字', trigger: 'blur'}
],
secondName: [
{ required: true, message: '请输入分类名称', trigger: 'blur' },
{ max: 6, message: '最大输入6个汉字', trigger: 'blur'}
]
},
option: {
height: "auto",
expandRowKeys:[],
lazy:true,
tip: false,
searchShow: true,
searchMenuSpan: 4,
border: true,
index: true,
indexLabel: "序号",
selection: false,
viewBtn: false,
addBtn: false,
editBtn:false,
delBtn: false,
columnBtn: false,
menuWidth: 300,
labelWidth: 151,
dialogClickModal: false,
dialogType: "drawer",
dialogFullscreen: true,
column: [
{
label: "一级分类",
prop: "name",
display: false,
},
{
label: "二级分类",
prop: "secondName",
display: false,
},
{
label: "创建日期",
prop: "createTime",
display: false,
type: "datetime",
format: "yyyy/MM/dd",
}
]
},
data: [
{
id: 1,
title: '测试标题',
type: '常见问题',
tag: '规范',
time: '2021.7.2',
note: '<p>测试内容</p>',
hasChildren: true
}
],
page: {
pageSize: 10,
currentPage: 1,
total: 100,
},
firstObj: {}
}
},
methods: {
treeLoad (tree, treeNode, resolve) {
const parentId = tree.id;
getAllContentCategorySecondList(parentId).then(res => {
res.data.data.forEach(e => {
e.secondName = JSON.parse(JSON.stringify(e.name))
delete e.name
})
resolve(res.data.data);
})
},
addFirst () {
this.drawerTitle = '新增一级分类'
this.add()
},
addSecond (row) {
this.firstObj = JSON.parse(JSON.stringify(row))
this.drawerTitle = '新增二级分类'
this.add()
},
add () {
this.formOption = {}
this.viewDrawer = true
this.$nextTick(() => {
this.$refs.ruleForm.clearValidate();
})
},
modify (row) {
this.formOption = JSON.parse(JSON.stringify(row))
this.drawerTitle = row.firstId ? "编辑二级分类":'编辑一级分类'
this.viewDrawer = true
this.option.expandRowKeys = []
this.$nextTick(() => {
this.$refs.ruleForm.clearValidate();
})
},
del (row) {
this.$confirm('是否删除此数据, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
if(row.firstId) {
contentCategorySecondDel(JSON.stringify(row)).then(res => {
this.option.expandRowKeys = []
this.$message({
message: res.data.msg,
type: 'success',
})
this.refreshChange()
})
} else {
contentCategoryFirstDel(JSON.stringify(row)).then(res => {
this.$message({
message: res.data.msg,
type: 'success',
})
this.refreshChange()
})
}
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.btnLoading = true
if (this.drawerTitle === '新增一级分类') {
contentCategoryAdd(JSON.stringify(this.formOption)).then(res => {
this.$message({
message: res.data.msg,
type: 'success',
})
this.refreshChange()
this.viewDrawer = false
this.btnLoading = false
}).catch(() => {
this.btnLoading = false
})
}else if(this.drawerTitle === '编辑一级分类') {
contentCategoryFirstEdit(JSON.stringify(this.formOption)).then(res => {
this.$message({
message: res.data.msg,
type: 'success',
})
this.refreshChange()
this.viewDrawer = false
this.btnLoading = false
}).catch(() => {
this.btnLoading = false
})
}else if(this.drawerTitle === '新增二级分类') {
var data = {
firstId: this.firstObj.id,
...this.formOption
}
contentCategorySecondAdd(JSON.stringify(data)).then(res => {
this.$message({
message: res.data.msg,
type: 'success',
})
this.refreshChange()
this.viewDrawer = false
this.btnLoading = false
}).catch(() => {
this.btnLoading = false
})
}else if(this.drawerTitle === '编辑二级分类') {
this.formOption.name = JSON.parse(JSON.stringify(this.formOption.secondName))
delete this.formOption.secondName
var data = {
firstId: this.firstObj.id,
...this.formOption
}
contentCategorySecondEdit(JSON.stringify(data)).then(res => {
this.$message({
message: res.data.msg,
type: 'success',
})
this.viewDrawer = false
this.btnLoading = false
}).catch(() => {
this.btnLoading = false
})
}
} else {
console.log('error submit!!');
return false;
}
});
},
resetForm(formName) {
this.viewDrawer = false
this.$refs[formName].resetFields();
},
/* 表格方法 */
onLoad(page, params = {}) {
this.loading = true;
var data = {
current: page.currentPage,
size: page.pageSize
}
getContentCategoryFirstList(data).then((res) => {
this.data = res.data.data.records;
this.page.total = res.data.data.total;
this.loading = false;
});
},
searchChange(params,done) {},
currentChange(val) {
this.page.currentPage = val
},
sizeChange(val) {
this.page.currentPage = 1
this.page.pageSize = val
},
refreshChange () {
this.page.currentPage = 1;
this.data = []
this.onLoad(this.page)
}
}
}
</script>
<style scoped>
.el-form-item{
margin-bottom: 22px !important;
}
</style>