|
|
@@ -0,0 +1,171 @@
|
|
|
+<template>
|
|
|
+ <v-menu v-model="showMenu" offset-y nudge-bottom="10" allow-overflow :close-on-content-click="false" min-width="500" right @input="onInput">
|
|
|
+ <template v-slot:activator="{ on, attrs }">
|
|
|
+ <v-btn
|
|
|
+ class="ml-3"
|
|
|
+ color="primary"
|
|
|
+ small
|
|
|
+ v-on="on"
|
|
|
+ v-bind="attrs"
|
|
|
+ >
|
|
|
+ 新增元数据
|
|
|
+ </v-btn>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <div class="pa-3 white">
|
|
|
+ <v-text-field
|
|
|
+ v-model="searchKey"
|
|
|
+ label="元数据"
|
|
|
+ placeholder="输入检索..."
|
|
|
+ dense
|
|
|
+ hide-details
|
|
|
+ clearable
|
|
|
+ outlined
|
|
|
+ @keyup.enter="onSearch"
|
|
|
+ >
|
|
|
+ <template #append>
|
|
|
+ <v-btn small icon color="primary" @click="onSearch">
|
|
|
+ <v-icon>mdi-magnify</v-icon>
|
|
|
+ </v-btn>
|
|
|
+ </template>
|
|
|
+ </v-text-field>
|
|
|
+ <div class="mt-3" style="max-height: 60vh; min-height: 200px; overflow: auto;">
|
|
|
+ <v-list dense>
|
|
|
+ <template v-for="(val, index) in items">
|
|
|
+ <v-list-item :key="val.name">
|
|
|
+ <template v-slot:default>
|
|
|
+ <v-list-item-content>
|
|
|
+ <v-list-item-title>{{val.name}} [{{ val.data_type }}]</v-list-item-title>
|
|
|
+ </v-list-item-content>
|
|
|
+ <v-list-item-action>
|
|
|
+ <v-btn text color="primary" small @click="onUse(val)">点击使用</v-btn>
|
|
|
+ </v-list-item-action>
|
|
|
+ </template>
|
|
|
+ </v-list-item>
|
|
|
+ <v-divider
|
|
|
+ v-if="index < items.length - 1"
|
|
|
+ :key="index"
|
|
|
+ ></v-divider>
|
|
|
+ </template>
|
|
|
+ </v-list>
|
|
|
+ <div class="d-flex align-center justify-center flex-column">
|
|
|
+ <v-progress-circular
|
|
|
+ v-if="loading"
|
|
|
+ indeterminate
|
|
|
+ color="primary"
|
|
|
+ ></v-progress-circular>
|
|
|
+ <v-btn
|
|
|
+ v-else
|
|
|
+ :disabled="total <= items.length"
|
|
|
+ text
|
|
|
+ color="primary"
|
|
|
+ @click="onMore"
|
|
|
+ >
|
|
|
+ <template v-if="total <= items.length">没有更多了</template>
|
|
|
+ <template v-else>查看更多</template>
|
|
|
+ </v-btn>
|
|
|
+ <div class="d-flex align-center text-body-2">
|
|
|
+ 没有想要的元数据？
|
|
|
+ <v-btn
|
|
|
+ text
|
|
|
+ color="primary"
|
|
|
+ @click="show = true"
|
|
|
+ >新增一个元数据</v-btn>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <edit-dialog :visible.sync="show" title="新增元数据" @submit="onSubmit">
|
|
|
+ <MetadataEdit v-if="show" v-loading="submitLoading" ref="form" class="mt-5"></MetadataEdit>
|
|
|
+ </edit-dialog>
|
|
|
+ </v-menu>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import MetadataEdit from '../../metadata/components/edit'
|
|
|
+import EditDialog from '@/components/Dialog'
|
|
|
+import { api } from '@/api/dataGovernance'
|
|
|
+export default {
|
|
|
+ name: 'editMetadataAdd',
|
|
|
+ components: {
|
|
|
+ MetadataEdit,
|
|
|
+ EditDialog
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ showMenu: false,
|
|
|
+ submitLoading: false,
|
|
|
+ show: false,
|
|
|
+ pageInfo: {
|
|
|
+ size: this.size,
|
|
|
+ current: 1
|
|
|
+ },
|
|
|
+ total: 0,
|
|
|
+ loading: false,
|
|
|
+ items: [],
|
|
|
+ searchKey: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async init () {
|
|
|
+ this.loading = true
|
|
|
+ try {
|
|
|
+ const { data } = await api.getMetaDataList({ ...this.pageInfo, name: this.searchKey })
|
|
|
+ this.total = data.total
|
|
|
+ this.items.push(...data.records)
|
|
|
+ } catch (error) {
|
|
|
+ this.$snackbar.error(error)
|
|
|
+ } finally {
|
|
|
+ this.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onInput (bool) {
|
|
|
+ if (!bool) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.searchKey = null
|
|
|
+ this.onSearch()
|
|
|
+ },
|
|
|
+ onMore () {
|
|
|
+ this.pageInfo.current++
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ onSearch () {
|
|
|
+ this.pageInfo.current = 1
|
|
|
+ this.items = []
|
|
|
+ this.total = 0
|
|
|
+ this.init()
|
|
|
+ },
|
|
|
+ onUse (val) {
|
|
|
+ this.$emit('use', val)
|
|
|
+ },
|
|
|
+ async onSubmit () {
|
|
|
+ const obj = this.$refs.form.getValue()
|
|
|
+ if (!obj) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ try {
|
|
|
+ this.submitLoading = true
|
|
|
+ const { data } = await api.metadataAdd(obj)
|
|
|
+ this.$snackbar.success('操作成功')
|
|
|
+ this.showMenu = false
|
|
|
+ this.show = false
|
|
|
+ this.$emit('use', {
|
|
|
+ data_type: data.data_type,
|
|
|
+ en_name: data.en_name?.[0] ?? null,
|
|
|
+ id: data.id,
|
|
|
+ name: data.name
|
|
|
+ })
|
|
|
+ } catch (error) {
|
|
|
+ this.$snackbar.error(error)
|
|
|
+ } finally {
|
|
|
+ this.submitLoading = false
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+
|
|
|
+</style>
|
zhengnaiwen_citu