Initial commit
This commit is contained in:
Viet An
217
app/components/people/PeopleView.vue
Normal file
217
app/components/people/PeopleView.vue
Normal file
@@ -0,0 +1,217 @@
|
||||
<template>
|
||||
<div :id="docid" v-if="record">
|
||||
<div>
|
||||
<Caption
|
||||
v-bind="{
|
||||
title: store.lang === 'en' ? 'Information' : 'Thông tin',
|
||||
type: 'has-text-primary',
|
||||
}"
|
||||
></Caption>
|
||||
<div class="columns is-multiline mx-0">
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Mã</label>
|
||||
<div class="control">
|
||||
<span class="hyperlink" @click="$copyToClipboard(record.code)">{{
|
||||
record.code
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Họ tên</label>
|
||||
<div class="control">{{ record.fullname }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Điện thoại</label>
|
||||
<div class="control">
|
||||
<span class="hyperlink" @click="openPhone()">{{ record.phone }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Email</label>
|
||||
<div class="control" style="word-break: break-all">
|
||||
{{ record.email || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("country") }}</label>
|
||||
<div class="control">
|
||||
{{ record.country__name || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Địa chỉ thường trú</label>
|
||||
<div class="control">
|
||||
{{ record.address || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">Địa chỉ liên hệ</label>
|
||||
<div class="control">
|
||||
{{ record.contact_address || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("dob") }}</label>
|
||||
<div class="control">
|
||||
{{ record.dob ? $dayjs(record.dob).format("DD/MM/YYYY") : "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("gender") }}</label>
|
||||
<div class="control">
|
||||
{{ record.sex__name || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("personal_id") }}</label>
|
||||
<div class="control">
|
||||
{{ record.legal_type__name || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("idnum") }}</label>
|
||||
<div class="control">
|
||||
{{ record.legal_code || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("issued_date") }}</label>
|
||||
<div class="control">
|
||||
{{ record.issued_date ? $dayjs(record.issued_date).format("DD/MM/YYYY") : "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("issued_place") }}</label>
|
||||
<div class="control">
|
||||
{{ record.issued_place__name || "/" }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column is-3 pb-1 px-0">
|
||||
<div class="field">
|
||||
<label class="label">{{ findLang("update") }}</label>
|
||||
<div class="control">
|
||||
<span class="hyperlink" @click="openUser()">
|
||||
{{ record.updater__fullname }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Caption
|
||||
class="mt-5"
|
||||
v-bind="{
|
||||
title: store.lang === 'en' ? 'Images' : 'Hình ảnh',
|
||||
type: 'has-text-primary',
|
||||
}"
|
||||
></Caption>
|
||||
<ImageGallery
|
||||
v-bind="{ row: record, api: 'peoplefile', hideopt: true }"
|
||||
></ImageGallery>
|
||||
<div class="mt-2 border-bottom" id="ignore"></div>
|
||||
<div class="buttons mt-3" id="ignore">
|
||||
<button v-if="$getEditRights('edit', { code: 'customer', category: 'topmenu' })" class="button is-primary has-text-white" @click="edit()">
|
||||
Chỉnh sửa
|
||||
</button>
|
||||
<button
|
||||
class="button is-light has-text-black"
|
||||
@click="$exportpdf(docid, record.code)"
|
||||
>
|
||||
{{ findLang("print") }}
|
||||
</button>
|
||||
</div>
|
||||
<Modal
|
||||
@close="showmodal = undefined"
|
||||
v-bind="showmodal"
|
||||
@dataevent="changeInfo"
|
||||
v-if="showmodal"
|
||||
></Modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { useStore } from "~/stores/index";
|
||||
export default {
|
||||
setup() {
|
||||
const store = useStore();
|
||||
return { store };
|
||||
},
|
||||
props: ["row", "pagename", "noheader"],
|
||||
data() {
|
||||
return {
|
||||
record: undefined,
|
||||
errors: {},
|
||||
showmodal: undefined,
|
||||
docid: this.$id(),
|
||||
};
|
||||
},
|
||||
async created() {
|
||||
this.record = await this.$getdata(
|
||||
"people",
|
||||
{ id: this.row.people || this.row.id },
|
||||
undefined,
|
||||
true
|
||||
);
|
||||
},
|
||||
methods: {
|
||||
findLang(code) {
|
||||
let found = this.$find(this.store.common, { code: code });
|
||||
return found ? found[this.store.lang] : "";
|
||||
},
|
||||
copy(value) {
|
||||
this.$copyToClipboard(value);
|
||||
this.$snackbar("Đã copy vào clipboard.", "Copy", "Success");
|
||||
},
|
||||
openPhone() {
|
||||
this.showmodal = {
|
||||
title: this.findLang("phone"),
|
||||
height: "180px",
|
||||
width: "400px",
|
||||
component: "common/Phone",
|
||||
vbind: { row: this.row, pagename: this.pagename },
|
||||
};
|
||||
},
|
||||
selected(attr, obj) {
|
||||
this.record[attr] = obj;
|
||||
},
|
||||
edit() {
|
||||
this.showmodal = {
|
||||
component: "people/People",
|
||||
title: "Chỉnh sửa người liên quan",
|
||||
width: '65%',
|
||||
height: '400px',
|
||||
vbind: { row: this.record },
|
||||
};
|
||||
},
|
||||
changeInfo(v) {
|
||||
this.record = this.$copy(v);
|
||||
},
|
||||
openUser() {},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user