Merge branch 'develoop' of http://182.92.169.222:3000/dlsx/Teaching_integration_platform_admin_template into develoop

3 months ago · 7c7022eb68
parent 6d4f53c925 3b536e0cad
commit 7c7022eb68
6 changed files with 330 additions and 64 deletions
--- a/.env.development
+++ b/.env.development
@ -9,7 +9,7 @@ VITE_APP_BASE_API = 'http://39.106.16.162:8080'
 http://localhost:5173/#/courseResourcesManagement/courseResources
 >>>>>>> b0c11f6676b1ee245db7ea30ff02485e14c91a32
 =======
-VITE_APP_BASE_API = 'http://127.0.0.1:8080'
-# VITE_APP_BASE_API = 'http://39.106.16.162:8080'
+# VITE_APP_BASE_API = 'http://127.0.0.1:8080'
+VITE_APP_BASE_API = 'http://39.106.16.162:8080'
 http://localhost:5173/#/courseResourcesManagement/courseResources
 >>>>>>> 72be77b12b37cb07a7dd807572ca24163c368ce0
--- a/src/api/user/news.js
+++ b/src/api/user/news.js
@ -23,3 +23,20 @@ export function addCategory(params) {
    const str =  parseParams(params)
    return request.post(`/api/cms-category/add${str}`);
 }
+//查询新闻文章
+export function queryEssay(category_id) {
+    return request.get(`/api/cms-essay/query?category_id=${category_id}`);
+}
+//添加新闻文章
+export function addEssay(params){
+    const str = parseParams(params)
+    return request.post(`/api/cms-essay/add${str}`)
+}
+//删除新闻
+export function deleteEssay(ids) {
+    return request.delete(`/api/cms-essay/delete?ids=${ids}`);
+}
+//修改新闻
+export function editEssay(params) {
+    return request.put(`/api/cms-essay/edit`, params);
+}
--- a/src/router/routers.ts
+++ b/src/router/routers.ts
@ -259,13 +259,13 @@ export const constantRoute: any = [
        }
      },
      {
-        path: '/newsDetails',
-        component: () => import('@/views/news/components/newsContent.vue'),
-        name: 'NewsDetails',
+        path: '/news/newsContentDetails',
+        component:()=>import('@/views/news/components/newsContentDetails.vue'),
+        name:'NewsContentDetails',
        meta: {
-          title: '新闻详情',
+          title: '栏目添加新闻信息',
          hidden: true,
-          icon: ''
+          icon: 'Promotion'
        },
      },
    ]
--- a/src/views/news/components/newsContent.vue
+++ b/src/views/news/components/newsContent.vue
@ -1,11 +0,0 @@
-<template>
-
-</template>
-
-<script>
-
-</script>
-
-<style scoped>
-
-</style>
--- a/src/views/news/components/newsContentDetails.vue
+++ b/src/views/news/components/newsContentDetails.vue
@ -0,0 +1,37 @@
+<template>
+  <el-card class="container">
+    <template #header>
+      <div class="card-header">
+        <span>栏目添加新闻信息</span>
+        <el-button type="primary" @click="back" plain round>返回</el-button>
+      </div>
+    </template>
+    <p v-for="o in 4" :key="o" class="text item">{{ 'List item ' + o }}</p>
+    <template #footer>Footer content</template>
+  </el-card>
+</template>
+
+<script setup lang="ts">
+import {useRouter} from "vue-router";
+const router = useRouter();
+const back = ()=>{
+  router.push('/news/newsContent')
+}
+</script>
+
+<style scoped>
+.container{
+  width: 80%;
+  margin: auto;
+}
+.card-header {
+  display: flex; /* 使用 Flexbox */
+  justify-content: space-between; /* 主轴上平均分配剩余空间 */
+  align-items: center; /* 交叉轴上居中对齐 */
+}
+
+.card-header span {
+  flex: 1; /* 使 span 占用可用空间，实现居中效果 */
+  text-align: center; /* 文本居中 */
+}
+</style>
--- a/src/views/news/index.vue
+++ b/src/views/news/index.vue
@ -8,20 +8,28 @@
        <ul class="header-list">
          <li v-for="item in column">
            <el-dropdown placement="bottom">
-              <span>{{ item.categoryName }}</span> <!-- 使用span代替p -->
+              <span @mouseenter="EssayList(item.id)">{{ item.categoryName }}</span> <!-- 使用span代替p -->
              <template #dropdown>
                <el-dropdown-menu>
                  <el-dropdown-item>
-                    <router-link to="/newsDetails">{{ item.createTime }}</router-link>
+                      <ul>
+                        <li class="flex-container" @click="newViews(listObject)" v-for="listObject in essay" style="margin-bottom: 15px">
+                          <p >{{listObject.title}}</p>
+                          <el-button type="danger" @click.stop="deleteNewsList(listObject.id)" round>删除</el-button>
+                          <el-button type="primary" @click.stop="editNewsDialogFormVisible = true; newViews(listObject)" round>编辑</el-button>
+                        </li>
+                      </ul>
                  </el-dropdown-item>
+                  <div class="add-news-button">
+                    <el-button @click="addNewsDialogFormVisibleButton(item.id)" type="primary" plain round>添加当前栏目新闻</el-button>
+                  </div>
                </el-dropdown-menu>
              </template>
            </el-dropdown>
          </li>
        </ul>
        <div>
-          <el-link href="https://element-plus.org" target="_blank"  style="margin-right: 30px;font-size: 19px">关于我们</el-link>
-          <el-button name="editColumnButton" @click="editHandle" round>栏目编辑</el-button>
+          <el-button name="editColumnButton" @click="editHandle" round>栏目管理</el-button>
        </div>
      </div>
    </el-card>
@ -38,7 +46,7 @@
            操作
          </template>
          <template #default="{row}">
-            <!-- 在这里定义你的删除按钮 -->
+            <!-- 删除按钮 -->
            <el-button size="default" type="danger" @click="deleteHandle(row.id)">删除</el-button>
          </template>
        </el-table-column>
@ -54,24 +62,24 @@
      <el-form-item label="栏目父id" label-width="140px">
        <el-input v-model="form.categoryPid" autocomplete="off" />
      </el-form-item>
-      <el-form-item label="创建时间" label-width="140px">
-        <el-input v-model="form.createTime" autocomplete="off" type="date"/>
-      </el-form-item>
-      <el-form-item label="创建盖栏目的用户id" label-width="140px">
-        <el-input v-model="form.creatorId" autocomplete="off" />
-      </el-form-item>
-      <el-form-item label="栏目id" label-width="140px">
-        <el-input v-model="form.id" autocomplete="off" />
+<!--      <el-form-item label="创建时间" label-width="140px">-->
+<!--        <el-input v-model="form.createTime" autocomplete="off" type="date"/>-->
+<!--      </el-form-item>-->
+      <el-form-item label="创建该栏目的用户id" label-width="140px">
+        <el-input v-model="form.creatorId" autocomplete="off" readonly disabled/>
      </el-form-item>
+<!--      <el-form-item label="栏目id" label-width="140px">-->
+<!--        <el-input v-model="form.id" autocomplete="off" />-->
+<!--      </el-form-item>-->
      <el-form-item label="排序" label-width="140px">
        <el-input v-model="form.sort" autocomplete="off" />
      </el-form-item>
      <el-form-item label="是否显示" label-width="140px">
        <el-input v-model="form.status" autocomplete="off" />
      </el-form-item>
-      <el-form-item label="更新时间" label-width="140px">
-        <el-input v-model="form.updateTime" autocomplete="off" type="date"/>
-      </el-form-item>
+<!--      <el-form-item label="更新时间" label-width="140px">-->
+<!--        <el-input v-model="form.updateTime" autocomplete="off" type="date"/>-->
+<!--      </el-form-item>-->
    </el-form>
    <template #footer>
      <div class="dialog-footer">
@ -86,48 +94,186 @@
  <el-card class="container">
    <template #header>
      <div class="card-header">
-        <span class="contentTitle">Content Title</span>
+        <span class="contentTitle">{{nowTimeNewsData.title}}</span>
        <el-card shadow="hover">
-          <div class="flex-container">
-            <p>发布人：{{  }}</p>
-            <p>信息来源：{{  }}</p>
-            <p>日期：{{  }}</p>
+          <div class="news-flex-container">
+            <p>发布人：{{ nowTimeNewsData.userId }}</p>
+            <p>阅读数量：{{ nowTimeNewsData.readingNumber }}</p>
+            <p>发布日期：{{ nowTimeNewsData.publishTime }}</p>
+            <p>更新时间：{{nowTimeNewsData.updateTime}}</p>
          </div>
        </el-card>
      </div>
    </template>
    <div style="text-align: center">
-      <router-view></router-view>
+      <el-input
+          v-model="nowTimeNewsData.content"
+          style="width: 80%;font-size: 20px"
+          :rows="15"
+          type="textarea"
+          placeholder="Please input"
+      />
    </div>
    <template #footer>
-
+      <div style="text-align: center">
+        <el-link href="https://element-plus.org" target="_blank"  style="margin-right: 30px;font-size: 19px">关于我们</el-link>
+      </div>
    </template>
  </el-card>
+<!--  栏目内添加新闻-->
+  <el-dialog v-model="addNewsDialogFormVisible" title="添加新闻" width="500px">
+    <el-form v-model="newsForm">
+      <el-form-item label="所属栏目id" label-width="140px">
+        <el-input v-model="newsForm.categoryId" autocomplete="off" readonly disabled/>
+      </el-form-item>
+      <el-form-item label="文章内容" label-width="140px">
+        <el-input v-model="newsForm.content" autocomplete="off" />
+      </el-form-item>
+<!--      <el-form-item label="文章文件" label-width="140px">-->
+<!--        <el-input v-model="newsForm.file" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="文章id" label-width="140px">-->
+<!--        <el-input v-model="newsForm.id" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="标题图片" label-width="140px">-->
+<!--        <el-input v-model="newsForm.pic" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="发布时间" label-width="140px">-->
+<!--        <el-input v-model="newsForm.publishTime" autocomplete="off"  type="date"/>-->
+<!--      </el-form-item>-->
+      <el-form-item label="浏览次数" label-width="140px">
+        <el-input v-model="newsForm.readingNumber" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="发布状态" label-width="140px">
+        <el-input v-model="newsForm.status" placeholder="1:已发布 2:未发布" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="文章标题" label-width="140px">
+        <el-input v-model="newsForm.title" autocomplete="off" />
+      </el-form-item>
+<!--      <el-form-item label="更新时间" label-width="140px">-->
+<!--        <el-input v-model="newsForm.updateTime" autocomplete="off"  type="date"/>-->
+<!--      </el-form-item>-->
+      <el-form-item label="发布文章的用户id" label-width="140px">
+        <el-input v-model="newsForm.userId" autocomplete="off" readonly disabled/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="addNewsDialogFormVisible = false">取消</el-button>
+        <el-button type="primary" @click="addNewsContentConfirm">
+          提交
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
+  <!--  修改新闻-->
+  <el-dialog v-model="editNewsDialogFormVisible" title="修改新闻" width="500px">
+    <el-form v-model="nowTimeNewsData">
+      <el-form-item label="所属栏目id" label-width="140px">
+        <el-input v-model="nowTimeNewsData.categoryId" autocomplete="off" readonly disabled/>
+      </el-form-item>
+      <el-form-item label="文章内容" label-width="140px">
+        <el-input v-model="nowTimeNewsData.content" autocomplete="off" />
+      </el-form-item>
+<!--      <el-form-item label="文章文件" label-width="140px">-->
+<!--        <el-input v-model="nowTimeNewsData.file" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="文章id" label-width="140px">-->
+<!--        <el-input v-model="nowTimeNewsData.id" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="标题图片" label-width="140px">-->
+<!--        <el-input v-model="nowTimeNewsData.pic" autocomplete="off" />-->
+<!--      </el-form-item>-->
+<!--      <el-form-item label="发布时间" label-width="140px">-->
+<!--        <el-input v-model="nowTimeNewsData.publishTime" autocomplete="off"  type="date"/>-->
+<!--      </el-form-item>-->
+      <el-form-item label="浏览次数" label-width="140px">
+        <el-input v-model="nowTimeNewsData.readingNumber" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="发布状态" label-width="140px">
+        <el-input v-model="nowTimeNewsData.status" placeholder="1:已发布 2:未发布" autocomplete="off" />
+      </el-form-item>
+      <el-form-item label="文章标题" label-width="140px">
+        <el-input v-model="nowTimeNewsData.title" autocomplete="off" />
+      </el-form-item>
+<!--      <el-form-item label="更新时间" label-width="140px">-->
+<!--        <el-input v-model="nowTimeNewsData.updateTime" autocomplete="off"  type="date"/>-->
+<!--      </el-form-item>-->
+      <el-form-item label="发布文章的用户id" label-width="140px">
+        <el-input v-model="nowTimeNewsData.userId" autocomplete="off" readonly disabled/>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="addNewsDialogFormVisible = false">取消</el-button>
+        <el-button type="primary" @click="editNewsContentConfirm">
+          提交
+        </el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>

 <script setup lang="ts">
-import {queryCategory,deleteCategory,addCategory} from "@/api/user/news.js"
-import {ref,onMounted} from 'vue';
-import { ElMessageBox, ElMessage } from 'element-plus'
+import {
+  queryCategory,
+  deleteCategory,
+  addCategory,
+  addEssay,
+  queryEssay,
+  deleteEssay,
+  editEssay
+} from "@/api/user/news.js"
+import {ref,reactive,onMounted} from 'vue';
+import {ElButton,ElDrawer, ElMessageBox, ElMessage} from 'element-plus'
+import useUserStore from "@/store/modules/user";
+const userStore = useUserStore()
 const drawer = ref(false)
 const addFormVisible = ref(false)
+//存取栏目信息
 const column  =ref([])
-const form = ref(
-    {
+//存取文章列表信息
+const essay = ref([])
+//存放获取当前添加栏目的id
+const columnId = ref()
+const addNewsDialogFormVisible = ref(false)
+const editNewsDialogFormVisible = ref(false)
+//添加当前新闻栏目按钮
+const addNewsDialogFormVisibleButton = (id)=>{
+  addNewsDialogFormVisible.value = true
+  columnId.value = id
+}
+const nowTimeNewsData = ref({})
+//新闻详细信息获取
+const newViews = (listObject)=> {
+  nowTimeNewsData.value = listObject
+}
+
+//栏目
+const form = ref({
      categoryName:'',
      categoryPid:'',
      createTime:'',
-      creatorId:'',
+      creatorId:userStore.userInfo.id,
      id:'',
      sort:'',
      status:'',
      updateTime:''
-    }
-)
-const params = ref({
-  categoryName:form.value.categoryName,
-  createTime:form.value.createTime,
-  id:form.value.id
+    })
+
+//新闻
+const newsForm = ref({
+      categoryId:columnId,
+      content:'',
+      file:'',
+      id:'',
+      pic:'',
+      publishTime:'',
+      readingNumber:'',
+      status:'',
+      title:'',
+      updateTime:'',
+      userId:userStore.userInfo.id,
 })
 //获取栏目信息
 const CategoryList = async () => {
@ -153,18 +299,23 @@ const addFormConfirm = async ()=>{
    id:form.value.id,
    sort:form.value.sort,
    status:form.value.status,
-    updateTime:form.value.updateTime
+    updateTime:form.value.updateTime,
+  }).then(()=>{
+    CategoryList()
+    ElMessage({
+      message:'添加成功',
+      type:'success'
+    })
  })
 }
 //栏目删除
-const deleteHandle = async (row)=>{
-  console.log(row,'row.id')
+const deleteHandle = async (id)=>{
  await ElMessageBox.confirm('您确定删除这条栏目信息吗', '温馨提示', {
    confirmButtonText: '确认',
    cancelButtonText: '取消',
    type: 'warning',
  })
-  await deleteCategory(row.id).then(() => {
+  await deleteCategory(id).then(() => {
    CategoryList() // 删除成功后重新获取列表数据以更新页面
    ElMessage({
      message: '删除成功',
@ -173,12 +324,65 @@ const deleteHandle = async (row)=>{
  })
  await CategoryList()
 }
+//新闻文章查询
+const EssayList = async (id)=>{
+  const ress = await queryEssay(id)
+  // console.log(ress.data,'ress')
+  essay.value = ress.data
+  // console.log(essay.value,'essay')
+}
+//新闻文章添加
+const addNewsContentConfirm = async ()=>{
+  addNewsDialogFormVisible.value = false
+  await addEssay({
+    categoryId:newsForm.value.categoryId,
+    content:newsForm.value.content,
+    // file:newsForm.value.file,
+    // id:newsForm.value.id,
+    // pic:newsForm.value.pic,
+    publishTime:newsForm.value.publishTime,
+    readingNumber:newsForm.value.readingNumber,
+    status:newsForm.value.status,
+    title:newsForm.value.title,
+    updateTime:newsForm.value.updateTime,
+    userId:newsForm.value.userId
+  })
+}
+//新闻删除
+const deleteNewsList = async (id)=>{
+// console.log(id)
+  await deleteEssay(id).then(() => {
+    EssayList(id) // 删除成功后重新获取列表数据以更新页面
+    ElMessage({
+      message: '删除成功',
+      type: 'success',
+    })
+  })
+}
+//新闻修改按钮
+const editNewsList=()=>{
+  editNewsDialogFormVisible.value = true
+}
+//修改后新闻提交
+const editNewsContentConfirm = async ()=>{
+  editNewsDialogFormVisible.value = false
+  await editEssay({
+    categoryId:nowTimeNewsData.value.categoryId,
+    content:nowTimeNewsData.value.content,
+    file:nowTimeNewsData.value.file,
+    id:nowTimeNewsData.value.id,
+    pic:nowTimeNewsData.value.pic,
+    publishTime:nowTimeNewsData.value.publishTime,
+    readingNumber:nowTimeNewsData.value.readingNumber,
+    status:nowTimeNewsData.value.status,
+    title:nowTimeNewsData.value.title,
+    updateTime:nowTimeNewsData.value.updateTime,
+    userId:nowTimeNewsData.value.userId
+  })
+}
 </script>

 <style scoped>
-.container{
-  height: 65vh;
-}
 .header_title{
  font-size: 30px;
  text-align: center;
@ -211,6 +415,11 @@ const deleteHandle = async (row)=>{
 .el-dropdown {
  margin-right: 30px;
 }
+.add-news-button {
+  margin-top: auto; /* 将按钮推到底部 */
+  text-align: center; /* 居中按钮 */
+  width: 100%;
+}
 .contentTitle{
  color: red;
  font-size: 30px;
@ -222,12 +431,26 @@ const deleteHandle = async (row)=>{
 }
 .flex-container {
  display: flex;
-  justify-content: center; /* 水平居中 */
-  align-items: center; /* 垂直居中*/
-  flex-direction: row; /* 默认就是 row， */
+  justify-content: space-between; /* 将内容平均分布，按钮自动靠右 */
+  align-items: center;
+  flex-direction: row;
+}
+
+.news-flex-container {
+  display: flex; /* 使用 Flexbox 布局 */
+  justify-content: space-between; /* 平均分配空间 */
+  align-items: center; /* 垂直居中对齐 */
+}
+.news-flex-container p {
+  flex: 1; /* 平均分配剩余空间 */
+  text-align: center; /* 文本居中显示 */
 }
 .flex-container p {
-  margin-right: 100px;
+  flex-grow: 1; /* 扩展剩余空间 */
+  margin-right: 10px; /* 添加一些右侧间距以避免按钮与文本直接接触 */
+}
+.flex-container .el-button {
+  margin-left: 20px; /* 将按钮推到最右侧 */
 }
 .flex-container p:last-child {
  margin-right: 0;