123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166 |
- <template>
- <div class="table-box">
- <LjVxeTable
- ref="VxeTableRef"
- row-key="springid"
- :columns="columns"
- :request-api="getData"
- :data-callback="dataCallback"
- :dwname="dwname"
- :table-props="tableProps"
- :table-events="tableEvents"
- :tool-button="['export', 'refresh', 'setting', 'search', 'location']"
- :auto-load-layout="false"
- pagination
- >
- <!-- 表格 header 按钮 -->
- <template #tableHeader>
- <el-button-group>
- <el-button @click="handleOpenNewTable">{{ $t("common.add") }}</el-button>
- <el-button @click="fDelete">{{ $t("common.delText") }}</el-button>
- <el-button @click="fAudit(0)">{{ $t("common.auditText") }}</el-button>
- <el-button @click="fAudit(1)">{{ $t("common.withdrawAuditText") }}</el-button>
- <el-button @click="fAudit(2)">{{ $t("common.disable") }}</el-button>
- <el-button @click="fAudit(3)">{{ $t("common.enabled") }}</el-button>
- </el-button-group>
- </template>
- </LjVxeTable>
- </div>
- <LjDialog
- ref="LjDrawerRef"
- class="is-selector"
- v-bind="{
- ...drawerDefineProp
- }"
- :style="{ padding: 0 }"
- >
- <template #header>
- <div class="flx-1">
- <span class="text-h5-b">弹簧资料</span>
- </div>
- </template>
- <div class="flx-1 h-full">
- <LjHeaderMenu :data="mainData" :action="orderStatus ? orderEditAction : orderDefaultAction" />
- <Detail class="flx-1" :data="mainData" :status="orderStatus" :enum="enumMap" />
- </div>
- </LjDialog>
- </template>
- <script setup lang="ts" name="baseinfo_springlist">
- import { ref, onMounted, provide } from "vue";
- import { getSpringList } from "@/api/modules/basicinfo";
- import { ColumnProps } from "@/components/LjVxeTable/interface";
- import LjDrawer from "@/components/LjDrawer/index.vue";
- import Detail from "./detail.vue";
- import { useHooks } from "./hooks/index";
- import LjDialog from "@/components/LjDialog/index.vue";
- import LjHeaderMenu from "@/components/LjHeaderMenu/index.vue";
- import { useI18n } from "vue-i18n";
- import { useAuthButtons } from "@/hooks/useAuthButtons";
- import { cloneDeep } from "lodash-es";
- const dwname = "web_springlist";
- const mainData = ref({});
- const tableProps = {
- height: "auto",
- editConfig: { trigger: "click", mode: "cell" }
- // rowClassName: rowClsNameFunc
- // exportConfig: {
- // filename: t("menu.saletaskmx") + formatToDate(new Date(), "YYYY-MM-DD HH:mm:ss")
- // }
- };
- const { t } = useI18n();
- const { VxeTableRef, LjDetailRef, columns, fDelete, fSave, fAudit } = useHooks(t);
- const { CheckPower, CheckOption, buttonNew, buttonDefault } = useAuthButtons(t);
- const orderStatus = ref("");
- const typename = ref("");
- const enumMap = ref(new Map());
- const orderDefaultAction = [
- buttonDefault({
- label: t("common.cancelText"),
- icon: "iconchevron-left"
- }),
- buttonNew({
- label: t("common.saveText"),
- icon: "iconsave-01",
- clickFunc: item => {
- const save_data = orderStatus.value == "new" ? LjDetailRef.value?.infoParam : LjDetailRef.value?._mainData;
- fSave({ spring: save_data }).then(() => {
- LjDrawerRef.value.hide();
- });
- }
- })
- ];
- const orderEditAction = [
- buttonNew({
- label: t("common.saveText"),
- icon: "iconsave-01",
- clickFunc: item => {
- const save_data = LjDetailRef.value?._mainData;
- fSave({ spring: save_data }).then(() => {
- LjDrawerRef.value.hide();
- });
- }
- })
- ];
- /*
- * @description 抽屉默认属性
- */
- const drawerDefineProp = {
- draggable: true,
- overflow: true,
- width: "40%"
- // modalClass: "lj-file-dialog"
- };
- const getData = (params: any) => {
- return getSpringList(params);
- };
- const dataCallback = (data: any) => {
- if (data.tableinfo?.columns) {
- data.tableinfo?.columns.map((item: any) => {
- if (item?.enum) {
- enumMap.value.set(item.field, item.enum);
- }
- });
- }
- return {
- list: data.datatable,
- tableinfo: data.tableinfo,
- total: data.totalcnt,
- pageNum: data.pageindex,
- pageSize: data.pagesize
- };
- };
- const LjDrawerRef = ref();
- const handleDBlClickTable = ({ row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }: any) => {
- // 弹窗
- mainData.value = cloneDeep(row);
- // typename.value = row.typename;
- orderStatus.value = "edit";
- LjDrawerRef.value.show();
- };
- const handleOpenNewTable = () => {
- mainData.value = {
- springid: 0
- };
- typename.value = "";
- orderStatus.value = "new";
- LjDrawerRef.value.show();
- };
- // 返回绑定的事件
- const tableEvents = {
- "cell-dblclick": handleDBlClickTable
- // "cell-click": handleClickTable
- };
- </script>
|