onenote test环境再修改
This commit is contained in:
simple321vip
@@ -65,6 +65,13 @@ export default [
|
||||
return {}
|
||||
}
|
||||
},
|
||||
{
|
||||
url: '/onenote/api/v1/item',
|
||||
method: 'post',
|
||||
response: () => {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
{
|
||||
url: '/onenote/api/v1/item',
|
||||
method: 'delete',
|
||||
|
||||
+8
-34
@@ -7,14 +7,6 @@ const get_categorys = () => {
|
||||
})
|
||||
}
|
||||
|
||||
const get_items = (category_id: string) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/' + category_id + '/items/',
|
||||
method: 'GET',
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const put_category = (data: Object) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/category',
|
||||
@@ -23,6 +15,13 @@ const put_category = (data: Object) => {
|
||||
})
|
||||
}
|
||||
|
||||
const get_items = (category_id: string) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/' + category_id + '/items/',
|
||||
method: 'GET',
|
||||
})
|
||||
}
|
||||
|
||||
const put_item = (data: Object) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/item',
|
||||
@@ -47,29 +46,4 @@ const delete_item = (data: Object) => {
|
||||
})
|
||||
}
|
||||
|
||||
const update_page = (params: Object) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/one_note/update_page',
|
||||
method: 'POST',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
|
||||
const update_section = (params: Object) => {
|
||||
return service({
|
||||
url: '/onenote/api/v1/one_note/update_section',
|
||||
method: 'POST',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const insert_page = (params: Object) => {
|
||||
return service({
|
||||
url: '/onenote/one_note/insert_page',
|
||||
method: 'PUT',
|
||||
data: params
|
||||
})
|
||||
}
|
||||
|
||||
export { get_categorys, get_items, update_page, update_section, put_category, put_item, post_item, delete_item, insert_page }
|
||||
export { get_categorys, get_items, put_category, put_item, post_item, delete_item }
|
||||
|
||||
+75
-35
@@ -38,12 +38,12 @@
|
||||
<el-page-header @back="onBack">
|
||||
<template #content>
|
||||
<div class="flex items-center">
|
||||
<span class="text-large font-600 mr-3"> {{ current_category }} </span>
|
||||
<span class="category_theme"> {{ current_category.category_theme }} </span>
|
||||
<el-button size="default" :icon="Plus" round @click="onAddItem"></el-button>
|
||||
</div>
|
||||
<el-button size="large" :icon="Plus" round @click="onAddItem"></el-button>
|
||||
</template>
|
||||
</el-page-header>
|
||||
<el-card v-for="(item, key) in itemCards" shadow="hover" class="onenote_item_card" @dblclick="editItem(item)">
|
||||
<el-card v-for="(item, key) in itemCards" shadow="hover" class="onenote_item_card" @dblclick="oNEditItem(item)">
|
||||
<template #header>
|
||||
<div class="onenote_card__header">
|
||||
{{ item.item_name }}
|
||||
@@ -90,8 +90,11 @@
|
||||
<template #prepend>text:</template>
|
||||
</el-input>
|
||||
|
||||
<el-button size="large" :icon="Check" round @click="deleteItem">删除</el-button>
|
||||
<el-button size="large" :icon="Check" round @click="addItem">确认</el-button>
|
||||
<el-button v-if="isEditItemMode == true" size="large" :icon="Check" round @click="deleteItem">删除</el-button>
|
||||
<el-button v-if="isEditItemMode == false" size="large" :icon="Check" round
|
||||
@click="itemDrawer = false">取消</el-button>
|
||||
<el-button v-if="isEditItemMode == false" size="large" :icon="Check" round @click="addItem">确认</el-button>
|
||||
<el-button v-if="isEditItemMode == true" size="large" :icon="Check" round @click="editItem">确认</el-button>
|
||||
</el-drawer>
|
||||
|
||||
</template>
|
||||
@@ -99,7 +102,7 @@
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from 'vue'
|
||||
import { Check, Plus } from '@element-plus/icons-vue'
|
||||
import { get_categorys, get_items, put_category, put_item, delete_item } from '@/api/onenote'
|
||||
import { get_categorys, get_items, put_category, put_item, delete_item, post_item } from '@/api/onenote'
|
||||
|
||||
|
||||
// -- IMPORT --
|
||||
@@ -115,33 +118,40 @@ type CategoryCard = {
|
||||
type CategoryItem = {
|
||||
item_id: string,
|
||||
item_name: string,
|
||||
item_value: string
|
||||
item_value: string,
|
||||
category_id: string
|
||||
}
|
||||
|
||||
// -- REACTIVE OBJECT --
|
||||
const itemCards = reactive<CategoryItem[]>([])
|
||||
const categoryCards = reactive<CategoryCard[]>([])
|
||||
|
||||
// -- REF OBJECT --
|
||||
let element_ui_icon = "https://element-plus.gitee.io/zh-CN/component/icon.html"
|
||||
let cainiao_color = "https://www.runoob.com/html/html-colornames.html"
|
||||
const categoryDrawer = ref(false)
|
||||
const itemDrawer = ref(false)
|
||||
let isEditItemMode = ref(false)
|
||||
let isShowCard = ref(false)
|
||||
let isshowCategorys = ref(true)
|
||||
let current_category = ref<CategoryCard>({
|
||||
category_id: '',
|
||||
category_color: '',
|
||||
category_icon: '',
|
||||
category_theme: ''
|
||||
})
|
||||
let item_form = ref<CategoryItem>({
|
||||
item_id: '',
|
||||
item_name: '',
|
||||
item_value: '',
|
||||
category_id: ''
|
||||
})
|
||||
let category_form = ref<CategoryCard>({
|
||||
category_id: '',
|
||||
category_color: '',
|
||||
category_icon: '',
|
||||
category_theme: 'Sample'
|
||||
})
|
||||
let item_form = ref<CategoryItem>({
|
||||
item_id: '',
|
||||
item_name: '',
|
||||
item_value: '',
|
||||
})
|
||||
|
||||
// -- REF OBJECT --
|
||||
let element_ui_icon = "https://element-plus.gitee.io/zh-CN/component/icon.html"
|
||||
let cainiao_color = "runoob.com/html/html-colornames.html"
|
||||
const categoryDrawer = ref(false)
|
||||
const itemDrawer = ref(false)
|
||||
let isShowCard = ref(false)
|
||||
let isshowCategorys = ref(true)
|
||||
|
||||
let current_category = ref("")
|
||||
|
||||
// -- EVENT DEFINITION
|
||||
const onBack = () => {
|
||||
@@ -151,24 +161,41 @@ const onBack = () => {
|
||||
|
||||
const onAddItem = () => {
|
||||
clearItemForm()
|
||||
isEditItemMode.value = false
|
||||
itemDrawer.value = true
|
||||
}
|
||||
|
||||
const oNEditItem = (item: CategoryItem) => {
|
||||
itemDrawer.value = true
|
||||
isEditItemMode.value = true
|
||||
item_form.value.item_id = item.item_id
|
||||
item_form.value.item_name = item.item_name
|
||||
item_form.value.item_value = item.item_value
|
||||
}
|
||||
|
||||
const showCategory = (card: CategoryCard) => {
|
||||
get_items(card.category_id).then((response) => {
|
||||
itemCards.length = 0
|
||||
response.data.forEach((item: CategoryItem) => {
|
||||
itemCards.push(item)
|
||||
})
|
||||
current_category.value.category_id = card.category_id
|
||||
current_category.value.category_icon = card.category_icon
|
||||
current_category.value.category_color = card.category_color
|
||||
current_category.value.category_theme = card.category_theme
|
||||
isshowCategorys.value = false
|
||||
isShowCard.value = true
|
||||
current_category.value = card.category_theme
|
||||
})
|
||||
}
|
||||
|
||||
const addCategory = () => {
|
||||
put_category(category_form).then(resp => {
|
||||
categoryCards.push(category_form.value)
|
||||
put_category(category_form.value).then(resp => {
|
||||
categoryCards.push({
|
||||
category_id: resp.data.category_id,
|
||||
category_color: category_form.value.category_color,
|
||||
category_icon: category_form.value.category_icon,
|
||||
category_theme: category_form.value.category_theme
|
||||
})
|
||||
categoryDrawer.value = false
|
||||
clearCategoryForm()
|
||||
})
|
||||
@@ -176,31 +203,38 @@ const addCategory = () => {
|
||||
|
||||
const addItem = () => {
|
||||
put_item(item_form.value).then(resp => {
|
||||
itemCards.push({
|
||||
item_id: resp.data.item_id,
|
||||
item_name: item_form.value.item_name,
|
||||
item_value: item_form.value.item_value,
|
||||
category_id: current_category.value.category_id
|
||||
})
|
||||
itemDrawer.value = false
|
||||
})
|
||||
}
|
||||
|
||||
const editItem = () => {
|
||||
post_item(item_form.value).then((resp) => {
|
||||
let index = itemCards.findIndex((record) => record.item_id == item_form.value.item_id)
|
||||
itemCards[index].item_name = item_form.value.item_name
|
||||
itemCards[index].item_value = item_form.value.item_value
|
||||
itemDrawer.value = false
|
||||
itemCards.push(item_form.value)
|
||||
})
|
||||
}
|
||||
|
||||
const deleteItem = () => {
|
||||
delete_item(item_form.value.item_id).then(resp => {
|
||||
itemDrawer.value = false
|
||||
let index = itemCards.findIndex((record) => record.item_id == item_form.value.item_id)
|
||||
itemCards.splice(index, 1)
|
||||
itemDrawer.value = false
|
||||
})
|
||||
}
|
||||
|
||||
const editItem = (item: CategoryItem) => {
|
||||
itemDrawer.value = true
|
||||
item_form.value.item_id = item.item_id
|
||||
item_form.value.item_name = item.item_name
|
||||
item_form.value.item_value = item.item_value
|
||||
}
|
||||
|
||||
const clearItemForm = () => {
|
||||
item_form.value.item_id = ''
|
||||
item_form.value.item_name = ''
|
||||
item_form.value.item_value = ''
|
||||
item_form.value.category_id = current_category.value.category_id
|
||||
}
|
||||
|
||||
const clearCategoryForm = () => {
|
||||
@@ -228,6 +262,7 @@ get_categorys().then((resp) => {
|
||||
})
|
||||
})
|
||||
clearItemForm()
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
@@ -251,7 +286,8 @@ clearItemForm()
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.onenote_card__body {}
|
||||
/*
|
||||
.onenote_card__body {} */
|
||||
|
||||
.onenote_card-box {
|
||||
display: flex;
|
||||
@@ -273,4 +309,8 @@ clearItemForm()
|
||||
.category_icon {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
.category_theme {
|
||||
margin-right: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user