Browse Source

Merge pull request #1821 from mertmit/json-editor

feat: improve json editor
pull/1825/head
աɨռɢӄաօռɢ 3 years ago committed by GitHub
parent
commit
8b07805bbd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 4
      packages/nc-gui/components/monaco/MonacoJsonObjectEditor.js
  2. 15
      packages/nc-gui/components/project/spreadsheet/components/editableCell/jsonEditableCell.vue

4
packages/nc-gui/components/monaco/MonacoJsonObjectEditor.js

@ -31,7 +31,7 @@ export default {
default: true
}
},
emits: ['validate'],
model: {
event: "change"
},
@ -109,7 +109,9 @@ export default {
if (!this.deepcompare(this.value, JSON.parse(value))) {
this.$emit("change", JSON.parse(value), event);
}
this.$emit("validate", true);
} catch (e) {
this.$emit("validate", false, e);
// console.log('monaco', e)
}
});

15
packages/nc-gui/components/project/spreadsheet/components/editableCell/jsonEditableCell.vue

@ -10,7 +10,7 @@
<!-- Cancel -->
{{ $t('general.cancel') }}
</v-btn>
<v-btn x-small color="primary" @click="save">
<v-btn x-small color="primary" :disabled="!isValid" @click="save">
<!-- Save -->
{{ $t('general.save') }}
</v-btn>
@ -25,13 +25,18 @@
v-model="localState"
class="text-left caption"
style="width: 300px;min-height:min(600px,80vh);min-width:100%; "
@validate="validate"
/>
<monaco-json-object-editor
v-else
v-model="localState"
class="text-left caption"
style="width: 300px;min-height:200px;min-width:100%;"
@validate="validate"
/>
<div v-show="error" class="px-2 py-1 text-left caption error--text">
{{ error }}
</div>
</v-dialog>
</template>
@ -47,7 +52,9 @@ export default {
},
data: () => ({
localState: '',
expand: false
expand: false,
isValid: true,
error: undefined
}),
computed: {
@ -91,6 +98,10 @@ export default {
save() {
this.expand = false
this.$emit('input', JSON.stringify(this.localState))
},
validate(n, e) {
this.isValid = n
this.error = e
}
}
}

Loading…
Cancel
Save