Browse Source

feat: shared gridview with nested data

Signed-off-by: Pranav C <pranavxc@gmail.com>
pull/655/head
Pranav C 3 years ago
parent
commit
6fbb448808
  1. 11
      packages/nc-gui/components/project/spreadsheet/components/spreadsheetNavDrawer.vue
  2. 2
      packages/nc-gui/components/project/spreadsheet/components/virtualCell/belongsToCell.vue
  3. 9
      packages/nc-gui/components/project/spreadsheet/components/virtualCell/components/listChildItems.vue
  4. 2
      packages/nc-gui/components/project/spreadsheet/components/virtualCell/components/listChildItemsModal.vue
  5. 4
      packages/nc-gui/components/project/spreadsheet/components/virtualCell/hasManyCell.vue
  6. 10
      packages/nc-gui/components/project/spreadsheet/components/virtualCell/manyToManyCell.vue
  7. 23
      packages/nocodb/src/lib/noco/meta/NcMetaMgr.ts

11
packages/nc-gui/components/project/spreadsheet/components/spreadsheetNavDrawer.vue

@ -353,11 +353,10 @@
<!-- <v-menu offset-x left>--> <!-- <v-menu offset-x left>-->
<!-- <template v-slot:activator="{on}">--> <!-- <template v-slot:activator="{on}">-->
<!-- v-show="-->
<!-- selectedView && selectedView.show_as === 'form'-->
<!-- "-->
<v-list-item <v-list-item
v-show="
selectedView && (selectedView.type === 'view' || selectedView.type === 'table' || selectedView.show_as === 'form' ||selectedView.show_as === 'grid' )
"
v-if="_isUIAllowed('shareview')" v-if="_isUIAllowed('shareview')"
@click="genShareLink" @click="genShareLink"
> >
@ -436,10 +435,10 @@
<!-- People with private link can only see cells visible in this view --> <!-- People with private link can only see cells visible in this view -->
</p> </p>
<div style="border-radius: 4px" class="share-link-box body-2 pa-2 d-flex align-center"> <div style="border-radius: 4px" class="share-link-box body-2 pa-2 d-flex align-center">
{{ `${dashboardUrl}#/nc/${shareLink.view_type || 'view'}/${shareLink.view_id}` }} {{ `${dashboardUrl}#/nc/${shareLink.view_type === 'form' ? 'form' : 'view' }/${shareLink.view_id}` }}
<v-spacer /> <v-spacer />
<a <a
:href=" `${dashboardUrl}#/nc/${shareLink.view_type || 'view'}/${shareLink.view_id}`" :href=" `${dashboardUrl}#/nc/${shareLink.view_type === 'form' ? 'form' : 'view'}/${shareLink.view_id}`"
style="text-decoration: none" style="text-decoration: none"
target="_blank" target="_blank"
> >

2
packages/nc-gui/components/project/spreadsheet/components/virtualCell/belongsToCell.vue

@ -14,7 +14,7 @@
</template> </template>
</div> </div>
<div <div
v-if="!isLocked && _isUIAllowed('xcDatatableEditable') && !isPublic" v-if="!isLocked && _isUIAllowed('xcDatatableEditable') && (isForm || !isPublic)"
class="action align-center justify-center px-1 flex-shrink-1" class="action align-center justify-center px-1 flex-shrink-1"
:class="{'d-none': !active, 'd-flex':active }" :class="{'d-none': !active, 'd-flex':active }"
> >

9
packages/nc-gui/components/project/spreadsheet/components/virtualCell/components/listChildItems.vue

@ -1,9 +1,6 @@
<template> <template>
<!-- <v-dialog v-model="show" width="600">--> <!-- <v-dialog v-model="show" width="600">-->
<v-card width="600" color=""> <v-card width="600" color="">
<pre class="caption">{{ parentMeta }}</pre>
<pre class="caption">{{ meta }}</pre>
<v-card-title v-if="!isForm" class="textColor--text mx-2" :class="{'py-2':isForm}"> <v-card-title v-if="!isForm" class="textColor--text mx-2" :class="{'py-2':isForm}">
<span v-if="!isForm">{{ meta ? meta._tn : 'Children' }}</span> <span v-if="!isForm">{{ meta ? meta._tn : 'Children' }}</span>
<v-spacer /> <v-spacer />
@ -11,7 +8,7 @@
mdi-reload mdi-reload
</v-icon> </v-icon>
<v-btn <v-btn
v-if="!readOnly && _isUIAllowed('xcDatatableEditable')" v-if="(isForm || !isPublic) && !readOnly && _isUIAllowed('xcDatatableEditable')"
small small
class="caption" class="caption"
color="primary" color="primary"
@ -54,7 +51,7 @@
> >
<div class="remove-child-icon d-flex align-center"> <div class="remove-child-icon d-flex align-center">
<x-icon <x-icon
v-if="!readOnly&& _isUIAllowed('xcDatatableEditable')" v-if="(isForm || !isPublic) && !readOnly && _isUIAllowed('xcDatatableEditable')"
:tooltip="`Unlink this '${meta._tn}' from '${parentMeta._tn}'`" :tooltip="`Unlink this '${meta._tn}' from '${parentMeta._tn}'`"
:color="['error','grey']" :color="['error','grey']"
small small
@ -179,7 +176,7 @@ export default {
}, },
methods: { methods: {
async loadData() { async loadData() {
if (this.isPublic && this.$route.params.id) { if ((!this.isForm && this.isPublic) && this.$route.params.id) {
this.data = await this.$store.dispatch('sqlMgr/ActSqlOp', [null, 'sharedViewNestedChildDataGet', { this.data = await this.$store.dispatch('sqlMgr/ActSqlOp', [null, 'sharedViewNestedChildDataGet', {
password: this.password, password: this.password,
limit: this.size, limit: this.size,

2
packages/nc-gui/components/project/spreadsheet/components/virtualCell/components/listChildItemsModal.vue

@ -20,7 +20,7 @@
v-bind="$attrs" v-bind="$attrs"
:read-only="readOnly" :read-only="readOnly"
:is-public="isPublic" :is-public="isPublic"
column="column" :column="column"
v-on="$listeners" v-on="$listeners"
/> />
</v-dialog> </v-dialog>

4
packages/nc-gui/components/project/spreadsheet/components/virtualCell/hasManyCell.vue

@ -9,7 +9,7 @@
:active="active" :active="active"
:item="ch" :item="ch"
:value="getCellValue(ch)" :value="getCellValue(ch)"
:readonly="isLocked" :readonly="isLocked || isPublic"
@edit="editChild" @edit="editChild"
@unlink="unlinkChild" @unlink="unlinkChild"
/> />
@ -28,7 +28,7 @@
:class="{'d-none': !active, 'd-flex':active }" :class="{'d-none': !active, 'd-flex':active }"
> >
<x-icon <x-icon
v-if="_isUIAllowed('xcDatatableEditable') && !isPublic" v-if="_isUIAllowed('xcDatatableEditable') && (isForm || !isPublic)"
small small
:color="['primary','grey']" :color="['primary','grey']"
@click="showNewRecordModal" @click="showNewRecordModal"

10
packages/nc-gui/components/project/spreadsheet/components/virtualCell/manyToManyCell.vue

@ -9,7 +9,7 @@
:active="active" :active="active"
:item="v" :item="v"
:value="getCellValue(v)" :value="getCellValue(v)"
:readonly="isLocked" :readonly="isLocked || isPublic"
@edit="editChild" @edit="editChild"
@unlink="unlinkChild" @unlink="unlinkChild"
/> />
@ -22,7 +22,7 @@
:class="{'d-none': !active, 'd-flex':active }" :class="{'d-none': !active, 'd-flex':active }"
> >
<x-icon <x-icon
v-if="_isUIAllowed('xcDatatableEditable') && !isPublic" v-if="_isUIAllowed('xcDatatableEditable') && (isForm || !isPublic)"
small small
:color="['primary','grey']" :color="['primary','grey']"
@click="showNewRecordModal" @click="showNewRecordModal"
@ -72,7 +72,8 @@
:query-params="{...childQueryParams, conditionGraph }" :query-params="{...childQueryParams, conditionGraph }"
:local-state="localState" :local-state="localState"
:is-public="isPublic" :is-public="isPublic"
:row-id="parentPrimaryKey" :row-id="row && row[parentPrimaryKey]"
:column="column"
type="mm" type="mm"
@new-record="showNewRecordModal" @new-record="showNewRecordModal"
@edit="editChild" @edit="editChild"
@ -156,7 +157,8 @@ export default {
required: Boolean, required: Boolean,
isPublic: Boolean, isPublic: Boolean,
metas: Object, metas: Object,
password: String password: String,
column: Object
}, },
data: () => ({ data: () => ({
isNewChild: false, isNewChild: false,

23
packages/nocodb/src/lib/noco/meta/NcMetaMgr.ts

@ -3530,6 +3530,11 @@ export default class NcMetaMgr {
} }
const tn = args.args?.ctn; const tn = args.args?.ctn;
const ptn = args.args?.ptn;
if (!tn || !ptn) {
throw new Error('Parent/Child not found');
}
// @ts-ignore // @ts-ignore
// const queryParams = JSON.parse(viewMeta.query_params); // const queryParams = JSON.parse(viewMeta.query_params);
@ -3538,13 +3543,9 @@ export default class NcMetaMgr {
?.find(pb => pb.id === viewMeta.project_id) ?.find(pb => pb.id === viewMeta.project_id)
?.apiBuilders?.find(ab => ab.dbAlias === viewMeta.db_alias); ?.apiBuilders?.find(ab => ab.dbAlias === viewMeta.db_alias);
// todo: only allow related table
// if(tn &&){
//
// }
const model = apiBuilder.xcModels?.[tn]; const model = apiBuilder.xcModels?.[tn];
const meta = apiBuilder.getMeta(tn); const parentMeta = apiBuilder.getMeta(ptn);
// const meta = apiBuilder.getMeta(tn);
const primaryCol = apiBuilder?.getMeta(tn)?.columns?.find(c => c.pv)?.cn; const primaryCol = apiBuilder?.getMeta(tn)?.columns?.find(c => c.pv)?.cn;
@ -3562,7 +3563,8 @@ export default class NcMetaMgr {
switch (args.args?.type) { switch (args.args?.type) {
case 'mm': case 'mm':
{ {
const mm = meta.v.find(v => v.mm && v._cn === args.args._cn)?.mm; const mm = parentMeta.v.find(v => v.mm && v._cn === args.args._cn)
?.mm;
const assocMeta = apiBuilder.getMeta(mm.vtn); const assocMeta = apiBuilder.getMeta(mm.vtn);
commonParams.conditionGraph = { commonParams.conditionGraph = {
@ -3570,7 +3572,7 @@ export default class NcMetaMgr {
[assocMeta.tn]: { [assocMeta.tn]: {
relationType: 'hm', relationType: 'hm',
[assocMeta.columns.find(c => c.cn === mm.vcn).cn]: { [assocMeta.columns.find(c => c.cn === mm.vcn).cn]: {
eq: args.arags.row_id eq: args.args.row_id
} }
} }
}, },
@ -3580,11 +3582,12 @@ export default class NcMetaMgr {
break; break;
case 'hm': case 'hm':
{ {
const hm = meta.v.find(v => v.hm && v._cn === args.args._cn)?.hm; const hm = parentMeta.v.find(v => v.hm && v._cn === args.args._cn)
?.hm;
// const childMeta = apiBuilder.getMeta(hm.rtn); // const childMeta = apiBuilder.getMeta(hm.rtn);
commonParams.condition = { commonParams.condition = {
[hm.rcn]: { [hm.rcn]: {
eq: args.arags.row_id eq: args.args.row_id
} }
}; };
} }

Loading…
Cancel
Save