|
@@ -13,6 +13,12 @@
|
|
|
<a-descriptions-item label="经度">{{ siteInfo.siteLongitude }}</a-descriptions-item>
|
|
|
<a-descriptions-item label="纬度">{{ siteInfo.siteLatitude }}</a-descriptions-item>
|
|
|
</a-descriptions>
|
|
|
+ <a-divider orientation="left">站点工作人员</a-divider>
|
|
|
+ <a-table :columns="siteUserColumns" :data-source="siteUserList" :scroll="{ x:'100%', y: 200 }"
|
|
|
+ :pagination="siteUserTabPagination"
|
|
|
+ @change="siteUserTabChange"
|
|
|
+ bordered>
|
|
|
+ </a-table>
|
|
|
<a-divider orientation="left">其他信息</a-divider>
|
|
|
<a-descriptions bordered>
|
|
|
<a-descriptions-item label="备注">{{ siteInfo.remark }}</a-descriptions-item>
|
|
@@ -21,11 +27,15 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import {onMounted, reactive} from "vue";
|
|
|
+import {computed, onMounted, reactive, ref} from "vue";
|
|
|
import {getSiteByID} from "@/api/baseSettings/siteInfo";
|
|
|
+import type {TableColumnsType, TableProps} from "ant-design-vue";
|
|
|
+import {getSiteUserList} from "@/api/baseSettings/userInfo";
|
|
|
+import {getPaginationTotalTitle} from "@/utils/common";
|
|
|
|
|
|
// 站点信息
|
|
|
const siteInfo = reactive({
|
|
|
+ siteID: "",
|
|
|
siteCode: "",
|
|
|
siteName: "",
|
|
|
institutionName: "",
|
|
@@ -38,6 +48,40 @@ const siteInfo = reactive({
|
|
|
siteLatitude: "",
|
|
|
remark: "",
|
|
|
})
|
|
|
+// 站点人员查询数据
|
|
|
+const siteUserSearchParams = reactive({
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ siteUserName: '',
|
|
|
+ siteID: '',
|
|
|
+ userNo: ""
|
|
|
+});
|
|
|
+// 站点人员表结构
|
|
|
+const siteUserColumns: TableColumnsType = [
|
|
|
+ {
|
|
|
+ title: '序号',
|
|
|
+ align: "center",
|
|
|
+ key: 'siteUserID',
|
|
|
+ customRender: item => `${siteUserSearchParams.pageSize * (siteUserSearchParams.pageIndex - 1) + item.index + 1}`
|
|
|
+ },
|
|
|
+ {title: '工号', dataIndex: 'userNo', key: 'userNo', align: "center"},
|
|
|
+ {title: '人员名称', dataIndex: 'siteUserName', key: 'siteUserName', align: "center"},
|
|
|
+ {title: '性别', dataIndex: 'genderName', key: 'genderName', align: "center"},
|
|
|
+ {title: '联系电话', dataIndex: 'mobile', key: 'mobile', align: "center"},
|
|
|
+];
|
|
|
+// 站点人员数据
|
|
|
+const siteUserList = ref([]);
|
|
|
+const siteUserTabFormState = reactive({
|
|
|
+ total: 0,
|
|
|
+ loading: false
|
|
|
+});
|
|
|
+const siteUserTabPagination = computed(() => ({
|
|
|
+ total: siteUserTabFormState.total,
|
|
|
+ current: siteUserSearchParams.pageIndex,
|
|
|
+ pageSize: siteUserSearchParams.pageSize,
|
|
|
+ showSizeChanger: true,
|
|
|
+ showTotal: total => getPaginationTotalTitle(total)
|
|
|
+}));
|
|
|
|
|
|
// 站点数据加载
|
|
|
function loadData(siteID: any) {
|
|
@@ -46,8 +90,24 @@ function loadData(siteID: any) {
|
|
|
siteInfo[key] = result[key];
|
|
|
})
|
|
|
});
|
|
|
+ findSiteUser(siteID)
|
|
|
}
|
|
|
|
|
|
+// 查询站点人员数据
|
|
|
+function findSiteUser(siteId: string) {
|
|
|
+ siteUserSearchParams["siteID"] = siteId;
|
|
|
+ getSiteUserList(siteUserSearchParams).then((result: any) => {
|
|
|
+ siteUserList.value = result.list;
|
|
|
+ });
|
|
|
+}
|
|
|
+
|
|
|
+// 站点人员表格变更
|
|
|
+const siteUserTabChange: TableProps['onChange'] = (pag: { pageSize: number; current: number },) => {
|
|
|
+ siteUserSearchParams.pageIndex = pag.current;
|
|
|
+ siteUserSearchParams.pageSize = pag.pageSize;
|
|
|
+ findSiteUser(siteInfo.siteID);
|
|
|
+};
|
|
|
+
|
|
|
// 页面初始化
|
|
|
onMounted(() => {
|
|
|
const id = history.state.params?.id;
|