更新页面

This commit is contained in:
2025-07-08 20:10:24 +08:00
parent 28d7d0e8f0
commit f6390c9002
33 changed files with 1277 additions and 5106 deletions

View File

@ -1,287 +0,0 @@
<template>
<div>
<el-dialog
:title="titleValue"
width="1400px"
:model-value="modelValue"
@close="closed"
>
<el-form :model="listQuery" :inline="true">
<el-form-item label="所属部门">
<MOSTY.Department width="100%" clearable v-model="listQuery.ssbmdm" />
</el-form-item>
<el-form-item label="圈层名称">
<el-input
v-model="listQuery.qcmc"
placeholder="请输入圈层名称"
clearable
/>
</el-form-item>
<el-form-item>
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="info" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="tabBox" style="margin-top: 0px" v-if="modelValue">
<el-table
ref="multipleUserRef"
@selection-change="handleSelectionChange"
:data="tableData"
border
style="width: 100%"
:row-key="keyid"
height="450"
>
<el-table-column
type="selection"
width="55"
:reserve-selection="true"
v-if="props.multiple"
/>
<el-table-column width="55" #default="{ row }" v-else>
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
</el-table-column>
<el-table-column
label="序号"
type="index"
align="center"
sortable
width="80"
/>
<el-table-column
sortable
prop="ssbm"
label="所属部门"
show-overflow-tooltip
align="center"
></el-table-column>
<el-table-column
sortable
prop="qcmc"
show-overflow-tooltip
label="圈层名称"
align="center"
>
</el-table-column>
<el-table-column
sortable
prop="qclx"
show-overflow-tooltip
label="圈层类型"
align="center"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_QCLX" :value="row.qclx" :tag="false" />
</template>
</el-table-column>
<el-table-column
sortable
prop="qcjb"
show-overflow-tooltip
label="圈层等级"
align="center"
>
<template #default="{ row }">
<dict-tag :options="D_BZ_QCDJ" :value="row.qcjb" :tag="false" />
</template>
</el-table-column>
</el-table>
</div>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination
class="pagination"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent"
:page-sizes="[2, 5, 10, 20]"
:page-size="listQuery.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
></el-pagination>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="closed">取消</el-button>
<el-button type="primary" @click="onComfirm">确认</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage } from "element-plus";
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
import {
defineProps,
watch,
ref,
onMounted,
nextTick,
getCurrentInstance
} from "vue";
const { proxy } = getCurrentInstance();
const { D_BZ_QCLX, D_BZ_QCDJ } = proxy.$dict("D_BZ_QCLX", "D_BZ_QCDJ");
const props = defineProps({
//是否显示
modelValue: {
type: Boolean,
required: true
},
//标题
titleValue: {
type: String,
default: "选择圈层"
},
//是否多选
multiple: {
default: true,
type: Boolean
},
//已经选中得数据回显
data: {
type: Array,
default: []
}
});
const keyid = (row) => {
return row.id;
};
const total = ref(0);
const ridioIndex = ref(null);
const listQuery = ref({
pageCurrent: 1,
pageSize: 20,
qcmc: "",
ssbmdm: ""
});
const form = ref({});
const tableData = ref([]);
const emits = defineEmits(["close", "choosedQc"]);
const closed = () => {
emits("close", false);
};
const reset = () => {
listQuery.value = {
pageCurrent: 1,
pageSize: 20,
qcmc: "",
ssbmdm: ""
};
getListData();
};
//确认选中
const onComfirm = () => {
if (props.multiple) {
//多选
const List = JSON.parse(JSON.stringify(multipleSelectionUser.value));
if (List.length === 0) {
proxy.$message.warning("请选择圈层");
return;
}
emits("choosedQc", List);
} else {
//单选
if (![ridioIndex.value][0]) {
proxy.$message.warning("请选择圈层");
return;
}
const info = tableData.value.find((item) => {
return item.id === ridioIndex.value;
});
emits("choosedQc", [info]);
}
closed();
};
onMounted(() => {
getListData();
});
/**
* pageSize 改变触发
*/
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
/**
* 页码改变触发
*/
const handleCurrentChange = (currentPage) => {
listQuery.value.pageSize = currentPage;
getListData();
};
//圈层数据
const getListData = async () => {
qcckGet(listQuery.value, "/mosty-jcgl/qc/selectQcList").then((res) => {
tableData.value = res?.records;
multipleUser(props.data, tableData.value);
total.value = Number(res.total);
});
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const multipleUserRef = ref(null); //表单
//多选选中的数据
const multipleSelectionUser = ref([]);
const handleSelectionChange = (val) => {
multipleSelectionUser.value = val;
};
//回显
function multipleUser(row, list) {
if (row) {
if (props.multiple) {
row.forEach((item) => {
list.forEach((select) => {
if (item.id == select.id) {
if (multipleUserRef.value) {
multipleUserRef.value.toggleRowSelection(select, true);
}
}
});
});
}
}
}
watch(
() => props.modelValue,
(val) => {
if (val === true) {
handleFilter();
}
}
);
watch(
() => props.data,
(val) => {
if (multipleUserRef.value) multipleUser(val, tableData.value);
}
);
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
::v-deep .el-form--inline {
padding-left: 0 !important;
}
::v-deep .el-radio__label {
display: none;
}
</style>
<style lang="scss">
.el-dialog {
// --el-dialog-bg-color: #fff !important;
}
// .el-dialog__title {
// color: #fff !important;
// }
</style>

View File

@ -16,7 +16,6 @@ import StationSelect from "./StationSelect/index.vue";
import Provinces from "./Provinces2/index.vue";
import MarkdownEdit from "./MarkdownEdit/index.vue";
import FileUpload from "./FileUpload/index.vue";
import RichOnly from "./RichOnly/index.vue";
import Date from "./Date/index.vue";
import Empty from "./Empty/index.vue";
export {
@ -38,7 +37,6 @@ export {
Provinces,
MarkdownEdit,
FileUpload,
RichOnly,
Date,
Empty
};