Refactoring code module 03_recruiting

This commit is contained in:
STW_TTTY\stwtt 2024-09-17 15:56:06 +07:00
parent b223c2433e
commit 87e2e3b080
36 changed files with 6139 additions and 6335 deletions

View file

@ -1,4 +1,194 @@
<!-- card อมลทอย -->
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import type { PropType } from "vue";
import http from "@/plugins/http";
import config from "@/app.config";
import type {
Address,
DataOption,
} from "@/modules/03_recruiting/interface/index/Main";
import {
defaultAddress,
changeData,
} from "@/modules/03_recruiting/interface/index/Main";
import HeaderTop from "@/modules/03_recruiting/components/top.vue";
import { useRoute } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
const props = defineProps({
provinceOptions: {
type: Array as PropType<DataOption[]>,
required: true,
},
status: {
type: String,
required: true,
},
form: {
type: Object,
required: true,
},
});
const $q = useQuasar();
const route = useRoute();
const candidateId = ref<string>(route.params.candidateId.toString());
const edit = ref<boolean>(true);
const myform = ref<any>({});
const districtOptions = ref<DataOption[]>([]);
const districtCOptions = ref<DataOption[]>([]);
const subdistrictOptions = ref<DataOption[]>([]);
const subdistrictCOptions = ref<DataOption[]>([]);
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader } = mixin;
const emit = defineEmits(["update:form"]);
watch(myform, async (count: any, prevCount: any) => {
emit("update:form", count);
});
watch(defaultAddress, async (count: Address, prevCount: Address) => {
await changeData("address", count);
});
onMounted(async () => {
await fetchData();
if (defaultAddress.value.provinceId != null)
await fetchDistrict(defaultAddress.value.provinceId, "1");
if (defaultAddress.value.provinceIdC != null)
await fetchDistrict(defaultAddress.value.provinceIdC, "2");
if (defaultAddress.value.districtId != null)
await fetchSubDistrict(defaultAddress.value.districtId, "1");
if (defaultAddress.value.districtIdC != null)
await fetchSubDistrict(defaultAddress.value.districtIdC, "2");
});
const fetchData = async () => {
await http
.get(config.API.candidateAddress(candidateId.value))
.then((res) => {
const data = res.data.result;
defaultAddress.value.address = data.registAddress;
defaultAddress.value.addressC = data.currentAddress;
defaultAddress.value.provinceId = data.registProvinceId;
defaultAddress.value.provinceIdC = data.currentProvinceId;
defaultAddress.value.districtId = data.registDistrictId;
defaultAddress.value.districtIdC = data.currentDistrictId;
defaultAddress.value.subdistrictId = data.registSubDistrictId;
defaultAddress.value.subdistrictIdC = data.currentSubDistrictId;
defaultAddress.value.code = data.registZipCode;
defaultAddress.value.codeC = data.currentZipCode;
defaultAddress.value.same =
data.registSame == true ? "1" : data.registSame == false ? "0" : null;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const selectProvince = (e: string, name: string) => {
if (name == "1") {
defaultAddress.value.districtId = "";
defaultAddress.value.subdistrictId = "";
defaultAddress.value.code = null;
} else {
defaultAddress.value.districtIdC = "";
defaultAddress.value.subdistrictIdC = "";
defaultAddress.value.codeC = null;
}
myform.value.resetValidation();
fetchDistrict(e, name);
};
const selectDistrict = (e: string, name: string) => {
if (name == "1") {
defaultAddress.value.subdistrictId = "";
defaultAddress.value.code = null;
} else {
defaultAddress.value.subdistrictIdC = "";
defaultAddress.value.codeC = null;
}
myform.value.resetValidation();
fetchSubDistrict(e, name);
};
const selectSubDistrict = (e: string, name: string) => {
if (name == "1") {
const findcode = subdistrictOptions.value.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : null;
defaultAddress.value.code = namecode;
} else {
const findcode = subdistrictCOptions.value.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : null;
defaultAddress.value.codeC = namecode;
}
};
const fetchDistrict = async (id: string, position: string) => {
showLoader();
await http
.get(config.API.listDistrict(id))
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() });
});
if (position == "1") {
districtOptions.value = option;
} else {
districtCOptions.value = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const fetchSubDistrict = async (id: string, position: string) => {
showLoader();
await http
.get(config.API.listSubDistrict(id))
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: DataOption) => {
option.push({
id: r.id.toString(),
name: r.name.toString(),
zipCode: r.zipCode != null ? r.zipCode : null,
});
});
if (position == "1") {
subdistrictOptions.value = option;
} else {
subdistrictCOptions.value = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>
<HeaderTop
v-model:edit="edit"
@ -228,193 +418,3 @@
</div>
</q-form>
</template>
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import type { PropType } from "vue";
import http from "@/plugins/http";
import config from "@/app.config";
import type {
Address,
DataOption,
} from "@/modules/03_recruiting/interface/index/Main";
import {
defaultAddress,
changeData,
} from "@/modules/03_recruiting/interface/index/Main";
import HeaderTop from "@/modules/03_recruiting/components/top.vue";
import { useRoute } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
const props = defineProps({
provinceOptions: {
type: Array as PropType<DataOption[]>,
required: true,
},
status: {
type: String,
required: true,
},
form: {
type: Object,
required: true,
},
});
const $q = useQuasar();
const route = useRoute();
const candidateId = ref<string>(route.params.candidateId.toString());
const edit = ref<boolean>(true);
const myform = ref<any>({});
const districtOptions = ref<DataOption[]>([]);
const districtCOptions = ref<DataOption[]>([]);
const subdistrictOptions = ref<DataOption[]>([]);
const subdistrictCOptions = ref<DataOption[]>([]);
const mixin = useCounterMixin();
const { messageError, showLoader, hideLoader } = mixin;
const emit = defineEmits(["update:form"]);
watch(myform, async (count: any, prevCount: any) => {
emit("update:form", count);
});
watch(defaultAddress, async (count: Address, prevCount: Address) => {
await changeData("address", count);
});
onMounted(async () => {
await fetchData();
if (defaultAddress.value.provinceId != null)
await fetchDistrict(defaultAddress.value.provinceId, "1");
if (defaultAddress.value.provinceIdC != null)
await fetchDistrict(defaultAddress.value.provinceIdC, "2");
if (defaultAddress.value.districtId != null)
await fetchSubDistrict(defaultAddress.value.districtId, "1");
if (defaultAddress.value.districtIdC != null)
await fetchSubDistrict(defaultAddress.value.districtIdC, "2");
});
const fetchData = async () => {
await http
.get(config.API.candidateAddress(candidateId.value))
.then((res) => {
const data = res.data.result;
defaultAddress.value.address = data.registAddress;
defaultAddress.value.addressC = data.currentAddress;
defaultAddress.value.provinceId = data.registProvinceId;
defaultAddress.value.provinceIdC = data.currentProvinceId;
defaultAddress.value.districtId = data.registDistrictId;
defaultAddress.value.districtIdC = data.currentDistrictId;
defaultAddress.value.subdistrictId = data.registSubDistrictId;
defaultAddress.value.subdistrictIdC = data.currentSubDistrictId;
defaultAddress.value.code = data.registZipCode;
defaultAddress.value.codeC = data.currentZipCode;
defaultAddress.value.same =
data.registSame == true ? "1" : data.registSame == false ? "0" : null;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const selectProvince = (e: string, name: string) => {
if (name == "1") {
defaultAddress.value.districtId = "";
defaultAddress.value.subdistrictId = "";
defaultAddress.value.code = null;
} else {
defaultAddress.value.districtIdC = "";
defaultAddress.value.subdistrictIdC = "";
defaultAddress.value.codeC = null;
}
myform.value.resetValidation();
fetchDistrict(e, name);
};
const selectDistrict = (e: string, name: string) => {
if (name == "1") {
defaultAddress.value.subdistrictId = "";
defaultAddress.value.code = null;
} else {
defaultAddress.value.subdistrictIdC = "";
defaultAddress.value.codeC = null;
}
myform.value.resetValidation();
fetchSubDistrict(e, name);
};
const selectSubDistrict = (e: string, name: string) => {
if (name == "1") {
const findcode = subdistrictOptions.value.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : null;
defaultAddress.value.code = namecode;
} else {
const findcode = subdistrictCOptions.value.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : null;
defaultAddress.value.codeC = namecode;
}
};
const fetchDistrict = async (id: string, position: string) => {
showLoader();
await http
.get(config.API.listDistrict(id))
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() });
});
if (position == "1") {
districtOptions.value = option;
} else {
districtCOptions.value = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const fetchSubDistrict = async (id: string, position: string) => {
showLoader();
await http
.get(config.API.listSubDistrict(id))
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: DataOption) => {
option.push({
id: r.id.toString(),
name: r.name.toString(),
zipCode: r.zipCode != null ? r.zipCode : null,
});
});
if (position == "1") {
subdistrictOptions.value = option;
} else {
subdistrictCOptions.value = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>