chore: install prettier
This commit is contained in:
Viet An
@@ -1,59 +1,85 @@
|
||||
<template>
|
||||
<div class="columns is-multiline is-mobile mx-0">
|
||||
<div class="column is-1">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">ID<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.id" disabled>
|
||||
</div>
|
||||
</div>
|
||||
<div class="columns is-multiline is-mobile mx-0">
|
||||
<div class="column is-1">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">ID<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.id"
|
||||
disabled
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Category<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.category">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Category<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.category"
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Classify<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.classify">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Classify<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.classify"
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Code<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.code">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-2">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Index</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.index">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Code<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.code"
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-12">
|
||||
<label class="label has-text-left">VI<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
<textarea class="textarea" placeholder="" rows="3" v-model="record.vi"></textarea>
|
||||
</div>
|
||||
<div class="control ml-5">
|
||||
<a @click="openEditor()">
|
||||
<SvgIcon v-bind="{name: 'pen1.svg', type: 'gray', size: 22}"></SvgIcon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-2">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Index</label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.index"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-12">
|
||||
<label class="label has-text-left">VI<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
<textarea
|
||||
class="textarea"
|
||||
placeholder=""
|
||||
rows="3"
|
||||
v-model="record.vi"
|
||||
></textarea>
|
||||
</div>
|
||||
<!-- <div class="column is-12">
|
||||
<div class="control ml-5">
|
||||
<a @click="openEditor()">
|
||||
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'gray', size: 22 }"></SvgIcon>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="column is-12">
|
||||
<label class="label has-text-left">EN<span class="has-text-danger ml-1">*</span></label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
@@ -66,48 +92,70 @@
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="column is-6">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Image</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.image">
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-6">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Image</label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.image"
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-6">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Link</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" v-model="record.link">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-6">
|
||||
<div class="field">
|
||||
<label class="label has-text-left">Link</label>
|
||||
<div class="control">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
v-model="record.link"
|
||||
/>
|
||||
</div>
|
||||
<div class="column is-12">
|
||||
<label class="label has-text-left">Detail</label>
|
||||
<div class="field has-addons">
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-12">
|
||||
<label class="label has-text-left">Detail</label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
<input class="input" type="text" placeholder="" v-model="record.detail">
|
||||
<input
|
||||
class="input"
|
||||
type="text"
|
||||
placeholder=""
|
||||
v-model="record.detail"
|
||||
/>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button class="button" @click="editDetail('detail')">
|
||||
<button
|
||||
class="button"
|
||||
@click="editDetail('detail')"
|
||||
>
|
||||
<span>
|
||||
<SvgIcon v-bind="{name: 'pen1.svg', type: 'gray', size: 17}"></SvgIcon>
|
||||
<SvgIcon v-bind="{ name: 'pen1.svg', type: 'gray', size: 17 }"></SvgIcon>
|
||||
</span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button class="button" @click="copyDetail('detail')">
|
||||
<button
|
||||
class="button"
|
||||
@click="copyDetail('detail')"
|
||||
>
|
||||
Copy
|
||||
</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button class="button" @click="pasteDetail('detail')">
|
||||
<button
|
||||
class="button"
|
||||
@click="pasteDetail('detail')"
|
||||
>
|
||||
Paste
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="column is-6">
|
||||
</div>
|
||||
<!-- <div class="column is-6">
|
||||
<label class="label has-text-left">Detail EN</label>
|
||||
<div class="field has-addons">
|
||||
<div class="control is-expanded">
|
||||
@@ -132,57 +180,84 @@
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="column is-12 pt-5">
|
||||
<a class="button is-primary has-text-white" @click="updateData()">Save</a>
|
||||
<a class="button is-dark has-text-white ml-5" @click="updateData(true)" v-if="record.id">Create new</a>
|
||||
<div class="column is-12 pt-5">
|
||||
<a
|
||||
class="button is-primary has-text-white"
|
||||
@click="updateData()"
|
||||
>Save</a
|
||||
>
|
||||
<a
|
||||
class="button is-dark has-text-white ml-5"
|
||||
@click="updateData(true)"
|
||||
v-if="record.id"
|
||||
>Create new</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<Modal @close="showmodal=undefined" v-bind="showmodal" @texteditor="updateText" @update="updateAttr" v-if="showmodal"></Modal>
|
||||
<Modal
|
||||
@close="showmodal = undefined"
|
||||
v-bind="showmodal"
|
||||
@texteditor="updateText"
|
||||
@update="updateAttr"
|
||||
v-if="showmodal"
|
||||
></Modal>
|
||||
</template>
|
||||
<script setup>
|
||||
const emit = defineEmits([])
|
||||
var props = defineProps({
|
||||
pagename: String,
|
||||
row: Object,
|
||||
api: String
|
||||
})
|
||||
const { $copy, $resetNull, $insertrow, $updaterow, $copyToClipboard, $empty } = useNuxtApp()
|
||||
var record = ref(props.row? $copy(props.row) : {})
|
||||
var showmodal = ref()
|
||||
var vapi = props.api
|
||||
var current
|
||||
var updateText = function(content) {
|
||||
record.value.vi = content
|
||||
}
|
||||
var openEditor = function() {
|
||||
showmodal.value = {component: 'common/TextEditor', vbind: {content: record.value.vi}, title: 'Text editor', width: '40%', height: '150px'}
|
||||
}
|
||||
var editDetail = function(attr) {
|
||||
current = attr
|
||||
let detail = record.value[attr]? record.value[attr] : {}
|
||||
showmodal.value = {component: 'datatable/FieldAttribute', vbind: {field: detail, close: true},
|
||||
title: 'Change attributes', width: '40%', height: '150px'}
|
||||
}
|
||||
var updateAttr = function(detail) {
|
||||
record.value[current] = detail
|
||||
}
|
||||
function copyDetail(attr) {
|
||||
if($empty(record.value[attr])) return
|
||||
let val = typeof record.value[attr]=='string'? record.value[attr] : JSON.stringify(record.value[attr])
|
||||
$copyToClipboard(val)
|
||||
}
|
||||
async function pasteDetail(attr) {
|
||||
let text = await navigator.clipboard.readText()
|
||||
if($empty(text)) return
|
||||
record.value[attr] = JSON.parse(text)
|
||||
}
|
||||
var updateData = async function(isNew) {
|
||||
let ele = record.value
|
||||
if(ele.create_time===null) ele.create_time = new Date()
|
||||
ele = $resetNull(ele)
|
||||
if(isNew) delete ele.id
|
||||
let result = ele.id? await $updaterow(vapi, ele, undefined, props.pagename)
|
||||
: await $insertrow(vapi, ele, undefined, props.pagename)
|
||||
if(isNew) emit('close')
|
||||
}
|
||||
</script>
|
||||
const emit = defineEmits([]);
|
||||
var props = defineProps({
|
||||
pagename: String,
|
||||
row: Object,
|
||||
api: String,
|
||||
});
|
||||
const { $copy, $resetNull, $insertrow, $updaterow, $copyToClipboard, $empty } = useNuxtApp();
|
||||
var record = ref(props.row ? $copy(props.row) : {});
|
||||
var showmodal = ref();
|
||||
var vapi = props.api;
|
||||
var current;
|
||||
var updateText = function (content) {
|
||||
record.value.vi = content;
|
||||
};
|
||||
var openEditor = function () {
|
||||
showmodal.value = {
|
||||
component: "common/TextEditor",
|
||||
vbind: { content: record.value.vi },
|
||||
title: "Text editor",
|
||||
width: "40%",
|
||||
height: "150px",
|
||||
};
|
||||
};
|
||||
var editDetail = function (attr) {
|
||||
current = attr;
|
||||
let detail = record.value[attr] ? record.value[attr] : {};
|
||||
showmodal.value = {
|
||||
component: "datatable/FieldAttribute",
|
||||
vbind: { field: detail, close: true },
|
||||
title: "Change attributes",
|
||||
width: "40%",
|
||||
height: "150px",
|
||||
};
|
||||
};
|
||||
var updateAttr = function (detail) {
|
||||
record.value[current] = detail;
|
||||
};
|
||||
function copyDetail(attr) {
|
||||
if ($empty(record.value[attr])) return;
|
||||
let val = typeof record.value[attr] == "string" ? record.value[attr] : JSON.stringify(record.value[attr]);
|
||||
$copyToClipboard(val);
|
||||
}
|
||||
async function pasteDetail(attr) {
|
||||
let text = await navigator.clipboard.readText();
|
||||
if ($empty(text)) return;
|
||||
record.value[attr] = JSON.parse(text);
|
||||
}
|
||||
var updateData = async function (isNew) {
|
||||
let ele = record.value;
|
||||
if (ele.create_time === null) ele.create_time = new Date();
|
||||
ele = $resetNull(ele);
|
||||
if (isNew) delete ele.id;
|
||||
let result = ele.id
|
||||
? await $updaterow(vapi, ele, undefined, props.pagename)
|
||||
: await $insertrow(vapi, ele, undefined, props.pagename);
|
||||
if (isNew) emit("close");
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user