mirror of https://github.com/nocodb/nocodb
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
169 lines
5.3 KiB
169 lines
5.3 KiB
<script setup lang="ts"> |
|
import type { ColumnType } from 'nocodb-sdk' |
|
import { inject } from 'vue' |
|
import { ColumnInj, IsFormInj } from '~/context' |
|
import { provide } from '#imports' |
|
|
|
interface Props { |
|
required?: boolean |
|
column: ColumnType & { meta: any } |
|
} |
|
|
|
const { column, required } = defineProps<Props>() |
|
|
|
provide(ColumnInj, column) |
|
|
|
const isForm = inject(IsFormInj) |
|
|
|
// import { UITypes } from 'nocodb-sdk' |
|
// import { getUIDTIcon } from '../helpers/uiTypes' |
|
// import EditVirtualColumn from '~/components/project/spreadsheet/components/EditVirtualColumn' |
|
// |
|
// export default { |
|
// name: 'VirtualHeaderCell', |
|
// components: { EditVirtualColumn }, |
|
// props: ['column', 'nodes', 'meta', 'isForm', 'isPublicView', 'sqlUi', 'required', 'isLocked', 'isVirtual'], |
|
// data: () => ({ |
|
// columnDeleteDialog: false, |
|
// editColumnMenu: false, |
|
// rollupIcon: getUIDTIcon('Rollup'), |
|
// rels: ['bt', 'hm', 'mm'] |
|
// }), |
|
// computed: { |
|
// alias() { |
|
// // return this.column.lk ? `${this.column.lk._lcn} <small class="grey--text text--darken-1">(from ${this.column.lk._ltn})</small>` : this.column.title |
|
// return this.column.title |
|
// }, |
|
// type() { |
|
// if (this.column?.colOptions?.type) { |
|
// return this.column.colOptions.type |
|
// } |
|
// if (this.column?.colOptions?.formula) { |
|
// return 'formula' |
|
// } |
|
// if (this.column.uidt === UITypes.Lookup) { |
|
// return 'lk' |
|
// } |
|
// if (this.column.uidt === UITypes.Rollup) { |
|
// return 'rl' |
|
// } |
|
// return '' |
|
// }, |
|
// relation() { |
|
// if (this.rels.includes(this.type)) { |
|
// return this.column |
|
// } else if (this.column.colOptions?.fk_relation_column_id) { |
|
// return this.meta.columns.find(c => c.id === this.column.colOptions?.fk_relation_column_id) |
|
// } |
|
// return undefined |
|
// }, |
|
// relationType() { |
|
// return this.relation?.colOptions?.type |
|
// }, |
|
// relationMeta() { |
|
// if (this.rels.includes(this.type)) { |
|
// return this.getMeta(this.column.colOptions.fk_related_model_id) |
|
// } else if (this.relation) { |
|
// return this.getMeta(this.relation.colOptions.fk_related_model_id) |
|
// } |
|
// return undefined |
|
// }, |
|
// childColumn() { |
|
// if (this.relationMeta?.columns) { |
|
// if (this.type === 'rl') { |
|
// const ch = this.relationMeta.columns.find(c => c.id === this.column.colOptions.fk_rollup_column_id) |
|
// return ch |
|
// } |
|
// if (this.type === 'lk') { |
|
// const ch = this.relationMeta.columns.find(c => c.id === this.column.colOptions.fk_lookup_column_id) |
|
// return ch |
|
// } |
|
// } |
|
// return '' |
|
// }, |
|
// childTable() { |
|
// if (this.relationMeta?.title) { |
|
// return this.relationMeta.title |
|
// } |
|
// return '' |
|
// }, |
|
// parentTable() { |
|
// if (this.rels.includes(this.type)) { |
|
// return this.meta.title |
|
// } |
|
// return '' |
|
// }, |
|
// parentColumn() { |
|
// if (this.rels.includes(this.type)) { |
|
// return this.column.title |
|
// } |
|
// return '' |
|
// }, |
|
// tooltipMsg() { |
|
// if (!this.column) { |
|
// return '' |
|
// } |
|
// if (this.type === 'hm') { |
|
// return `'${this.parentTable}' has many '${this.childTable}'` |
|
// } else if (this.type === 'mm') { |
|
// return `'${this.childTable}' & '${this.parentTable}' have <br>many to many relation` |
|
// } else if (this.type === 'bt') { |
|
// return `'${this.column.title}' belongs to '${this.childTable}'` |
|
// } else if (this.type === 'lk') { |
|
// return `'${this.childColumn.title}' from '${this.childTable}' (${this.childColumn.uidt})` |
|
// } else if (this.type === 'formula') { |
|
// return `Formula - ${this.column.colOptions.formula}` |
|
// } else if (this.type === 'rl') { |
|
// return `'${this.childColumn.title}' of '${this.childTable}' (${this.childColumn.uidt})` |
|
// } |
|
// return '' |
|
// } |
|
// }, |
|
// methods: { |
|
// getMeta(id) { |
|
// return this.$store.state.meta.metas[id] || {} |
|
// }, |
|
// async deleteColumn() { |
|
// try { |
|
// await this.$api.dbTableColumn.delete(this.column.id) |
|
// |
|
// if (this.column.uidt === UITypes.LinkToAnotherRecord && this.column.colOptions) { |
|
// this.$store.dispatch('meta/ActLoadMeta', { force: true, id: this.column.colOptions.fk_related_model_id }).then(() => {}) |
|
// } |
|
// |
|
// this.$emit('saved') |
|
// this.columnDeleteDialog = false |
|
// } catch (e) { |
|
// this.$toast.error(await this._extractSdkResponseErrorMsg(e)).goAway(3000) |
|
// } |
|
// } |
|
// } |
|
// } |
|
</script> |
|
|
|
<template> |
|
<div class="d-flex align-center w-full"> |
|
<!-- <v-tooltip bottom> |
|
<template #activator="{ on }"> |
|
todo: bring tooltip |
|
--> |
|
<SmartsheetHeaderVirtualCellIcon v-if="column" /> |
|
<span class="name" style="white-space: nowrap" :title="column.title"> {{ column.title }}</span> |
|
<span v-if="column.rqd || required" class="text-red-500"> *</span> |
|
|
|
<!-- <span class="caption" v-html="tooltipMsg" /> --> |
|
|
|
<!-- </v-tooltip> --> |
|
<v-spacer /> |
|
|
|
<SmartsheetHeaderMenu v-if="!isForm" :virtual="true" /> |
|
</div> |
|
</template> |
|
|
|
<style scoped> |
|
.name { |
|
max-width: calc(100% - 40px); |
|
overflow: hidden; |
|
text-overflow: ellipsis; |
|
} |
|
</style>
|
|
|