update
1.根据新疆反馈，修改相关问题
This commit is contained in:
@@ -0,0 +1,300 @@
|
||||
<template>
|
||||
<Dialog v-bind="$attrs" class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="handleClose" :maskClosable="false">
|
||||
<template #container>
|
||||
<Form style="width: 100%">
|
||||
<div style="width: 100%">
|
||||
<Row style="display: flex; flex-wrap: wrap; width: 100%; align-items: center">
|
||||
<Col :span="6">
|
||||
<a-form-item label="被救助人">
|
||||
<a-input
|
||||
style="background: #082147; border-color: #082147; color: #ffffff"
|
||||
placeholder="请输入姓名"
|
||||
v-model:value="name"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="6">
|
||||
<a-form-item label="性别">
|
||||
<a-select
|
||||
placeholder="选择性别"
|
||||
v-model:value="salvageUserSex"
|
||||
:options="[
|
||||
{
|
||||
label: '全部',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
label: '男',
|
||||
value: SexType.male,
|
||||
},
|
||||
{
|
||||
label: '女',
|
||||
value: SexType.female,
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="6">
|
||||
<a-form-item label="救助方式">
|
||||
<a-select
|
||||
placeholder="选择救助方式"
|
||||
v-model:value="initiatorType"
|
||||
:options="[
|
||||
{
|
||||
label: '全部',
|
||||
value: '',
|
||||
},
|
||||
{
|
||||
label: '120',
|
||||
value: '0',
|
||||
},
|
||||
{
|
||||
label: '应急就医',
|
||||
value: '1',
|
||||
},
|
||||
]"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="6">
|
||||
<a-form-item label="单位">
|
||||
<a-select
|
||||
:filterOption="
|
||||
(input: string, option: any): boolean => {
|
||||
const str: string = input.trim().toLowerCase();
|
||||
return option.label.toLowerCase().indexOf(str) >= 0;
|
||||
}
|
||||
"
|
||||
:show-search="true"
|
||||
placeholder="选择单位"
|
||||
@change="changeSecond"
|
||||
v-model:value="orgCode1"
|
||||
:options="option1"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="6">
|
||||
<a-form-item label="部门">
|
||||
<a-select
|
||||
:filterOption="
|
||||
(input: string, option: any): boolean => {
|
||||
const str: string = input.trim().toLowerCase();
|
||||
return option.label.toLowerCase().indexOf(str) >= 0;
|
||||
}
|
||||
"
|
||||
:show-search="true"
|
||||
placeholder="选择部门"
|
||||
v-model:value="orgCode2"
|
||||
:options="option2"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="8">
|
||||
<a-form-item label="时间">
|
||||
<a-range-picker
|
||||
v-model:value="dateTime"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
:bordered="false"
|
||||
:allowClear="false"
|
||||
style="width: 100%"
|
||||
/>
|
||||
</a-form-item>
|
||||
</Col>
|
||||
<Col :span="8">
|
||||
<div class="form-btn">
|
||||
<a-button size="middle" @click="handleClickReset" style="border-color: #00ccff">重置</a-button>
|
||||
<a-button
|
||||
size="middle"
|
||||
@click="handleClickSearch"
|
||||
:loading="loading"
|
||||
style="margin-left: 10px; background: #00ccff; border-color: #00ccff; color: #ffffff"
|
||||
>
|
||||
搜索
|
||||
</a-button>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
</Form>
|
||||
<BasicTable
|
||||
@table-load="tableLoad"
|
||||
ref="registerTable"
|
||||
class="table-container"
|
||||
:api="twoLModalApi"
|
||||
:columns="columns[1]"
|
||||
:api-params="formState"
|
||||
/>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Dialog from '/@/components/dialog/Dialog.vue';
|
||||
import { useDialog } from '/@/views/components/dialogHooks.ts';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { Form, Row, Col } from 'ant-design-vue';
|
||||
import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
|
||||
import { allSecondaryDepartsApi, getThreeDepartByOrgCodeApi, twoLModalApi } from '/@/views/indexSun/indexSun.api.ts';
|
||||
import { columns } from '/@/views/indexSun/indexSun.ts';
|
||||
import { SexType } from '/@/utils/settings.ts';
|
||||
|
||||
const loading = ref<boolean>(false);
|
||||
const registerTable = ref();
|
||||
const dialogTitle = ref('');
|
||||
const option1 = ref([{ label: '全部', value: '' }]);
|
||||
const option2 = ref([{ label: '全部', value: '' }]);
|
||||
const name = ref('');
|
||||
const salvageUserSex = ref('');
|
||||
const initiatorType = ref('');
|
||||
const orgCode1 = ref('');
|
||||
const orgCode2 = ref('');
|
||||
const formState = ref({});
|
||||
const dateTime = ref([]);
|
||||
const initForm = ref({});
|
||||
onMounted(() => {
|
||||
getSecondDepart();
|
||||
});
|
||||
function getSecondDepart() {
|
||||
allSecondaryDepartsApi({})
|
||||
.then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
const op: any[] = res?.result
|
||||
? res.result.map((it: any) => {
|
||||
return {
|
||||
label: it.departName,
|
||||
value: it.orgCode,
|
||||
};
|
||||
})
|
||||
: [];
|
||||
option1.value = option1.value.concat(op);
|
||||
} else {
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
}
|
||||
|
||||
function changeSecond() {
|
||||
orgCode2.value = '';
|
||||
option2.value = [{ label: '全部', value: '' }];
|
||||
if (orgCode1.value) {
|
||||
getThirdD();
|
||||
}
|
||||
}
|
||||
|
||||
function getThirdD() {
|
||||
getThreeDepartByOrgCodeApi({ orgCode: orgCode1.value })
|
||||
.then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
const op: any[] = res?.result
|
||||
? res.result.map((it: any) => {
|
||||
return {
|
||||
label: it.departName,
|
||||
value: it.orgCode,
|
||||
};
|
||||
})
|
||||
: [];
|
||||
option2.value = option2.value.concat(op);
|
||||
} else {
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.log(err);
|
||||
});
|
||||
}
|
||||
|
||||
function tableLoad(b: boolean) {
|
||||
loading.value = b;
|
||||
}
|
||||
|
||||
function handleClickSearch() {
|
||||
formState.value = {
|
||||
orgCode: orgCode2.value || orgCode1.value,
|
||||
realName: name.value,
|
||||
type: initForm.value.type,
|
||||
search: initForm.value.search,
|
||||
createTimeStart: dateTime.value && dateTime.value.length > 0 ? dateTime.value[0] : '',
|
||||
createTimeEnd: dateTime.value && dateTime.value.length > 0 ? dateTime.value[1] : '',
|
||||
};
|
||||
}
|
||||
|
||||
function handleClickReset() {
|
||||
orgCode1.value = '';
|
||||
orgCode2.value = '';
|
||||
name.value = '';
|
||||
salvageUserSex.value = '';
|
||||
initiatorType.value = '';
|
||||
dateTime.value = [initForm.value.createTimeStart, initForm.value.createTimeEnd];
|
||||
formState.value = initForm.value;
|
||||
}
|
||||
|
||||
const { visible, closeDialog, openDialog } = useDialog({ title: dialogTitle.value });
|
||||
|
||||
function handleClose() {
|
||||
orgCode2.value = '';
|
||||
orgCode1.value = '';
|
||||
name.value = '';
|
||||
salvageUserSex.value = '';
|
||||
initiatorType.value = '';
|
||||
closeDialog();
|
||||
}
|
||||
|
||||
function openD(params: any) {
|
||||
dialogTitle.value = '应急求助详情';
|
||||
initForm.value = params;
|
||||
formState.value = params;
|
||||
dateTime.value = [params?.createTimeStart, params?.createTimeEnd];
|
||||
openDialog();
|
||||
}
|
||||
defineExpose({
|
||||
openDialog: openD,
|
||||
closeDialog,
|
||||
});
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
:deep(.dialog) {
|
||||
border: 1px solid #00ccff !important;
|
||||
}
|
||||
.index-modal {
|
||||
.form-btn {
|
||||
margin-bottom: 8px;
|
||||
padding-left: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.ant-form-item-label > label) {
|
||||
color: #ffffff !important;
|
||||
padding-left: 20px;
|
||||
width: 100px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
:deep(.ant-form-item) {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
:deep(.ant-picker) {
|
||||
width: 250px;
|
||||
color: #fff !important;
|
||||
background-color: #082147 !important;
|
||||
border: 1px solid transparent !important;
|
||||
border-radius: 4px !important;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 30px;
|
||||
}
|
||||
:deep(.ant-picker-input > input) {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.ant-col {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
:deep(.anticon-calendar) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user