From 368096e3b5e0b7ee16fc549db38b22bb866c9ed7 Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: 星期五, 21 六月 2024 15:00:39 +0800
Subject: [PATCH] 提交
---
src/views/onlineEducation/systemManage/banner/index.vue | 22 ++
src/views/onlineEducation/systemManage/courseClassification/index.vue | 113 +++++++++++++++-
src/layout/components/AppMain.vue | 2
src/api/onlineEducation/courseClass.js | 42 ++++++
src/views/onlineEducation/systemManage/company/index.vue | 2
src/views/onlineEducation/systemManage/banner/components/bannerDialog.vue | 10
src/router/index.js | 12 +
src/views/onlineEducation/systemManage/banner/components/newPage.vue | 20 ++
src/views/onlineEducation/systemManage/courseClassification/components/courseClassDialog.vue | 175 +++++++++++++++++++++++++
9 files changed, 382 insertions(+), 16 deletions(-)
diff --git a/src/api/onlineEducation/courseClass.js b/src/api/onlineEducation/courseClass.js
new file mode 100644
index 0000000..936817f
--- /dev/null
+++ b/src/api/onlineEducation/courseClass.js
@@ -0,0 +1,42 @@
+import request from "@/utils/request";
+
+export function getClassification(params) {
+ return request({
+ url: '/system/category/list',
+ method: 'get',
+ params: params
+ })
+}
+
+export function addClassification(data) {
+ return request({
+ url: '/system/category',
+ method: 'post',
+ data: data
+ })
+}
+
+export function editClassification(params) {
+ return request({
+ url: `/system/category`,
+ method: 'put',
+ data: params
+ })
+}
+
+
+
+export function checkClassName(data) {
+ return request({
+ url: 'system/category/checkNameUnique',
+ method: 'post',
+ data: data
+ })
+}
+
+export function delClassification(data) {
+ return request({
+ url: `/system/category/` + data,
+ method: 'delete'
+ })
+}
diff --git a/src/layout/components/AppMain.vue b/src/layout/components/AppMain.vue
index dc114e2..1f9e595 100644
--- a/src/layout/components/AppMain.vue
+++ b/src/layout/components/AppMain.vue
@@ -21,7 +21,7 @@
<style lang="scss" scoped>
.app-main {
/* 50= navbar 50 */
- min-height: calc(100vh - 50px);
+ min-height: calc(100vh - 60px);
width: 100%;
position: relative;
overflow: hidden;
diff --git a/src/router/index.js b/src/router/index.js
index 575203d..d650ebd 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -67,6 +67,18 @@
// ]
// },
{
+ path: '/newPage',
+ component: Layout,
+ redirect: '/newPage',
+ children: [
+ {
+ path: '/newPage',
+ component: () => import('@/views/onlineEducation/systemManage/banner/components/newPage.vue'),
+ name: 'NewPage',
+ }
+ ]
+ },
+ {
path: '/course',
component: Layout,
redirect: '/course',
diff --git a/src/views/onlineEducation/systemManage/banner/components/bannerDialog.vue b/src/views/onlineEducation/systemManage/banner/components/bannerDialog.vue
index 7603368..b95c4cf 100644
--- a/src/views/onlineEducation/systemManage/banner/components/bannerDialog.vue
+++ b/src/views/onlineEducation/systemManage/banner/components/bannerDialog.vue
@@ -27,9 +27,9 @@
<el-radio :label="1">内部打开</el-radio>
</el-radio-group>
</el-form-item>
- <el-form-item label="排序:" prop="sort" >
- <el-input-number v-model="state.form.sort" />
- </el-form-item>
+<!-- <el-form-item label="排序:" prop="sort" >-->
+<!-- <el-input-number v-model="state.form.sort" />-->
+<!-- </el-form-item>-->
<el-form-item label="状态" prop="status" >
<el-switch
v-model="state.form.status"
@@ -72,7 +72,7 @@
imgUrl: '',
webUrl: '',
carouselTarget: 0,
- sort: 0,
+ // sort: 0,
status: true,
},
formRules:{
@@ -213,7 +213,7 @@
imgUrl: '',
webUrl: '',
carouselTarget: 0,
- sort: 0,
+ // sort: 0,
status: true,
}
state.imgList = []
diff --git a/src/views/onlineEducation/systemManage/banner/components/newPage.vue b/src/views/onlineEducation/systemManage/banner/components/newPage.vue
new file mode 100644
index 0000000..d0ecd77
--- /dev/null
+++ b/src/views/onlineEducation/systemManage/banner/components/newPage.vue
@@ -0,0 +1,20 @@
+<template>
+ <div class="notice">
+ <iframe name="bottom" :src="state.url" style="width: 100%; height: 850px;margin-top: 6px;border: lightgrey 1px solid"></iframe>
+ </div>
+</template>
+<script setup>
+import {onMounted, reactive, ref, toRefs} from 'vue'
+const route = useRoute();
+const state = reactive({
+ url:''
+})
+
+onMounted(()=>{
+ state.url = route.query.url;
+})
+</script>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/views/onlineEducation/systemManage/banner/index.vue b/src/views/onlineEducation/systemManage/banner/index.vue
index bd41546..2dc5f4b 100644
--- a/src/views/onlineEducation/systemManage/banner/index.vue
+++ b/src/views/onlineEducation/systemManage/banner/index.vue
@@ -29,13 +29,17 @@
</div>
</template>
</el-table-column>
- <el-table-column label="地址" prop="webUrl" align="center" />
+ <el-table-column label="地址" prop="webUrl" align="center" >
+ <template #default="scope">
+ <span style="color:#1890ff; cursor: pointer" @click="openUrl(scope.row)">{{scope.row.webUrl}}</span>
+ </template>
+ </el-table-column>
<el-table-column label="跳转方式" prop="carouselTarget" align="center" >
<template #default="scope">
<span>{{scope.row.carouselTarget == 0 ? '新窗口打开' : '内部打开' }}</span>
</template>
</el-table-column>
- <el-table-column label="排序" prop="sort" align="center"/>
+<!-- <el-table-column label="排序" prop="sort" align="center"/>-->
<el-table-column label="状态" prop="status" align="center" width="150"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
<template #default="scope">
@@ -62,6 +66,7 @@
import {delCompany, getCompany} from "@/api/onlineEducation/company";
import bannerDialog from './components/bannerDialog.vue'
import {delBanner, getBanner} from "@/api/onlineEducation/banner";
+import router from "@/router";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const dialogRef = ref();
@@ -131,4 +136,17 @@
})
}
+const openUrl = (val) => {
+ let fixedUrl = '';
+ if(val.webUrl.indexOf("http") != -1){
+ fixedUrl = val.webUrl
+ }else{
+ fixedUrl = "http://" +val.webUrl;
+ }
+ if(val.carouselTarget == 0){
+ window.open(fixedUrl, '_blank')
+ }else {
+ router.push({ path: "/newPage", query: { url: fixedUrl } });
+ }
+}
</script>
diff --git a/src/views/onlineEducation/systemManage/company/index.vue b/src/views/onlineEducation/systemManage/company/index.vue
index c21e81c..abdef60 100644
--- a/src/views/onlineEducation/systemManage/company/index.vue
+++ b/src/views/onlineEducation/systemManage/company/index.vue
@@ -23,7 +23,7 @@
<el-button link type="primary">查看详情</el-button>
</template>
</el-table-column>
- <el-table-column label="操作" align="center" class-name="small-padding fixed-width" >
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200" >
<template #default="scope">
<el-button link type="primary" @click="openDialog('distribute',scope.row)">分配课时</el-button>
<el-button link type="primary" @click="openDialog('edit',scope.row)">编辑</el-button>
diff --git a/src/views/onlineEducation/systemManage/courseClassification/components/courseClassDialog.vue b/src/views/onlineEducation/systemManage/courseClassification/components/courseClassDialog.vue
new file mode 100644
index 0000000..51901ac
--- /dev/null
+++ b/src/views/onlineEducation/systemManage/courseClassification/components/courseClassDialog.vue
@@ -0,0 +1,175 @@
+<template>
+ <div class="notice">
+ <el-dialog
+ v-model="dialogVisible"
+ :title="title"
+ width="500px"
+ :before-close="handleClose"
+ >
+ <el-form :model="state.form" size="default" ref="busRef" :rules="state.formRules" label-width="150px" >
+ <el-form-item label="名称:" prop="name">
+ <el-input v-model.trim="state.form.name"></el-input>
+ </el-form-item>
+ <el-form-item label="排序:" prop="sort" >
+ <el-input-number v-model="state.form.sort" />
+ </el-form-item>
+ <el-form-item label="状态" prop="status" >
+ <el-switch
+ v-model="state.form.status"
+ class="ml-2"
+ />
+ </el-form-item>
+ </el-form>
+ <template #footer>
+ <span class="dialog-footer">
+ <el-button @click="handleClose" size="default">取 消</el-button>
+ <el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button>
+ </span>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+<script setup>
+import {reactive, ref, toRefs} from 'vue'
+import Editor from "@/components/Editor/index.vue";
+import {ElMessage} from "element-plus";
+import {addNotice} from "@/api/backManage/notice";
+import {addDict, editDict, getDictDetail} from "@/api/backManage/evaluate";
+import {addCompany, checkName, distributeCompany, editCompany} from "@/api/onlineEducation/company";
+import {verifyPhone} from "@/utils/validate";
+import {addClassification, checkClassName, editClassification} from "@/api/onlineEducation/courseClass";
+
+const dialogVisible = ref(false);
+const title = ref("");
+const busRef = ref();
+const length = ref()
+const emit = defineEmits(["getList"]);
+const startUsername = ref('');
+
+const validateName = (rule, value, callback)=>{
+ if(value === ''){
+ callback(new Error('请输入课程分类名称'))
+ }else if(title.value === '编辑' && value === startUsername.value){
+ callback()
+ }else{
+ let param = {}
+ if(title.value === '新增') {
+ param = {
+ name:value
+ }
+ }else if(title.value === '编辑'){
+ param = {
+ name:value,
+ id: state.form.id
+ }
+ }
+ checkClassName(param).then((res)=>{
+ if(res.data == false){
+ callback(new Error('课程分类名称已被占用，请更换其他名称'))
+ }else{
+ callback()
+ }
+ })
+ }
+}
+const state = reactive({
+ form: {
+ id: '',
+ name: '',
+ sort: 0,
+ parentId: null,
+ status: true
+ },
+ formRules:{
+ name: [{ required: true, trigger: "blur", validator: validateName }],
+ },
+})
+
+
+const openDialog = async (type, value) => {
+ length.value = value.listLength
+ title.value = type === 'addFirst' || type === 'add' ? '新增' : type ==='edit' ? '编辑' : '' ;
+ if(type === 'edit') {
+ state.form = value;
+ state.form.status = value.status == 0;
+ state.form.sort = value.sort;
+ startUsername.value = value.username;
+ }else if(type === 'add' && value ){
+ state.form.parentId = value.id
+ }
+ dialogVisible.value = true;
+}
+
+const onSubmit = async () => {
+ const valid = await busRef.value.validate();
+ if(valid){
+ if(title.value === '新增'){
+ const {id, ...data} = JSON.parse(JSON.stringify(state.form))
+ data.status = data.status ? 0 : 1
+ const res = await addClassification(data)
+ if(res.code === 200){
+ ElMessage({
+ type: 'success',
+ message: '新增成功'
+ });
+ }else{
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ busRef.value.clearValidate();
+ reset();
+ dialogVisible.value = false;
+ }else if(title.value === '编辑'){
+ const {...data} = JSON.parse(JSON.stringify(state.form))
+ data.status = data.status ? 0 : 1
+ const res = await editClassification(data)
+ if(res.code === 200){
+ ElMessage({
+ type: 'success',
+ message: '编辑成功'
+ });
+ }else{
+ ElMessage.warning(res.message)
+ }
+ emit("getList")
+ busRef.value.clearValidate();
+ reset();
+ dialogVisible.value = false;
+ }
+ }
+}
+
+const handleClose = () => {
+ busRef.value.clearValidate();
+ reset();
+ dialogVisible.value = false;
+ emit("getList")
+
+}
+const reset = () => {
+ state.form = {
+ id: '',
+ name: '',
+ sort: 0,
+ parentId: null,
+ status: true
+ }
+}
+defineExpose({
+ openDialog
+});
+
+</script>
+
+<style scoped lang="scss">
+.notice{
+ :deep(.el-form .el-form-item__label) {
+ font-size: 15px;
+ }
+ .file {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ }
+}
+</style>
diff --git a/src/views/onlineEducation/systemManage/courseClassification/index.vue b/src/views/onlineEducation/systemManage/courseClassification/index.vue
index d868c47..3f76fc7 100644
--- a/src/views/onlineEducation/systemManage/courseClassification/index.vue
+++ b/src/views/onlineEducation/systemManage/courseClassification/index.vue
@@ -1,12 +1,111 @@
<template>
-<div>课程分类</div>
+ <div class="app-container">
+ <div style="margin-bottom: 10px">
+ <el-form>
+ <el-form-item label="分类名称">
+ <el-input style="width: 20%" v-model="data.queryParams.name "></el-input>
+ <el-button type="primary" style="margin-left: 30px" @click="getList">查询</el-button>
+ <el-button plain @click="reset">重置</el-button>
+ <el-button type="success" plain @click="openDialog('addFirst',{})">添加</el-button>
+ </el-form-item>
+
+ </el-form>
+ </div>
+ <!-- 表格数据 -->
+ <el-table v-loading="loading" :data="dataList" :border="true" row-key="id">
+ <el-table-column label="序号" type="index" align="center" width="80" />
+ <el-table-column label="名称" >
+ <template #default="scope">
+ <span>{{scope.row.name}}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="排序" prop="sort" align="center" width="80" />
+ <el-table-column label="状态" prop="status" align="center" width="80">
+ <template #default="scope">
+ <span>{{scope.row.status ==0 ? '正常' : '停用'}}</span>
+ </template>
+ </el-table-column>
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="250" >
+ <template #default="scope">
+ <el-button type="success" plain @click="openDialog('add',scope.row)">添加</el-button>
+ <el-button type="primary" plain @click="openDialog('edit',scope.row)">编辑</el-button>
+ <el-button type="danger" plain @click="handleDelete(scope.row.id)">删除</el-button>
+ </template>
+ </el-table-column>
+ </el-table>
+ <class-dialog ref="areaRef" @getList="getList"></class-dialog>
+ </div>
</template>
+
<script setup>
+import {getCurrentInstance, onMounted, reactive, ref, toRefs} from "vue";
+import {ElMessage, ElMessageBox} from "element-plus";
+import classDialog from "./components/courseClassDialog.vue"
+import {delArea, getArea} from "@/api/backManage/area";
+import {getDictList} from "@/api/backManage/evaluate";
+import {delMonitor} from "@/api/sysUsers";
+import {delClassification, getClassification} from "@/api/onlineEducation/courseClass";
+const { proxy } = getCurrentInstance();
+const loading = ref(false);
+const areaRef = ref();
+const cityList = ref([])
+const data = reactive({
+ queryParams: {
+ name: '',
+ pageNum: 1,
+ pageSize: 10,
+ },
+ total: 0,
+ dataList: [
+ ]
+});
+
+const { queryParams, total, dataList } = toRefs(data);
+
+//页面加载
+onMounted(() => {
+ getList();
+});
+const getList = async () => {
+ loading.value = true;
+ const res = await getClassification(data.queryParams);
+ if(res.code === 200){
+ dataList.value = res.data
+ }else{
+ ElMessage.warning(res.message)
+ }
+ loading.value = false;
+}
+
+const openDialog = (type, value) => {
+ areaRef.value.openDialog(type, value);
+}
+
+/** 重置新增的表单以及其他数据 */
+function reset() {
+ data.queryParams.name = '';
+ data.queryParams.pageNum = 1;
+ getList();
+}
+const handleDelete = (val) => {
+ ElMessageBox.confirm(
+ '确定删除此条数据？',
+ '提示',
+ {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消',
+ type: 'warning',
+ })
+ .then( async() => {
+ const res = await delClassification(val)
+ if(res.code == 200){
+ ElMessage.success('数据删除成功')
+ await getList()
+ }else{
+ ElMessage.warning(res.message)
+ }
+ })
+}
+
</script>
-
-
-
-<style scoped lang="scss">
-
-</style>
--
Gitblit v1.9.2