Browse Source

add new

master
sunfree 9 months ago
parent
commit
c267fa3f59
  1. 22
      src/api/admin.ts
  2. 22
      src/api/blog.ts
  3. 61
      src/components/blogs/ceshi.vue
  4. 55
      src/stores/index.ts
  5. 20
      src/views/admin/blogmange/BlogFormView.vue
  6. 57
      src/views/admin/classticmanage/ClassticManageView.vue

22
src/api/admin.ts

@ -0,0 +1,22 @@
// 博客管理
export interface blogInterface {
key: string,
blogtitle: string,
create_at: Date,
readnum: number,
readminite: number,
wordcount: number,
img: string,
blogcontent: string,
typename: string,
labelnames: string
}
// 语录管理
export interface classticInterface {
key:string,
id?:number,
header: string,
text: string,
descr: string
}

22
src/api/blog.ts

@ -1,22 +0,0 @@
// 博客管理
export interface blogInterface {
key: string,
blogtitle: string,
create_at: Date,
readnum: number,
readminite: number,
wordcount: number,
img: string,
blogcontent: string,
typename: string,
labelnames: string
}
// 语录管理
export interface classticInterface {
key:string,
id:number,
header: string,
text: string,
descr: string
}

61
src/components/blogs/ceshi.vue

@ -1,13 +1,58 @@
<template> <template>
<v-md-editor v-model="text" height="400px"></v-md-editor>
<a-form
:model="formState"
name="basic"
:label-col="{ span: 8 }"
:wrapper-col="{ span: 16 }"
autocomplete="off"
@finish="onFinish"
@finishFailed="onFinishFailed"
>
<a-form-item
label="Username"
name="username"
:rules="[{ required: true, message: 'Please input your username!' }]"
>
<a-input v-model:value="formState.username" />
</a-form-item>
<a-form-item
label="Password"
name="password"
:rules="[{ required: true, message: 'Please input your password!' }]"
>
<a-input-password v-model:value="formState.password" />
</a-form-item>
<a-form-item name="remember" :wrapper-col="{ offset: 8, span: 16 }">
<a-checkbox v-model:checked="formState.remember">Remember me</a-checkbox>
</a-form-item>
<a-form-item :wrapper-col="{ offset: 8, span: 16 }">
<a-button type="primary" html-type="submit">Submit</a-button>
</a-form-item>
</a-form>
</template> </template>
<script lang="ts" setup>
import { reactive } from 'vue';
interface FormState {
username: string;
password: string;
remember: boolean;
}
<script>
export default {
data() {
return {
text: `<h1 align="center">Markdown Editor built on Vue</h1>`,
};
},
const formState = reactive<FormState>({
username: '',
password: '',
remember: true,
});
const onFinish = (values: any) => {
console.log('Success:', values);
};
const onFinishFailed = (errorInfo: any) => {
console.log('Failed:', errorInfo);
}; };
</script> </script>

55
src/stores/index.ts

@ -1,15 +1,20 @@
import { reactive, ref } from 'vue' import { reactive, ref } from 'vue'
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { get } from "@/tools/request"
import { get, post, put } from "@/tools/request"
import dayjs from 'dayjs'; import dayjs from 'dayjs';
import { useRouter } from "vue-router" import { useRouter } from "vue-router"
import type { blogInterface,classticInterface } from '@/api/blog';
import type { blogInterface, classticInterface } from '@/api/admin';
const router = useRouter() const router = useRouter()
// 博客列表 // 博客列表
const bloglist = ref<blogInterface[]>([]) const bloglist = ref<blogInterface[]>([])
// 语录列表 // 语录列表
const classticlist = ref<classticInterface[]>([]) const classticlist = ref<classticInterface[]>([])
// 语录新增
const classticadd=reactive({
header:"",
text:"",
descr:""
})
export const useAuthStore = defineStore("auth", () => { export const useAuthStore = defineStore("auth", () => {
const tokenValue = ref("") const tokenValue = ref("")
@ -30,9 +35,9 @@ export const classticContentStore = defineStore("classtic", () => {
try { try {
const response = await get("/classtics/list"); const response = await get("/classtics/list");
if (response) { if (response) {
classticlist.value = response.data.data.map((item: any,index:any) => ({
key:(index+1).toString(),
id:item.id,
classticlist.value = response.data.data.map((item: any, index: any) => ({
key: (index + 1).toString(),
id: item.id,
header: item.header, header: item.header,
text: item.text, text: item.text,
descr: item.descr descr: item.descr
@ -46,35 +51,49 @@ export const classticContentStore = defineStore("classtic", () => {
} }
return { classticlist, classticList } return { classticlist, classticList }
}) })
export const classticSearchStore=defineStore("chassticsearch",()=>{
const searchValue=reactive({
title:""
// 语录查询接口
export const classticSearchStore = defineStore("chassticsearch", () => {
const searchValue = reactive({
title: ""
}) })
const classticSearch=async ()=>{
const classticSearch = async () => {
try { try {
const response=await get(
const response = await get(
"/classtics/list/search", "/classtics/list/search",
{header:searchValue.title}
{ header: searchValue.title }
) )
if (response) { if (response) {
classticlist.value=response.data.data.map((items:any,index:any)=>({
key:(index+1).toString(),
id:items.id,
classticlist.value = response.data.data.map((items: any, index: any) => ({
key: (index + 1).toString(),
id: items.id,
header: items.header, header: items.header,
text: items.text, text: items.text,
descr: items.descr descr: items.descr
})) }))
}else{
} else {
console.log("classtic request is nulll") console.log("classtic request is nulll")
} }
} catch (error) { } catch (error) {
console.log("classtic request is error") console.log("classtic request is error")
} }
} }
return {classticSearch,searchValue}
return { classticSearch, searchValue }
})
// 语录新增/编辑接口
export const classticAddStore=defineStore("classticadd",()=>{
const onSubmit=async ()=>{
await post("/classtics/add",
{
header:classticadd.header,
text:classticadd.text,
descr:classticadd.descr
}
)
}
return {onSubmit,classticadd}
}) })
// 链接接口 // 链接接口
export const comLinkContentStore = defineStore("comlink", () => { export const comLinkContentStore = defineStore("comlink", () => {
interface comlinkInterface { interface comlinkInterface {

20
src/views/admin/blogmange/BlogFormView.vue

@ -33,9 +33,8 @@ import { ref, onMounted, reactive } from 'vue';
import type { UnwrapRef } from 'vue'; import type { UnwrapRef } from 'vue';
import type { Rule } from 'ant-design-vue/es/form'; import type { Rule } from 'ant-design-vue/es/form';
import { post, get, put } from '@/tools/request'; import { post, get, put } from '@/tools/request';
import { useRouter, useRoute } from 'vue-router'
import { useRouter } from 'vue-router'
const router = useRouter() const router = useRouter()
const route = useRoute()
interface FormState { interface FormState {
id?: number; id?: number;
blogtitle: string; blogtitle: string;
@ -75,23 +74,6 @@ onMounted(async () => {
...items ...items
})) }))
}) })
const { id } = route.params
if (id) {
get(`/blogs/list/search/${id}`).then(response => {
const blog = response.data.data;
//
formState.id = blog.id;
formState.blogtitle = blog.blogtitle;
formState.typeid = blog.typeid;
formState.blogcontent = blog.blogcontent;
formState.descr = blog.descr;
// Vditor
console.log(blog.id)
if (blog.id) {
content.value=blog.blogcontent;
}
})
}
}); });
const onSubmit = () => { const onSubmit = () => {
formRef.value formRef.value

57
src/views/admin/classticmanage/ClassticManageView.vue

@ -8,19 +8,19 @@
<a-button @click="classticSearch.classticSearch">查询</a-button> <a-button @click="classticSearch.classticSearch">查询</a-button>
<a-button type="primary" ghost @click="modal('add')">新增</a-button> <a-button type="primary" ghost @click="modal('add')">新增</a-button>
<a-modal v-model:open="addModal.addOpen" ok-text="确认" cancel-text="取消" :title="addModal.addTitle" <a-modal v-model:open="addModal.addOpen" ok-text="确认" cancel-text="取消" :title="addModal.addTitle"
@ok="handleOk">
<a-form :model="formState" name="basic">
<a-form-item label="语录标题" name="classticname"
:rules="[{ required: true, message: '请输入语录标题' }]" v-bind="formItemLayout">
<a-input v-model:value="formState.name" />
@ok="classticAdd.onSubmit">
<a-form :model="classticAdd.classticadd" name="basic">
<a-form-item label="语录标题" name="classticname" :rules="[{ required: true, message: '请输入语录标题' }]"
v-bind="formItemLayout">
<a-input v-model:value="classticAdd.classticadd.header" />
</a-form-item> </a-form-item>
<a-form-item label="语录内容" name="classticcontent" <a-form-item label="语录内容" name="classticcontent"
:rules="[{ required: true, message: '请输入语录内容' }]" v-bind="formItemLayout"> :rules="[{ required: true, message: '请输入语录内容' }]" v-bind="formItemLayout">
<a-input v-model:value="formState.name" />
<a-input v-model:value="classticAdd.classticadd.text" />
</a-form-item> </a-form-item>
<a-form-item label="备注" name="classticdescr"
:rules="[{ message: '请输入备注' }]" v-bind="formItemLayout">
<a-textarea v-model:value="formState.name" />
<a-form-item label="备注" name="classticdescr" :rules="[{ message: '请输入备注' }]"
v-bind="formItemLayout">
<a-textarea v-model:value="classticAdd.classticadd.descr" />
</a-form-item> </a-form-item>
</a-form> </a-form>
</a-modal> </a-modal>
@ -52,12 +52,14 @@
import { ref, reactive, onMounted } from 'vue'; import { ref, reactive, onMounted } from 'vue';
import { useRouter } from "vue-router" import { useRouter } from "vue-router"
const router = useRouter() const router = useRouter()
import { classticContentStore,classticSearchStore } from "@/stores"
import { classticAddStore, classticContentStore, classticSearchStore } from "@/stores"
import { put, post } from "@/tools/request"
const classticContent = classticContentStore() const classticContent = classticContentStore()
const classticSearch=classticSearchStore()
const classticSearch = classticSearchStore()
const classticAdd=classticAddStore()
const formItemLayout = { const formItemLayout = {
labelCol: { span: 4 ,offset:2},
wrapperCol: { span: 16 },
labelCol: { span: 4, offset: 2 },
wrapperCol: { span: 16 },
}; };
const addModal = reactive({ const addModal = reactive({
addOpen: false, addOpen: false,
@ -73,36 +75,8 @@ const modal = (mode: string) => {
} }
addModal.addOpen = true; addModal.addOpen = true;
} }
const addhandleOk = () => {
addOpen.value = true;
};
const edithandleOk = () => {
// Logic for editing
console.log('Edit logic here');
}
const handleOk = () => {
if (addModal.modalMode === 'add') {
// Handle add action
addhandleOk();
} else if (addModal.modalMode === 'edit') {
// Handle edit action
edithandleOk();
}
addModal.addOpen = false;
}
interface FormState {
name: string,
content: string,
descr: string
}
const formState = reactive<FormState>({
name: '',
content: '',
descr: ''
});
const deleteOpen = ref<boolean>(false); const deleteOpen = ref<boolean>(false);
@ -128,7 +102,6 @@ const blogAdd = function () {
// //
onMounted(async () => { onMounted(async () => {
classticContent.classticList() classticContent.classticList()
}); });
const columns = [ const columns = [
{ {

Loading…
Cancel
Save