You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

71 lines
2.2 KiB

<template>
<div>
<platform-grid
ref="dictionaryGridRef"
:table-props="{ borderded: false, flat: true }"
:table-title="dictionaryConfigure.tableTitle"
:table-init-load-data="dictionaryConfigure.tableInitLoadData"
:table-row-key="dictionaryConfigure.tableRowKey"
:table-data-url="dictionaryConfigure.tableDataUrl"
:table-columns="dictionaryConfigure.tableColumns"
:table-buttons="dictionaryConfigure.tableButtons"
:add-form-props="dictionaryConfigure.addFormProps"
:table-show-sort-no="false"
:table-dense="true"
:table-row-drag="true"
:table-pagination="dictionaryConfigure.tablePagination"
@row-drag-drop-after="rowDragDropAfter"
>
</platform-grid>
</div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { Environment, axios } from 'platform-core';
const { t } = useI18n();
const dictionaryGridRef = ref();
const dictionaryConfigure = {
tableTitle: '数据字典列表',
tableInitLoadData: true,
tableRowKey: 'id',
tableDataUrl: Environment.apiContextPath('/api/system/dictionary'),
tablePagination: {
sortBy: 'order',
descending: false,
reqPageStart: 0,
rowsPerPage: 0,
},
tableColumns: [
{ name: 'code', label: t('code') },
{ name: 'value', label: t('value') },
{ name: 'value', label: t('displayValue'), format: (value) => t(value) },
{ name: 'order', label: t('order') },
],
tableButtons: ['refresh', 'add', 'edit', 'delete'],
addFormProps: {
dialogInitWidth: '50%',
dialogInitHeight: '90%',
formColsNumber: 1,
formColsAuto: false,
formFields: [
{ modelName: 'code', label: t('code'), type: 'text', required: true },
{ modelName: 'value', label: t('value'), type: 'text', required: true },
{ modelName: 'order', label: t('order'), type: 'text', required: true },
],
},
};
const rowDragDropAfter = () => {
const rows = dictionaryGridRef.value.getRowsFun();
for (let i = 0; i < rows.length; i++) {
rows[i].order = i;
}
axios.post(Environment.apiContextPath('/api/system/dictionary/updateDictionariesOrder'), rows).then(() => {
//dictionaryGridRef.value.refreshTable();
});
};
</script>