add bookmark_type delete function

This commit is contained in:
simple321vip
2022-08-28 21:18:02 +08:00
parent 4eef8656c3
commit 41c42e2d47
52 changed files with 279 additions and 99 deletions
+90 -24
View File
@@ -1,14 +1,30 @@
<template>
<div class="dashboard">
<el-table ref="multipleTableRef" :data="tableData" @selection-change="handleSelectionChange" style="width: 100%">
<el-table-column type="index" label="index" width="80" />
<el-table-column prop="bk_type_name" label="分类名" width="100" />
<el-table-column type="selection" width="55" />
<el-table-column label="修改">
<template #default="scope">
<el-button class="click-icon" size="small" @click="handleEditType(scope.$index, scope.row)">编辑
</el-button>
</template>
</el-table-column>
<el-table-column class="click-icon" prop="删除" label="url">
<template #default="scope">
<el-button size="small" type="danger" @click="handleDeleteType(scope.$index, scope.row)">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<el-form :model="dialog_form">
<el-form-item label="分类" :label-width="formLabelWidth">
<el-select v-model="dialog_form.bk_type_id" placeholder>
<el-option
v-for="(item) in types"
:key="item.bk_type_id"
:value="item.bk_type_id"
:label="item.bk_type_name"
/>
<el-option v-for="(item) in types" :key="item.bk_type_id" :value="item.bk_type_id"
:label="item.bk_type_name" />
</el-select>
<el-form-item label="备注" :label-width="formLabelWidth">
<el-input v-model="dialog_form.comment" autocomplete="off" />
@@ -24,15 +40,75 @@
<el-button type="primary" @click="submit">提交</el-button>
</span>
<!-- </template> -->
<el-dialog v-model="deleteDialogVisible">
<delete_dialog :delete_id="currentDialogData.bookmark_type_id" @on-submit="doDeleteType"></delete_dialog>
</el-dialog>
<el-dialog v-model="deleteDialogVisible">
<delete_dialog :delete_id="currentDialogData.bookmark_type_id" @on-submit="doEditType"></delete_dialog>
</el-dialog>
</div>
</template>
<script setup lang="ts">
import { reactive } from 'vue';
import { update_bookmark, put_bookmark } from '../../api/bookmark'
import { reactive, ref } from 'vue';
import { delete_bookmark_type, post_bookmark_type, get_bookmark_type } from '../../api/bookmark_type'
import type { FormInstance } from 'element-plus'
const formLabelWidth = '140px'
// 定义书签格式
type BookmarkType = {
bookmark_type_id: string,
bookmark_type_name: string,
visiable: boolean,
}
const tableData = reactive<BookmarkType[]>([])
const currentDialogData = reactive<BookmarkType>({
bookmark_type_id: '',
bookmark_type_name: '',
visiable: false,
})
const deleteDialogVisible = ref<Boolean>(false)
const editDialogVisible = ref<Boolean>(false)
const handleDeleteType = (index: number, bookmarkType: BookmarkType) => {
Object.assign(currentDialogData, bookmarkType)
deleteDialogVisible.value = true
}
const handleEditType = (index: number, bookmarkType: BookmarkType) => {
Object.assign(currentDialogData, bookmarkType)
editDialogVisible.value = true
}
const handleSelectionChange = () => {
}
const doDeleteType = () => {
delete_bookmark_type(currentDialogData.bookmark_type_id).then(response => {
deleteDialogVisible.value = false
doSearchType()
})
}
const doEditType = () => {
post_bookmark_type(currentDialogData.bookmark_type_id).then(response => {
deleteDialogVisible.value = false
doSearchType()
})
}
const doSearchType = () => {
get_bookmark_type().then(response => {
deleteDialogVisible.value = false
})
}
type Props = {
types: any[],
dialog_form: any,
@@ -51,33 +127,23 @@ const submit = () => {
comment: props.dialog_form.comment,
url: props.dialog_form.url,
}
if (props.operate_code == '0') {
put_bookmark(params).then(response => {
emit('on-submit')
})
} else if (props.operate_code == '1') {
update_bookmark(params).then(response => {
emit('on-submit')
})
} else if (props.operate_code == '2') {
update_bookmark(params).then(response => {
emit('on-submit')
})
}
}
doSearchType()
</script>
<style scoped>.el-button--text {
<style scoped>
.el-button--text {
margin-right: 15px;
}
.el-select {
width: 300px;
}
.el-input {
width: 300px;
}
.dialog-footer button:first-child {
margin-right: 10px;
}
+49
View File
@@ -0,0 +1,49 @@
<template>
<div class="dashboard">
<el-input v-model="bookmark_type_name" placeholder="Please input" />
<!-- <template #footer> -->
<span class="dialog-footer">
<el-button type="primary" @click="submit">提交</el-button>
</span>
<!-- </template> -->
</div>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { put_bookmark_type } from '../../api/bookmark_type'
const bookmark_type_name = ref<String>('')
const emit = defineEmits(['on-update'])
const submit = () => {
const params = {
bookmark_type_name: bookmark_type_name.value
}
put_bookmark_type(params).then(response => {
emit('on-update')
bookmark_type_name.value = ''
})
}
</script>
<style scoped>
.el-button--text {
margin-right: 15px;
}
.el-select {
width: 300px;
}
.el-input {
width: 300px;
}
.dialog-footer button:first-child {
margin-right: 10px;
}
</style>
+45 -23
View File
@@ -14,6 +14,7 @@
<div class="tag_list">
<el-tag class="ml-2 click-icon" :type="item.clicked ? 'danger' : 'info'" v-for="(item) in bookmark_types"
@click="handleTags(item)">{{ item.bk_type_name }}</el-tag>
<el-button type="primary" @click="handleAddType" v-show="Tenant.account">增加</el-button>
<el-button type="primary" @click="handleManageType" v-show="Tenant.account">自定义</el-button>
</div>
</el-form>
@@ -60,7 +61,11 @@
<delete_dialog :delete_id="currentDialogData.bk_id" @on-submit="doDelete"></delete_dialog>
</el-dialog>
<!-- <el-dialog v-model="TypeDialogVisible">
<el-dialog v-model="createTypeDialogVisible">
<createType_dialog @on-update="doUpdate"></createType_dialog>
</el-dialog>
<!-- <el-dialog v-model="typeDialogVisible">
<bookmarkType_dialog :delete_id="currentDialogData.bk_id" @on-submit="doDelete"></bookmarkType_dialog>
</el-dialog> -->
</div>
@@ -69,9 +74,10 @@
<script setup lang="ts">
import { reactive, ref } from 'vue'
import { search_bookmark, delete_bookmark } from '../../api/bookmark'
import { bookmark_type } from '../../api/master'
import { get_bookmark_type } from '../../api/bookmark_type'
import bookmark_dialog from './dialog.vue'
import bookmarkType_dialog from './Typedialog.vue'
import createType_dialog from './createTypedialog.vue'
import delete_dialog from '../../components/operate/deleteDialog.vue'
import type { ElTable } from 'element-plus'
import { CopyDocument } from "@element-plus/icons-vue";
@@ -82,19 +88,6 @@ import { useTenantStore } from '../../store/tenant'
// obtain user infomation
const Tenant = useTenantStore()
const bookmark_types = reactive<any[]>([])
bookmark_type().then(response => {
response.data.forEach((element: String) => {
const item = element.split("|")
const row = {
bk_type_id: Number(item[0]),
bk_type_name: item[1],
clicked: false
}
bookmark_types.push(row)
})
})
// 定义书签格式
type Bookmark = {
bk_id: string,
@@ -140,16 +133,45 @@ const toggleSelection = (rows?: Bookmark[]) => {
}
}
const handleManageType = () => {
}
// dialog表示flag
let dialogFormVisible = ref(false)
let dialogVisible = ref(false)
let TypeDialogVisible = ref(false)
let typeDialogVisible = ref(false)
let createTypeDialogVisible = ref(false)
/* click 自定义 */
const handleManageType = () => {
typeDialogVisible.value = true
}
/* click 增加 */
const handleAddType = () => {
createTypeDialogVisible.value = true
}
/* callback after we add bookmark_type */
const doUpdate = () => {
createTypeDialogVisible.value = false
doSearch()
dearchBookmarkType()
}
const bookmark_types = reactive<any[]>([])
const dearchBookmarkType = () => {
get_bookmark_type().then(response => {
bookmark_types.splice(0, bookmark_types.length)
response.data.forEach((element: String) => {
const item = element.split("|")
const row = {
bk_type_id: Number(item[0]),
bk_type_name: item[1],
clicked: false
}
bookmark_types.push(row)
})
})
}
// 操作-》添加
const handleInsert = () => {
@@ -223,7 +245,6 @@ const doDelete = (delete_id: any) => {
dialogVisible.value = false
doSearch()
})
}
const closeDialog = () => {
@@ -242,6 +263,7 @@ const copyNumber = (record: Bookmark) => {
})
}
doSearch()
dearchBookmarkType()
</script>
<style scoped>