Skip to content

Z
zj-manage
Commit 46b0a7e4 by swl
Options

✨feature: 操作手册

parent 7a04889e
Showing with 829 additions and 6 deletions
.DS_Store
No preview for this file type
src/api/instructions.js 0 → 100644
import { api, formatParams } from "@/utils/axios";
// 操作手册--列表分页
export function instructList(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual/listPage",
})
);
}
// 操作手册--新增
export function instructAdd(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual/add",
})
);
}
// 操作手册--编辑
export function instructEdit(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual/edit?id=" + params.id,
})
);
}
// 操作手册--启用｜禁用
export function instructEnable(params) {
return api(
Object.assign(formatParams("GET", params), {
url: "/admin-api/manual/enable?id=" + params,
})
);
}
// 操作手册--详情
export function instructDetail(params) {
return api(
Object.assign(formatParams("GET", params), {
url: "/admin-api/manual/detail?id=" + params,
})
);
}
// 操作手册内容--列表分页
export function contentList(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual-content/listPage",
})
);
}
// 应用操作手册-内容--新增
export function contentAdd(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual-content/add",
})
);
}
// 应用操作手册-内容--编辑
export function contentEdit(params) {
return api(
Object.assign(formatParams("POST", params), {
url: "/admin-api/manual-content/edit?id=" + params.id,
})
);
}
// 操作手册-内容--启用｜禁用
export function contentEnable(params) {
return api(
Object.assign(formatParams("GET", params), {
url: "/admin-api/manual-content/enable?id=" + params,
})
);
}
// 操作手册-内容--详情
export function contentDetail(params) {
return api(
Object.assign(formatParams("GET", params), {
url: "/admin-api/manual-content/detail?id=" + params,
})
);
}
src/config/index.js
......@@ -2,7 +2,7 @@ const domain = {
// dev: "http://192.168.3.87:8881", // 姚镇接口
// dev: "http://81.69.231.72:8881", // 姚镇接口
// dev: "http://81.69.231.72:8881", // 测试接口
dev: "https://exam.smart-zj.cn:9100/smartExam/", // 新正式接口
dev: "https://exam.smart-zj.cn:9100/smartExam/", // /新正式接口
};
// 腾讯地图 key
const map = {
......
src/router/index.js
......@@ -349,6 +349,18 @@ const routes = [
meta: ["内容审核"],
component: () => import("@/views/Info/audit_living.vue"),
},
{
path: "/instructions",
name: "instructions",
meta: ["操作手册"],
component: () => import("@/views/instructions/index.vue"),
},
{
path: "/instructions/detail",
name: "instructionsDetail",
meta: ["操作手册"],
component: () => import("@/views/instructions/detail.vue"),
},
],
},
];
......
src/views/Info/living.vue
......@@ -203,7 +203,6 @@ export default {
title: "",
categoryId: "",
},
html: "",
tableData: [],
tableColumns: [
{
......@@ -390,8 +389,7 @@ export default {
this.$nextTick(() => {
this.messageForm = res.data;
this.content = res.data.content;
console.log(res.data.content, "111");
console.log(this.content, "222");
this.messageForm.title = res.data.title;
this.messageForm.categoryId = res.data.categoryId;
});
......
src/views/instructions/detail.vue 0 → 100644
<template>
<div>
<div class="search-wrapper ins-content">
<el-button type="primary" @click="addHandle">新增</el-button>
</div>
<div class="table-wrapper">
<table-template
:tableData="tableData"
:tableColumns="tableColumns"
:loading="loading"
:pagination="pagination"
@Jump="jumpPage"
>
<el-table-column slot="iconUrl" label="图标" align="center">
<template slot-scope="scope">
<el-image
style="width: 30px; height: 30px"
:src="scope.row.iconUrl"
:preview-src-list="[scope.row.iconUrl]"
>
</el-image>
</template>
</el-table-column>
<el-table-column slot="delFlag" label="启用状态" align="center">
<template slot-scope="scope">
<el-tag
v-if="scope.row.delFlag == 0 || scope.row.delFlag == 1"
:type="
scope.row.delFlag == 1
? 'danger'
: scope.row.delFlag == 0
? 'success'
: ''
"
>{{ scope.row.delFlag == 1 ? "禁用" : "启用" }}</el-tag
>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="300" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" round @click="view(scope.row)"
>查看</el-button
>
<el-button
type="primary"
size="mini"
class="btn"
round
@click="edit(scope.row)"
>编辑</el-button
>
<el-button
@click="delFlagHandle(scope.row)"
:type="scope.row.delFlag == 0 ? 'warning' : 'success'"
size="mini"
round
slot="reference"
>{{ scope.row.delFlag == 0 ? "禁用" : "启用" }}
</el-button>
</template>
</el-table-column>
</table-template>
</div>
<el-dialog
:title="type == 'view' ? '查看' : '编辑'"
:visible.sync="dialogVisible"
width="70%"
:close-on-click-modal="false"
:close-on-press-escape="false"
destroy-on-close
class="editorDialog"
>
<el-form
:model="messageForm"
ref="messageForm"
:rules="rules"
label-width="100px"
>
<el-form-item label="标题" prop="title">
<el-input
v-model="messageForm.title"
placeholder="请输入标题"
clearable
:disabled="type === 'view'"
style="width: 300px"
></el-input>
</el-form-item>
<el-form-item label="排序" prop="sort">
<el-input-number
v-model="messageForm.sort"
:min="1"
:disabled="type === 'view'"
></el-input-number>
</el-form-item>
</el-form>
<!-- <quillEditor v-model="content" class="edit" /> -->
<template>
<div style="border: 1px solid #ccc" v-if="dialogVisible">
<Toolbar
style="border-bottom: 1px solid #ccc"
:editor="editor"
:defaultConfig="toolbarConfig"
:mode="mode"
/>
<Editor
style="height: 500px; overflow-y: hidden"
v-model="content"
:defaultConfig="editorConfig"
:mode="mode"
@onCreated="onCreated"
/>
</div>
</template>
<span
slot="footer"
class="dialog-footer"
v-if="type == 'edit' || type == 'add'"
>
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="contentConfirm">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
import TableTemplate from "@/components/Table";
import { config } from "@/utils/request.js";
import axios from "axios";
import {
contentList,
contentAdd,
contentEdit,
contentEnable,
} from "@/api/instructions";
export default {
name: "detail",
components: { TableTemplate, Editor, Toolbar },
data() {
return {
searchForm: {
manualId: "",
},
type: "add",
editor: null,
content: "",
toolbarConfig: {},
editorConfig: { placeholder: "请输入内容...", MENU_CONF: {} },
mode: "default", // or 'simple'
messageForm: {
title: "",
sort: "",
id: "",
},
rules: {
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
sort: [{ required: true, message: "请输入排序", trigger: "blur" }],
},
tableData: [],
pagination: {
total: 0,
pageSize: 10,
currentPage: 1,
},
tableColumns: [
{
key: "title",
label: "标题",
},
{
key: "manualTitle",
label: "手册名称",
},
{
key: "sort",
label: "排序",
},
{
key: "delFlag",
label: "启用状态",
type: "slot",
},
{
key: "createTime",
label: "创建时间",
},
],
loading: false,
dialogVisible: false,
};
},
created() {
this.editorConfig.placeholder = "请输入使用说明内容...";
const uploadConfig = {
// 自定义图片上传
async customUpload(file, insertFn) {
let formData = new FormData();
formData.append("file", file);
// localFileUpload
axios
.post(config.proxy + "/admin-api/file/uploadImg", formData, {
headers: {
"Content-Type": "application/json;charset=utf-8",
Authorization: "Bearer " + localStorage.getItem("Authorization"),
},
})
.then((response) => {
console.log(response);
if (response.data.code != 200) {
this.$message.error(response.data.msg);
return;
} else {
const url = response.data.data;
// 插入图片
insertFn(url);
}
})
.catch(() => {});
},
};
// 图片配置设置
this.editorConfig.MENU_CONF["uploadImage"] = uploadConfig;
// 视频配置设置
this.editorConfig.MENU_CONF["uploadVideo"] = uploadConfig;
},
mounted() {
this.searchForm.manualId = this.$route.query.id;
this.init();
},
watch: {
dialogVisible(val) {
if (!val) {
this.$nextTick(() => {
this.content = "";
this.messageForm.title = "";
this.messageForm.sort = "";
this.messageForm.id = "";
const editor = this.editor;
if (editor == null) return;
editor.destroy(); // 组件销毁时，及时销毁编辑器
});
}
},
},
methods: {
onCreated(editor) {
this.editor = Object.seal(editor); // 一定要用 Object.seal() ，否则会报错
if (this.type == "view") {
this.editor.disable();
} else {
this.editor.enable();
}
},
init() {
this.loading = true;
contentList({
...this.searchForm,
pageNum: this.pagination.currentPage,
pageSize: this.pagination.pageSize,
})
.then((res) => {
if (res.code == 200) {
this.tableData = res.data.list;
this.pagination.total = res.data.total;
}
})
.finally(() => {
this.loading = false;
});
},
jumpPage() {
this.init();
},
addHandle() {
this.type = "add";
this.dialogVisible = true;
},
addContent() {
contentAdd({
title: this.messageForm.title,
sort: this.messageForm.sort,
content: this.content,
manualId: this.$route.query.id,
})
.then((res) => {
if (res.code == 200) {
this.$message.success("新增成功");
this.dialogVisible = false;
this.init();
} else {
this.$message.warning(res.msg || "新增失败");
}
})
.catch(() => {});
},
editContent() {
contentEdit({
title: this.messageForm.title,
sort: this.messageForm.sort,
content: this.content,
manualId: this.$route.query.id,
id: this.messageForm.id,
})
.then((res) => {
if (res.code == 200) {
this.$message.success("编辑成功");
this.dialogVisible = false;
this.init();
} else {
this.$message.warning(res.msg || "编辑失败");
}
})
.catch(() => {});
},
contentConfirm() {
this.$refs.messageForm.validate((valid) => {
if (valid) {
if (this.content) {
if (this.type == "add") {
this.addContent();
} else {
this.editContent();
}
} else {
this.$message.error("请输入内容");
}
}
});
},
delFlagHandle(row) {
contentEnable(row.id)
.then((res) => {
if (res.code == 200) {
this.$message.success("操作成功");
this.init();
} else {
this.$message.warning(res.msg || "操作失败");
}
})
.catch(() => {});
},
view(row) {
this.type = "view";
this.dialogVisible = true;
this.messageForm.title = row.title;
this.messageForm.sort = row.sort;
this.messageForm.id = row.id;
this.content = row.content;
},
edit(row) {
this.type = "edit";
this.dialogVisible = true;
this.messageForm.title = row.title;
this.messageForm.sort = row.sort;
this.messageForm.id = row.id;
this.content = row.content;
},
},
};
</script>
<style scoped>
.ins-content {
margin-bottom: 20px;
text-align: right;
}
.editorDialog >>> .el-dialog__body {
padding-top: 0px;
}
</style>
<style src="@wangeditor/editor/dist/css/style.css"></style>
src/views/instructions/index.vue 0 → 100644
<template>
<div>
<div class="search-wrapper">
<el-form
:inline="true"
:model="searchForm"
class="search_form"
style="text-align: left"
>
<el-form-item label="标题">
<el-input
clearable
v-model="searchForm.title"
placeholder="请输入标题"
></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSearch">查询</el-button>
<el-button type="primary" @click="addHandle">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table-wrapper">
<table-template
:tableData="tableData"
:tableColumns="tableColumns"
:loading="loading"
:pagination="pagination"
@Jump="jumpPage"
>
<el-table-column slot="iconUrl" label="图标" align="center">
<template slot-scope="scope">
<el-image
style="width: 30px; height: 30px"
:src="scope.row.iconUrl"
:preview-src-list="[scope.row.iconUrl]"
>
</el-image>
</template>
</el-table-column>
<el-table-column slot="delFlag" label="启用状态" align="center">
<template slot-scope="scope">
<el-tag
v-if="scope.row.delFlag == 0 || scope.row.delFlag == 1"
:type="
scope.row.delFlag == 1
? 'danger'
: scope.row.delFlag == 0
? 'success'
: ''
"
>{{ scope.row.delFlag == 1 ? "禁用" : "启用" }}</el-tag
>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" width="300" align="center">
<template slot-scope="scope">
<el-button type="primary" size="mini" round @click="view(scope.row)"
>查看</el-button
>
<el-button
type="primary"
size="mini"
class="btn"
round
@click="edit(scope.row)"
>编辑</el-button
>
<el-button
@click="delFlagHandle(scope.row)"
:type="scope.row.delFlag == 0 ? 'warning' : 'success'"
size="mini"
round
slot="reference"
>{{ scope.row.delFlag == 0 ? "禁用" : "启用" }}
</el-button>
</template>
</el-table-column>
</table-template>
</div>
<el-dialog
:title="type == 'add' ? '新增' : '编辑'"
:visible.sync="dialogVisible"
width="30%"
>
<el-form
:model="dataForm"
:rules="rules"
ref="ruleForm"
label-width="100px"
class="demo-ruleForm"
>
<el-form-item label="标题" prop="title">
<el-input v-model="dataForm.title" clearable></el-input>
</el-form-item>
<el-form-item label="简介" prop="description">
<el-input
v-model="dataForm.description"
clearable
type="textarea"
></el-input>
</el-form-item>
<el-form-item label="排序" prop="sort">
<el-input-number v-model="dataForm.sort" :min="1"></el-input-number>
</el-form-item>
<el-form-item label="图标" prop="iconUrl">
<el-upload
class="avatar-uploader"
:show-file-list="false"
action="#"
:http-request="upload"
>
<img
v-if="dataForm.iconUrl"
:src="dataForm.iconUrl"
class="avatar"
/>
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="confirmHandle">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import {
instructList,
instructAdd,
instructEdit,
instructEnable,
} from "@/api/instructions";
import TableTemplate from "@/components/Table";
import { iconUpload } from "@/api/livingCircle";
export default {
name: "instructions",
components: { TableTemplate },
data() {
return {
type: "add",
searchForm: {
title: "",
},
tableData: [],
pagination: {
total: 0,
pageSize: 10,
currentPage: 1,
},
tableColumns: [
{
key: "title",
label: "标题",
},
{
key: "description",
label: "简介",
},
{
key: "iconUrl",
label: "图标",
type: "slot",
},
{
key: "sort",
label: "排序",
},
{
key: "delFlag",
label: "启用状态",
type: "slot",
},
{
key: "createTime",
label: "创建时间",
},
],
loading: false,
rules: {
title: [{ required: true, message: "请输入标题", trigger: "blur" }],
sort: [{ required: true, message: "请输入排序", trigger: "blur" }],
description: [
{ required: true, message: "请输入简介", trigger: "blur" },
],
iconUrl: [
{ required: true, message: "请输入类型图标", trigger: "blur" },
],
},
dataForm: {
title: "",
sort: 1,
iconUrl: "",
description: "",
id: "",
},
dialogVisible: false,
};
},
mounted() {
this.init();
},
watch: {
dialogVisible(val) {
if (!val) {
this.dataForm = {
title: "",
sort: "",
iconUrl: "",
description: "",
id: "",
};
}
},
},
methods: {
init() {
this.loading = true;
instructList({
...this.searchForm,
pageNum: this.pagination.currentPage,
pageSize: this.pagination.pageSize,
})
.then((res) => {
if (res.code == 200) {
this.tableData = res.data.list;
this.pagination.total = res.data.total;
}
})
.finally(() => {
this.loading = false;
});
},
jumpPage() {
this.init();
},
onSearch() {
this.pagination.currentPage = 1;
this.init();
},
addHandle() {
this.type = "add";
this.dialogVisible = true;
},
upload(file) {
iconUpload(file.file).then((res) => {
if (res.code == 200) {
this.dataForm.iconUrl = res.data;
this.$message.success("上传成功");
} else {
this.$message.warning(res.msg || "上传失败");
}
});
},
confirmHandle() {
this.$refs.ruleForm.validate((valid) => {
if (valid) {
if (this.type == "add") {
delete this.dataForm.id;
instructAdd(this.dataForm).then((res) => {
if (res.code == 200) {
this.$message.success("新增成功");
this.init();
this.dialogVisible = false;
} else {
this.$message.warning(res.msg || "新增失败");
}
});
} else {
// 编辑
instructEdit(this.dataForm).then((res) => {
if (res.code == 200) {
this.$message.success("编辑成功");
this.init();
this.dialogVisible = false;
} else {
this.$message.warning(res.msg || "编辑失败");
}
});
}
} else {
return false;
}
});
},
delFlagHandle(row) {
instructEnable(row.id).then((res) => {
if (res.code == 200) {
this.$message.success("操作成功");
this.init();
} else {
this.$message.warning(res.msg || "操作失败");
}
});
},
edit(row) {
this.type = "edit";
this.dialogVisible = true;
this.dataForm.sort = row.sort;
this.dataForm.title = row.title;
this.dataForm.iconUrl = row.iconUrl;
this.dataForm.description = row.description;
this.dataForm.id = row.id;
},
view(row) {
this.$router.push("/instructions/detail?id=" + row.id);
},
},
};
</script>
<style scoped></style>
<style>
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 150px;
height: 150px;
line-height: 150px;
text-align: center;
}
.avatar {
width: 150px;
height: 150px;
display: block;
}
</style>
src/views/livingCircle/category.vue
......@@ -33,7 +33,7 @@
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">查询</el-button>
<el-button type="primary" @click="onSearch">查询</el-button>
<el-button type="primary" @click="addHandle">新增</el-button>
</el-form-item>
</el-form>
......@@ -293,7 +293,8 @@ export default {
}
});
},
onSubmit() {
onSearch() {
this.pagination.currentPage = 1;
this.init();
},
jumpPage() {
......
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