fix:修改联系人样式
This commit is contained in:
@@ -76,7 +76,7 @@
|
|||||||
<a-table
|
<a-table
|
||||||
:dataSource="dataSource"
|
:dataSource="dataSource"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
:scroll="{ x: 800, y: 700 }"
|
:scroll="{ x: 1000, y: 700 }"
|
||||||
:pagination="pagination">
|
:pagination="pagination">
|
||||||
<template #bodyCell="{ record, column }">
|
<template #bodyCell="{ record, column }">
|
||||||
<template v-if="column.dataIndex === 'address'">
|
<template v-if="column.dataIndex === 'address'">
|
||||||
@@ -138,7 +138,6 @@
|
|||||||
title: '部门',
|
title: '部门',
|
||||||
dataIndex: 'address',
|
dataIndex: 'address',
|
||||||
key: 'address',
|
key: 'address',
|
||||||
width: 200,
|
|
||||||
textEllipsis: true,
|
textEllipsis: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@@ -2,26 +2,18 @@
|
|||||||
<ns-modal
|
<ns-modal
|
||||||
v-model:visible="show"
|
v-model:visible="show"
|
||||||
width="1100px"
|
width="1100px"
|
||||||
style="overflow-y: hidden"
|
|
||||||
title="添加联系人"
|
title="添加联系人"
|
||||||
|
class="ns-modal-boxs"
|
||||||
@ok="handleOk"
|
@ok="handleOk"
|
||||||
@cancel="handleCancel">
|
@cancel="handleCancel">
|
||||||
|
<div class="ns-title-extra-box" style="position: absolute; top: 28px"></div>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<div class="box-left">
|
<div class="box-left">
|
||||||
<div style="width: 100%; display: flex; position: relative" class="ns-title-extra-box">
|
<a-input
|
||||||
<span style="margin-left: 12px; color: #333333">联系人名单</span>
|
|
||||||
</div>
|
|
||||||
<img
|
|
||||||
style="width: 100%; height: 2px"
|
|
||||||
src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
|
|
||||||
<a-input-search
|
|
||||||
v-model:value="searchValue"
|
v-model:value="searchValue"
|
||||||
style="margin-bottom: 8px"
|
style="margin-bottom: 8px; width: 194px"
|
||||||
placeholder="请输入关键字" />
|
placeholder="请输入关键字" />
|
||||||
<img
|
<div style="width: 100%; height: 420px; overflow-y: auto">
|
||||||
style="width: 100%; height: 2px"
|
|
||||||
src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
|
|
||||||
<div style="width: 100%; height: 370px; overflow-y: auto">
|
|
||||||
<a-tree
|
<a-tree
|
||||||
v-model:selectedKeys="selectedKeys"
|
v-model:selectedKeys="selectedKeys"
|
||||||
v-model:expandedKeys="expandedKeys"
|
v-model:expandedKeys="expandedKeys"
|
||||||
@@ -30,19 +22,19 @@
|
|||||||
/></div>
|
/></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="box-right">
|
<div class="box-right">
|
||||||
<div style="width: 100%; display: flex; position: relative" class="ns-title-extra-box">
|
<div style="width: 100%; display: flex; position: relative">
|
||||||
<span style="margin-left: 12px; color: #333333">人员列表 </span>
|
<span style="color: rgba(51, 51, 51, 1); font-size: 16px; font-weight: 700"
|
||||||
|
>人员列表
|
||||||
|
</span>
|
||||||
<a-input-search
|
<a-input-search
|
||||||
v-model:value="realName"
|
v-model:value="realName"
|
||||||
style="margin-bottom: 8px; width: 280px; position: absolute; right: 20px"
|
style="margin-bottom: 2px; width: 210px; margin-left: 12px"
|
||||||
placeholder="请输入"
|
placeholder="请输入关键字"
|
||||||
allowClear="true"
|
allowClear="true"
|
||||||
@search="onSearch" />
|
@search="onSearch"
|
||||||
|
@pressEnter="onSearch" />
|
||||||
</div>
|
</div>
|
||||||
<img
|
<div style="width: 100%; height: 455px; overflow-y: hidden; padding: 12px 0">
|
||||||
style="width: 100%; height: 2px"
|
|
||||||
src="https://files.axshare.com/gsc/4T0UQR/7e/5d/a2/7e5da2a277344db8af30521cefeb70cc/images/告警设置/u150.svg?pageId=1f58c1ba-b461-4fe8-a2b3-295f1e7b0aa0" />
|
|
||||||
<div style="width: 100%; height: 450px; overflow-y: auto; padding: 12px 0">
|
|
||||||
<a-table
|
<a-table
|
||||||
:row-selection="{
|
:row-selection="{
|
||||||
selectedRowKeys: selectedRowKey,
|
selectedRowKeys: selectedRowKey,
|
||||||
@@ -55,6 +47,7 @@
|
|||||||
:rowKey="(record: any) => record.userId"
|
:rowKey="(record: any) => record.userId"
|
||||||
:pagination="pagination"
|
:pagination="pagination"
|
||||||
:bordered="true"
|
:bordered="true"
|
||||||
|
:scroll="{ x: 1000, y: 355 }"
|
||||||
:size="'middle'">
|
:size="'middle'">
|
||||||
<template #bodyCell="{ record, column }">
|
<template #bodyCell="{ record, column }">
|
||||||
<template v-if="column.dataIndex === 'address'">
|
<template v-if="column.dataIndex === 'address'">
|
||||||
@@ -214,8 +207,7 @@
|
|||||||
showQuickJumper: true,
|
showQuickJumper: true,
|
||||||
showLessItems: true,
|
showLessItems: true,
|
||||||
// showSizeChanger: true,
|
// showSizeChanger: true,
|
||||||
showTotal: (total: number, range: any) =>
|
showTotal: (total: number, range: any) => (total && range ? '' : ''),
|
||||||
total && range ? `显示第${range[0]}到${range[1]}条记录,共 ${total} 条记录` : '',
|
|
||||||
onChange: handleChangePage,
|
onChange: handleChangePage,
|
||||||
});
|
});
|
||||||
const onSelectChange = (selectedRowKeys: any, selectedRows: any) => {
|
const onSelectChange = (selectedRowKeys: any, selectedRows: any) => {
|
||||||
@@ -248,20 +240,24 @@
|
|||||||
customRender: (text: any) => {
|
customRender: (text: any) => {
|
||||||
return text.index + 1;
|
return text.index + 1;
|
||||||
},
|
},
|
||||||
|
fixed: 'left',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '姓名',
|
title: '姓名',
|
||||||
dataIndex: 'realName',
|
dataIndex: 'realName',
|
||||||
width: 100,
|
width: 120,
|
||||||
ellipsis: true,
|
ellipsis: true,
|
||||||
|
fixed: 'left',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '性别',
|
title: '性别',
|
||||||
dataIndex: 'sex',
|
dataIndex: 'sex',
|
||||||
|
width: 80,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '组织关系',
|
title: '组织关系',
|
||||||
dataIndex: 'orgName',
|
dataIndex: 'orgName',
|
||||||
|
width: 220,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
title: '部门 ',
|
title: '部门 ',
|
||||||
@@ -345,22 +341,44 @@
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="less">
|
<style lang="less">
|
||||||
|
.ns-modal-boxs {
|
||||||
|
overflow-y: hidden;
|
||||||
|
position: relative;
|
||||||
|
height: 650px;
|
||||||
|
.ant-modal-title {
|
||||||
|
font-size: 16px !important;
|
||||||
|
font-weight: 700 !important;
|
||||||
|
letter-spacing: 0 !important;
|
||||||
|
line-height: 24px !important;
|
||||||
|
color: rgba(51, 51, 51, 1) !important;
|
||||||
|
margin: 0 16px !important;
|
||||||
|
}
|
||||||
|
.ant-pagination-prev {
|
||||||
|
border: 1px solid rgba(207, 212, 219, 1) !important;
|
||||||
|
margin-right: 6px !important;
|
||||||
|
}
|
||||||
|
.ant-pagination-next {
|
||||||
|
border: 1px solid rgba(207, 212, 219, 1) !important;
|
||||||
|
margin-left: 6px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
.box {
|
.box {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 500px;
|
height: 490px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
.box-left {
|
.box-left {
|
||||||
width: 300px;
|
border: 1px solid rgba(235, 238, 245, 1);
|
||||||
height: 100%;
|
padding: 16px;
|
||||||
overflow-y: auto;
|
width: 226px;
|
||||||
padding: 0, 12px;
|
height: 490px;
|
||||||
gap: 5px;
|
gap: 5px;
|
||||||
}
|
}
|
||||||
.box-right {
|
.box-right {
|
||||||
width: calc(100% - 200px);
|
width: calc(100% - 226px);
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 0 12px;
|
padding: 0 20px;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user