update 增加应急单弹窗、调整echart图表
This commit is contained in:
zk
@@ -370,7 +370,7 @@ export function barOption(xData, ydata, theme) {
|
||||
grid: {
|
||||
top: '18%',
|
||||
left: '8%',
|
||||
right: '8%',
|
||||
right: '4%',
|
||||
bottom: '15%',
|
||||
},
|
||||
tooltip: {
|
||||
|
||||
@@ -5,6 +5,7 @@ export enum Api {
|
||||
server = '/health-emergency/emergency/tblUserHelp/statistics',
|
||||
getDetail = '/health-medical/medical/hospital/getMedicalHospital',
|
||||
complaint = '/health-emergency/emergency/tblHelpCenter/sicknessTypeStatistic',
|
||||
orderDetail = '/health-emergency/emergency/order/list',
|
||||
}
|
||||
|
||||
//获取全部部门
|
||||
@@ -15,3 +16,5 @@ export const list = (params: any) => get(Api.server, params);
|
||||
export const complaint = (params: any) => get(Api.complaint, params);
|
||||
//体检数据
|
||||
export const getDetail = (params: any) => get(Api.getDetail, params);
|
||||
//获取主诉分类应急工单详情
|
||||
export const getOrderDetail = (params: any) => get(Api.orderDetail, params);
|
||||
|
||||
@@ -1,6 +1,8 @@
|
||||
<template>
|
||||
<div class="common-card" :class="[themeType]">
|
||||
<public-title title="主诉分类" :themeType="themeType" />
|
||||
<public-title title="主诉分类" :themeType="themeType">
|
||||
<template #right><span class="right-text" :class="[themeType]" @click="viewDetail">查看详情</span> </template>
|
||||
</public-title>
|
||||
<div class="zc-inner">
|
||||
<div class="title">
|
||||
<div class="type-all">
|
||||
@@ -37,6 +39,7 @@
|
||||
type: Boolean,
|
||||
},
|
||||
});
|
||||
const emit = defineEmits(['viewDetail']);
|
||||
const { themeType } = useTheme();
|
||||
const { setSession, getSession } = useSession();
|
||||
const { LEFT_KEY2 } = caching;
|
||||
@@ -114,8 +117,30 @@
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 查看详情
|
||||
*/
|
||||
function viewDetail() {
|
||||
emit('viewDetail');
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.right-text {
|
||||
font-weight: 100;
|
||||
cursor: pointer;
|
||||
margin-right: 3px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.right-text.light {
|
||||
color: #667ecc;
|
||||
}
|
||||
|
||||
.right-text:hover {
|
||||
color: #129bff;
|
||||
}
|
||||
|
||||
.zc-inner {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
@@ -38,6 +38,7 @@
|
||||
.dialog {
|
||||
border: 1px solid #0a50a0;
|
||||
background-color: #00152b;
|
||||
padding-bottom: 0;
|
||||
|
||||
.ant-modal-title {
|
||||
position: relative;
|
||||
@@ -68,10 +69,14 @@
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.ant-modal-close-x,
|
||||
.anticon {
|
||||
color: #999999 !important;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.ant-modal-close-x {
|
||||
color: #999999 !important;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
|
||||
@@ -73,7 +73,6 @@
|
||||
|
||||
async function getRecords() {
|
||||
try {
|
||||
dataSource.value = [];
|
||||
tableLoading.value = true;
|
||||
const { code, result } = await props.api({ ...props.apiParams, pageSize: pageSize.value, pageNo: current.value });
|
||||
if (code == 200) {
|
||||
@@ -85,6 +84,9 @@
|
||||
paginationProp.value = { ...paginationProp.value, ...result };
|
||||
paginationProp.value.pageSize = result.size;
|
||||
}
|
||||
} catch (e) {
|
||||
dataSource.value = [];
|
||||
tableLoading.value = false;
|
||||
} finally {
|
||||
tableLoading.value = false;
|
||||
}
|
||||
@@ -114,6 +116,7 @@
|
||||
border-top: 1px solid var(--tableHeadBg) !important;
|
||||
border-bottom: none;
|
||||
padding: 9px 9px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
:deep(.ant-table-cell-scrollbar) {
|
||||
@@ -141,6 +144,7 @@
|
||||
background-color: var(--tableRowBg) !important;
|
||||
border-bottom: 1px solid var(--tableRowBorder);
|
||||
padding: 10px 4px !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
:deep(.ant-table-tbody > tr.ant-table-row:hover > td, .ant-table-tbody > tr > td.ant-table-cell-row-hover) {
|
||||
|
||||
@@ -0,0 +1,89 @@
|
||||
<template>
|
||||
<Dialog class="order-dialog" :openVis="visible" width="60%" :title="title" @close="closeDialog" :maskClosable="false">
|
||||
<template #container>
|
||||
<BasicTable
|
||||
ref="registerTable"
|
||||
class="table-container"
|
||||
:class="[themeType]"
|
||||
:key="visible"
|
||||
:columns="columns"
|
||||
:api="getOrderDetail"
|
||||
></BasicTable>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
|
||||
import { useDialog } from '/@/views/components/dialogHooks.ts';
|
||||
import { ref, watch } from 'vue';
|
||||
import Dialog from '/@/components/dialog/Dialog.vue';
|
||||
import { useTheme } from '/@/hooks/theme/useTheme.ts';
|
||||
import { getOrderDetail } from '/@/components/body-d-left/left.api.ts';
|
||||
|
||||
const props = defineProps({
|
||||
title: String,
|
||||
});
|
||||
const { themeType } = useTheme();
|
||||
const columns = [
|
||||
{
|
||||
title: '被救助人',
|
||||
dataIndex: 'salvageUserName',
|
||||
key: 'salvageUserName',
|
||||
},
|
||||
{
|
||||
title: '单位',
|
||||
dataIndex: 'salvageUserSecondDepart',
|
||||
key: 'salvageUserSecondDepart',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
dataIndex: 'salvageUserDepart',
|
||||
key: 'salvageUserDepart',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
dataIndex: 'salvageUserSex',
|
||||
key: 'salvageUserSex',
|
||||
width: 80,
|
||||
customRender: ({ text }) => {
|
||||
if (!text) return '';
|
||||
return text == '1' ? '女' : '男';
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '求助方式',
|
||||
dataIndex: 'initiatorType',
|
||||
key: 'initiatorType',
|
||||
width: 100,
|
||||
customRender: ({ text }) => {
|
||||
return text == '0' ? '120' : text == '1' ? '应急就医' : '';
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '求助时间',
|
||||
dataIndex: 'createTime',
|
||||
key: 'createTime',
|
||||
},
|
||||
{
|
||||
title: '电话',
|
||||
dataIndex: 'salvageUserMobile',
|
||||
key: 'salvageUserMobile',
|
||||
},
|
||||
];
|
||||
const { visible, title, closeDialog, openDialog } = useDialog({ title: props.title });
|
||||
const registerTable = ref(null);
|
||||
watch(props, () => {
|
||||
registerTable.value?.getRecords();
|
||||
});
|
||||
defineExpose({
|
||||
openDialog,
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.table-container {
|
||||
margin: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<Dialog class="phone-dialog" :openVis="visible" width="50%" :title="title" @close="closeDialog" :maskClosable="false">
|
||||
<Dialog class="phone-dialog" :openVis="visible" width="60%" :title="title" @close="closeDialog" :maskClosable="false">
|
||||
<template #container>
|
||||
<div v-if="useForm" class="form-container">
|
||||
<Form :model="formRecord" :label-width="100" v-bind="formItemLayout">
|
||||
@@ -61,16 +61,19 @@
|
||||
title: '单位',
|
||||
dataIndex: 'departName',
|
||||
key: 'departName',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '部门',
|
||||
dataIndex: 'orgName',
|
||||
key: 'orgName',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '性别',
|
||||
dataIndex: 'sex_dictText',
|
||||
key: 'sex_dictText',
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: '时间',
|
||||
|
||||
+15
-1
@@ -10,7 +10,7 @@
|
||||
<div class="body-d">
|
||||
<div class="body-d-left" :class="[themeType]">
|
||||
<one-l theme="light" :setting="setting" :refreshState="refreshState" @handleClick="handlePhoneDialog" />
|
||||
<two-l theme="light" :key="tabState" :refreshState="refreshState" />
|
||||
<two-l theme="light" :key="tabState" :refreshState="refreshState" @view-detail="viewDetail" />
|
||||
<three-l :key="tabState" :setting="setting" :refreshState="refreshState" />
|
||||
</div>
|
||||
<div class="body-d-middle">
|
||||
@@ -28,10 +28,14 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom-d"></div>
|
||||
<!-- 云坐席弹窗 -->
|
||||
<YunZuoXiDialog ref="yunZuoXiDialogRef" :record="xianYunData" @confirmHelp="confirmHelp" />
|
||||
<EmployeeDialog ref="employeeDialogRef" :record="socketData" />
|
||||
<EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" @confirmHelp="confirmHelp" />
|
||||
<!-- 服务详情数据弹窗 -->
|
||||
<PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
|
||||
<!-- 主诉分类应急工单弹窗-->
|
||||
<OrderDialog ref="orderDialogRef" title="应急工单"></OrderDialog>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
@@ -53,6 +57,7 @@
|
||||
import { DataType, getSettings, ThemeType } from '/@/utils/settings.ts';
|
||||
import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
||||
import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
|
||||
import OrderDialog from '/@/views/components/orderDialog.vue';
|
||||
import { Map } from '/@/assets/mapUtils/map.ts';
|
||||
import { useUserStore } from '/@/store/modules/user.ts';
|
||||
import { lightMapOption } from '/@/assets/mapUtils/mapConstant.ts';
|
||||
@@ -332,6 +337,15 @@
|
||||
emergencyDialogRef.value.openDialog();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 应急单查看详情
|
||||
*/
|
||||
const orderDialogRef = ref(null);
|
||||
|
||||
function viewDetail() {
|
||||
orderDialogRef.value.openDialog();
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.outer {
|
||||
|
||||
+3
-2
@@ -60,7 +60,8 @@ export default defineConfig({
|
||||
// @iconify/iconify: The dependency is dynamically and virtually loaded by @purge-icons/generated, so it needs to be specified explicitly
|
||||
include: ['lodash-es', 'ant-design-vue/es/locale/zh_CN', 'ant-design-vue/es/locale/en_US'],
|
||||
},
|
||||
// build: {
|
||||
build: {
|
||||
sourcemap: false,
|
||||
// rollupOptions: {
|
||||
// output: {
|
||||
// //入口文件输出配置
|
||||
@@ -84,5 +85,5 @@ export default defineConfig({
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
},
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user