Commit 6a1c9825 authored by Tình Trương's avatar Tình Trương

update

parent 44cfd6fa
......@@ -19,14 +19,14 @@
<q-card-section>
<div class="row q-col-gutter-sm">
<div class="col-12">
<div align="right">
<!-- <div align="right">
<UploadImage
v-if="urlFileLocal.length !== 0"
:isButton="false"
:tooltipMessageStory="true"
@selectedFile="uploadStory"
></UploadImage>
</div>
</div> -->
<q-card v-if="urlFileLocal" flat>
<div align="center">
<q-img
......@@ -37,10 +37,7 @@
</div>
</q-card>
<UploadImage
v-if="urlFileLocal.length === 0"
@selectedFile="uploadStory"
></UploadImage>
<UploadImage @selectedFile="uploadStory"></UploadImage>
<q-input
v-model="title"
......@@ -104,7 +101,7 @@ export default defineComponent({
},
},
setup(props) {
setup(props, context) {
const configImg = config;
const id: Ref<number | null> = ref(null);
const file: Ref<File | string> = ref('');
......@@ -137,6 +134,16 @@ export default defineComponent({
content.value = '';
urlFileLocal.value = '';
};
const SubmitData = () => {
context.emit('click:CloseBtnUpdateStory');
context.emit('updateData', {
id: id.value,
file: file.value,
title: title.value,
content: content.value,
imageUrl: urlFileLocal.value,
});
};
return {
uploadStory,
......@@ -148,6 +155,7 @@ export default defineComponent({
id,
configImg,
imageAPI,
SubmitData,
};
},
......@@ -155,6 +163,7 @@ export default defineComponent({
'selectedFile',
'update:isOpenUpdateStory',
'click:CloseBtnUpdateStory',
'updateData',
],
});
</script>
......@@ -35,58 +35,97 @@
:model-value="namePage"
@update:model-value="$emit('update:namePage', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.namePage')"
class="q-my-sm"
type="text"
outlined
lazy-rules
:rules="namePageRules"
clearable
></q-input>
<!-- <q-tabs
v-model="tabNamePage"
dense
align="left"
active-color="primary"
indicator-color="primary"
narrow-indicator
:breakpoint="0"
>
<q-tab
v-for="(info, index) in languageOptions"
:key="`${info.language.id}-${index}`"
:name="info.language.code"
:label="info.language.name"
no-caps
/>
</q-tabs>
<q-separator />
<q-tab-panels v-model="tabNamePage" animated>
<q-tab-panel
v-for="(info, index) in languageOptions"
:key="`${info.language.id}-${index}`"
:name="info.language.code"
class="q-pt-none; q-pa-none"
>
<q-input
:model-value="numIndex"
@update:model-value="$emit('update:numIndex', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.numIndex')"
class="q-my-sm"
:model-value="info.namePage"
@update:model-value="$emit('update:namePage', $event)"
:label="
$t('listConfigSystem.dialogLabel.fieldLabels.namePage')
"
type="text"
outlined
lazy-rules
:rules="namePageRules"
clearable
></q-input>
</div>
<div class="col-6">
</q-tab-panel>
</q-tab-panels> -->
<q-input
:model-value="url"
@update:model-value="$emit('update:url', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.url')"
:model-value="numIndex"
@update:model-value="$emit('update:numIndex', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.numIndex')"
class="q-my-sm"
type="text"
type="############"
outlined
:rules="urlRules"
clearable
></q-input>
<!-- :rules="nameMenuRules" -->
</div>
<div class="col-6">
<!-- q-pt-xl style="margin-top: -3px" -->
<q-select
:model-value="nameMenu"
@update:model-value="$emit('update:nameMenu', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.nameMenu')"
:options="nameMenuOptions"
:rules="nameMenuRules"
multiple
map-options
class="q-my-sm"
option-value="id"
option-label="name"
type="text"
lazy-rules
outlined
use-chips
clearable
></q-select>
<q-input
:model-value="url"
@update:model-value="$emit('update:url', $event)"
:label="$t('listConfigSystem.dialogLabel.fieldLabels.url')"
class="q-my-sm"
type="text"
outlined
:rules="urlRules"
clearable
></q-input>
</div>
<div class="col-12 q-pb-md">
<div>
<q-editor
:model-value="content"
@update:model-value="$emit('update:content', $event)"
ref="editorRef"
placeholder="Nội dung *"
style="min-height: 28rem"
style="min-height: 25rem"
toolbar-text-color="white"
toolbar-toggle-color="yellow-8"
toolbar-bg="primary"
......@@ -178,7 +217,130 @@
verdana: 'Verdana',
}"
/>
</div>
<!-- <q-tabs
v-model="tabContent"
dense
active-color="primary"
indicator-color="primary"
align="left"
narrow-indicator
>
<q-tab
v-for="(info, index) in languageOptions"
:key="`${info.language.id}-${index}`"
:name="info.language.code"
:label="info.language.name"
no-caps
/>
</q-tabs>
<q-separator />
<q-tab-panels v-model="tabContent" animated>
<q-tab-panel
v-for="(info, index) in languageOptions"
:key="`${info.language.id}-${index}`"
:name="info.language.code"
class="q-pt-none; q-pa-none"
>
<q-editor
:model-value="info.content"
@update:model-value="$emit('update:content', $event)"
ref="editorRef"
placeholder="Nội dung *"
style="min-height: 25rem"
toolbar-text-color="white"
toolbar-toggle-color="yellow-8"
toolbar-bg="primary"
:spellcheck="false"
:toolbar="[
[
{
label: $q.lang.editor.align,
icon: $q.iconSet.editor.align,
fixedLabel: true,
list: 'only-icons',
options: ['left', 'center', 'right', 'justify'],
},
],
[
'bold',
'italic',
'strike',
'underline',
'subscript',
'superscript',
],
['token', 'hr', 'link', 'custom_btn'],
['print', 'fullscreen'],
[
{
label: $q.lang.editor.formatting,
icon: $q.iconSet.editor.formatting,
list: 'no-icons',
options: [
'p',
'h1',
'h2',
'h3',
'h4',
'h5',
'h6',
'code',
],
},
{
label: $q.lang.editor.fontSize,
icon: $q.iconSet.editor.fontSize,
fixedLabel: true,
fixedIcon: true,
list: 'no-icons',
options: [
'size-1',
'size-2',
'size-3',
'size-4',
'size-5',
'size-6',
'size-7',
],
},
{
label: $q.lang.editor.defaultFont,
icon: $q.iconSet.editor.font,
fixedIcon: true,
list: 'no-icons',
options: [
'default_font',
'arial',
'arial_black',
'comic_sans',
'courier_new',
'impact',
'lucida_grande',
'times_new_roman',
'verdana',
],
},
'removeFormat',
],
['quote', 'unordered', 'ordered', 'outdent', 'indent'],
['undo', 'redo'],
['viewsource'],
]"
:fonts="{
arial: 'Arial',
arial_black: 'Arial Black',
comic_sans: 'Comic Sans MS',
courier_new: 'Courier New',
impact: 'Impact',
lucida_grande: 'Lucida Grande',
times_new_roman: 'Times New Roman',
verdana: 'Verdana',
}"
/>
</q-tab-panel>
</q-tab-panels> -->
</div>
</div>
</q-card-section>
......@@ -208,7 +370,7 @@
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, PropType, ref } from 'vue';
import { i18n } from 'src/boot/i18n';
export default defineComponent({
......@@ -222,8 +384,25 @@ export default defineComponent({
url: { type: String, required: true },
numIndex: { type: String, required: true },
content: { type: String, required: true },
nameMenu: { type: Number, required: true },
nameMenu: { type: Array, required: true },
nameMenuOptions: { type: Array, required: true },
// languageOptions: {
// type: Array as PropType<
// {
// namePage: string;
// url: string;
// content: string;
// numIndex: number;
// nameMenu: [];
// language: {
// id: number;
// code: string;
// name: string;
// };
// }[]
// >,
// required: true,
// },
},
setup() {
const namePageRules = [
......@@ -236,15 +415,19 @@ export default defineComponent({
(val && val.trim().length) ||
i18n.global.t('listConfigSystem.validateMessages.requireUrl'),
];
// const nameMenuRules = [
// (val?: number) =>
// val !== undefined ||
// i18n.global.t('listConfigSystem.validateMessages.requireNameMenu'),
// ];
const nameMenuRules = [
(val?: Array<unknown>) =>
val?.length ||
i18n.global.t('listConfigSystem.validateMessages.requireNameMenu'),
];
// const tabNamePage = ref('vi');
// const tabContent = ref('vi');
return {
namePageRules,
urlRules,
// nameMenuRules,
nameMenuRules,
// tabNamePage,
// tabContent,
};
},
emits: [
......
......@@ -106,19 +106,6 @@
</div>
</td>
</template>
<!-- <template v-slot:body-cell-url="rowData">
<q-td>
<div align="center">
<a
:href="rowData.row.url"
target="_blank"
style="max-width: 10rem"
>{{ rowData.row.url }}</a
>
</div>
</q-td>
</template> -->
</q-table>
</div>
<div class="col-12 q-mt-sm">
......@@ -142,6 +129,7 @@
:nameMenuOptions="nameMenuOptions"
@addUpdateConfigSystem="addConfigSystem"
/>
<!-- :languageOptions="languageOptions" -->
<AddUpdatePolicyDialog
v-model:isOpened="showDialogUpdate"
......@@ -153,6 +141,7 @@
:nameMenuOptions="nameMenuOptions"
@addUpdateConfigSystem="updateConfigSystem"
/>
<!-- :languageOptions="languageOptions" -->
</div>
</template>
......@@ -170,6 +159,7 @@ import {
AddConfigSystem,
UpdateConfigSystem,
DetailConfigSystem,
// LanguageType,
} from 'src/assets/type';
import { config, API_PATHS } from 'src/assets/configurations';
......@@ -269,6 +259,7 @@ export default defineComponent({
const content: Ref<string> = ref('');
const numIndex: Ref<number | undefined> = ref(undefined);
const ConfigSystemId: Ref<number | undefined> = ref(undefined);
// const languageOptions: Ref<FromType> = ref([]);
const getConfigSystem = async () => {
try {
......@@ -292,6 +283,7 @@ export default defineComponent({
};
const openAddDialog = () => {
// void getLanguage();
namePage.value = '';
content.value = '';
url.value = '';
......@@ -307,6 +299,7 @@ export default defineComponent({
numIndex: numIndex.value,
content: content.value,
// nameMenu: { id: nameMenu.value?.id },
// langs: languageOptions.value,
};
const response = (await api({
url: API_PATHS.addConfigSystem,
......@@ -344,6 +337,7 @@ export default defineComponent({
url.value = response.data.data.url;
numIndex.value = response.data.data.numIndex;
// nameMenu.value = response.data.data.nameMenu;
// languageOptions.value = response.data.data.langs;
content.value = response.data.data.content;
}
} catch (error) {}
......@@ -361,6 +355,7 @@ export default defineComponent({
numIndex: numIndex.value,
content: content.value,
// nameMenu: { id: nameMenu.value?.id },
// langs: languageOptions.value,
},
})) as AxiosResponse<BaseResponseBody<UpdateConfigSystem>>;
if (response.data.error.code === config.API_RES_CODE.OK.code) {
......@@ -417,6 +412,47 @@ export default defineComponent({
} catch (error) {}
};
// type FromType = {
// namePage: string;
// url: string;
// content: string;
// numIndex: number;
// nameMenu: [];
// language: {
// id: number;
// code: string;
// name: string;
// };
// }[];
// const getLanguage = async () => {
// const response = (await api({
// url: API_PATHS.getLanguage,
// method: 'GET',
// params: {},
// })) as AxiosResponse<BaseResponseBody<LanguageType[]>>;
// if (response.data.error.code === config.API_RES_CODE.OK.code) {
// languageOptions.value = response.data.data.reduce(
// (acc: FromType, info) => {
// acc.push({
// namePage: '',
// url: '',
// content: '',
// nameMenu: [],
// numIndex: 0,
// language: {
// id: info.id,
// code: info.code,
// name: info.name,
// },
// });
// return acc;
// },
// []
// );
// }
// };
onMounted(() => {
void getConfigSystem();
});
......@@ -446,6 +482,8 @@ export default defineComponent({
confirmDelete,
deleteConfigSystem,
nameMenuSreach,
// languageOptions,
// getLanguage,
};
},
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment