bigdatacloud/login-v2
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Base Login

Browse Source
This commit is contained in:
ThienPhamVan
2026-03-25 10:06:01 +07:00
commit 3a2e16cf19
81 changed files with 27983 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

195
components/datatable/FormatOption.vue Normal file
View File

@@ -0,0 +1,195 @@
<template>
<div>
<div v-if="['bgcolor', 'color', 'textsize'].find(x=>x===sideBar)">
<p class="has-text-right has-text-grey is-italic fs-13">Màu sắc sẽ hiển thị theo điều kiện Đúng / Sai, mã lệnh do hệ thống tự sinh</p>
<div class="tabs is-boxed">
<ul> <li v-for="(v,i) in tabs" :key="i" :class="tab.code===v.code? 'is-active' : ''" @click="tab=v">
<a>{{v.name}}</a></li> </ul>
</div>
</div>
<template v-if="tab.code==='expression' && ['bgcolor', 'color', 'textsize'].find(x=>x===sideBar)">
<div style="max-height:530px; overflow-y:auto">
<template v-if="radio? (radio.code==='condition' && sideBar==='bgcolor') : false">
<div v-for="(v,i) in bgcolorFilter" :key="v.id" class="px-4 mb-3" style="border: 1px solid #DCDCDC; border-radius: 10px;">
<FilterOption v-bind="{filterObj: v, filterType: 'color', pagename: pagename, field: openField}" :ref="v.id"
@databack="doConditionFilter($event, 'bgcolor', v.id)" />
<p class="fs-14 mt-1 has-text-centered" :class="currentField.format==='string'? 'mb-1' : 'mb-2'">
<a class="has-text-primary mr-5" @click="addCondition(bgcolorFilter)" v-if="bgcolorFilter.length<=30"> Thêm </a>
<a class="has-text-danger" @click="removeCondition(bgcolorFilter, i)" v-if="bgcolorFilter.length>1"> Bớt </a>
</p>
</div>
</template>
<template v-else-if="radio? (radio.code==='condition' && sideBar==='color') : false">
<div v-for="(v,i) in colorFilter" :key="v.id" class="px-4 mb-3" style="border: 1px solid #DCDCDC; border-radius: 10px;">
<FilterOption v-bind="{filterObj: v, filterType: 'color', pagename: pagename, field: openField}" :ref="v.id"
@databack="doConditionFilter($event, 'color', v.id)"/>
<p class="fs-14 mt-1 has-text-centered" :class="currentField.format==='string'? 'mb-1' : 'mb-2'">
<a class="has-text-primary mr-5" @click="addCondition(colorFilter)" v-if="colorFilter.length<=30"> Thêm </a>
<a class="has-text-danger" @click="removeCondition(colorFilter,i)" v-if="colorFilter.length>1"> Bớt </a>
</p>
</div>
</template>
<template v-else-if="radio? (radio.code==='condition' && sideBar==='textsize') : false">
<div v-for="(v, i) in sizeFilter" :key="v.id" class="px-4 mb-3" style="border: 1px solid #DCDCDC; border-radius: 10px;">
<FilterOption v-bind="{filterObj: v, filterType: 'size', pagename: pagename, field: openField}" :ref="v.id"
@databack="doConditionFilter($event, 'textsize', v.id)"/>
<p class="fs-14 mt-1 has-text-centered" :class="currentField.format==='string'? 'mb-1' : 'mb-2'">
<a class="has-text-primary mr-5" @click="addCondition(sizeFilter)" v-if="sizeFilter.length<=30"> Thêm </a>
<a class="has-text-danger" @click="removeCondition(sizeFilter, i)" v-if="sizeFilter.length>1"> Bớt </a>
</p>
</div>
</template>
</div>
<!--<p class="mx-4 mt-4"><button class="button is-primary is-rounded" @click="update()">Cập nhật</button></p>-->
</template>
<template v-else-if="tab.code==='script' && ['bgcolor', 'color', 'textsize'].find(x=>x===sideBar)">
<p class="my-4 mx-4">
<a @click="copyContent(script? script : '')" class="mr-6">
<span class="icon fs-20">
<i class="mdi mdi-content-copy"/>
</span>
Copy
</a>
<a @click="paste()" class="mr-6">
<span class="icon fs-20">
<i class="mdi mdi-content-copy"/>
</span>
Paste
</a>
</p>
<div class="mx-4">
<textarea class="textarea fs-14" rows="8" v-model="script" @change="checkScript()" @dblclick="doCheck"></textarea>
</div>
<p class="mt-5 mx-4">
<span class="icon-text fsb-18">
Replace
<span class="material-symbols-outlined">
chevron_right
</span>
</span>
</p>
<div class="field is-grouped mx-4 mt-4">
<div class="control">
<p class="fsb-14 mb-1">Đoạn text</p>
<input class="input" type="text" placeholder="" v-model="source">
</div>
<div class="control">
<p class="fsb-14 mb-1">Thay bằng</p>
<input class="input" type="text" placeholder="" v-model="target">
</div>
<div class="control pl-5">
<button class="button is-primary is-rounded is-outlined mt-5" @click="replace()">Replace</button>
</div>
</div>
<p class="mt-5 pt-2 mx-4">
<span class="icon-text fsb-18">
Thay đổi màu
<span class="material-symbols-outlined">
chevron_right
</span>
</span>
</p>
<p class="mx-4 mt-4"><button class="button is-primary is-rounded" @click="changeScript()">Cập nhật</button></p>
</template>
<TableOption v-bind="{pagename: pagename}" v-else-if="sideBar==='option'"> </TableOption>
<CreateTemplate v-else-if="sideBar==='template'" v-bind="{pagename: pagename, field: openField}"> </CreateTemplate>
</div>
</template>
<script>
export default {
components: {
FilterOption: () => import("@/components/datatable/FilterOption"),
TableOption: () => import("@/components/datatable/TableOption"),
CreateTemplate: () => import("@/components/datatable/CreateTemplate")
},
props: ['event', 'currentField', 'pagename'],
data() {
return {
openField: {},
bgcolorFilter: [],
colorFilter: [],
sizeFilter: [],
sideBar: undefined,
script: undefined,
radio: undefined,
tabs: [{code: 'expression', name: 'Biểu thức'}, {code: 'script', name: 'Mã lệnh'}],
tab: {code: 'expression', name: 'Biểu thức'},
source: undefined,
target: this.$copy(this.currentField.name),
openField: this.$copy(this.currentField)
}
},
created() {
this.openField = this.event.field
this.sideBar = this.event.name
this.script = this.event.script
this.radio = this.event.radio
let field = this.event.field
this.bgcolorFilter = [{id: this.$id()}]
if(field.bgcolor) {
if(Array.isArray(field.bgcolor)) this.bgcolorFilter = this.$copy(field.bgcolor)
}
this.colorFilter = [{id: this.$id()}]
if(field.color) {
if(Array.isArray(field.color)) this.colorFilter = this.$copy(field.color)
}
this.sizeFilter = [{id: this.$id()}]
if(field.textsize) {
if(Array.isArray(field.textsize)) this.sizeFilter = field.textsize
}
},
methods: {
doCheck() {
let text = window.getSelection().toString()
if(this.$empty(text)) return
this.source = text
},
replace() {
if(this.$empty(this.script)) return
this.script = this.script.replaceAll(this.source, this.target)
},
async paste() {
this.script = await navigator.clipboard.readText()
},
addCondition(arr) {
arr.push({id: this.$id()})
},
removeCondition(arr, i) {
this.$delete(arr, i)
},
copyContent(value) {
this.$copyToClipboard(value)
},
checkScript() {
if(this.$empty(this.script)) return
try {
JSON.parse(this.script)
} catch (e) {
return false;
}
return true;
},
changeScript() {
if(!this.checkScript()) return
let copy = this.$copy(this.openField)
copy[this.sideBar] = JSON.parse(this.script)
this.$emit('modalevent', {name: 'updatefields', data: copy})
this.$buefy.toast.open('Màu / cỡ chữ đã được cập nhật')
this.$emit('close')
},
doConditionFilter(v, type, id) {
v.id = id
let copy = this.openField
if(copy[type]? Array.isArray(copy[type]) : false) {
let idx = copy[type].findIndex(x=>x.id===id)
idx>=0? copy[type][idx] = v : copy[type].push(v)
} else copy[type] = [v]
this.$emit('modalevent', {name: 'updatefields', data: this.openField})
}
}
}
</script>