Browse Source

fix(): 系统管理,Tree控件文本过长问题处理

tags/PMS_V1.0.0_Alpha5
wanghx 1 year ago
parent
commit
4b36210154
  1. 4
      src/pages/OffPeak/OffPeakShareRecords/ShareParkMgm/loadable.jsx
  2. 1
      src/pages/SystemMgm/AreaManage/ModalAreaAdd/index.jsx
  3. 16
      src/pages/SystemMgm/AreaManage/index.scss
  4. 5
      src/pages/SystemMgm/AreaManage/loadable.jsx
  5. 10
      src/pages/SystemMgm/OrgnizationMgm/index.scss
  6. 12
      src/pages/SystemMgm/OrgnizationMgm/loadable.jsx

4
src/pages/OffPeak/OffPeakShareRecords/ShareParkMgm/loadable.jsx

@ -74,7 +74,7 @@ function ShareParkMgm() {
type: "SearchSelect", type: "SearchSelect",
label: "车场名称", label: "车场名称",
placeholder: "请输入车场名称", placeholder: "请输入车场名称",
name: "parkName",
name: "parkId",
options: [{label: '全部', value: ""}, ...parkList] options: [{label: '全部', value: ""}, ...parkList]
}, },
{ {
@ -153,7 +153,7 @@ function ShareParkMgm() {
// //
const initFormData = { const initFormData = {
merchantName: "0", merchantName: "0",
parkName: "",
parkId: "",
createPerson: "" createPerson: ""
}; };
// //

1
src/pages/SystemMgm/AreaManage/ModalAreaAdd/index.jsx

@ -36,6 +36,7 @@ function ModalAreaAdd(props) {
} }
onOk(formData={...formData,id: editForm.id, ...latlngObj}, editStatus, ) onOk(formData={...formData,id: editForm.id, ...latlngObj}, editStatus, )
form.resetFields() form.resetFields()
handleCancel()
}).catch((err) => { }).catch((err) => {
console.log(err) console.log(err)
}) })

16
src/pages/SystemMgm/AreaManage/index.scss

@ -6,11 +6,21 @@ $color-primary : var(--color-primary);
.area-container { .area-container {
padding: 13px 20px; padding: 13px 20px;
.ant-tree-list {
overflow: hidden;
}
.ant-tree { .ant-tree {
width: 250px;
width: 300px;
.ant-tree-list-holder {
overflow: hidden;
}
.ant-tree-title { .ant-tree-title {
.label-text { .label-text {
// display: inline-block;
margin-right: 20px; margin-right: 20px;
text-wrap: nowrap;
text-overflow: ellipsis;
overflow: hidden;
} }
.label-icon { .label-icon {
margin-right: 5px; margin-right: 5px;
@ -45,7 +55,9 @@ $color-primary : var(--color-primary);
padding: 4px 0 !important; padding: 4px 0 !important;
width: 100%; width: 100%;
.ant-tree-node-content-wrapper { .ant-tree-node-content-wrapper {
width: 100%;
width: unset !important;
flex: 1;
min-width: 0;
} }
.dropdown-tree { .dropdown-tree {
display: none; display: none;

5
src/pages/SystemMgm/AreaManage/loadable.jsx

@ -160,9 +160,12 @@ function AreaManage() {
setModalAreaVisible(true) setModalAreaVisible(true)
} }
} }
const treeTitleRender = ({ name, children, level, pid, id, virtually_code, lng, lat, code, type }) => { const treeTitleRender = ({ name, children, level, pid, id, virtually_code, lng, lat, code, type }) => {
return <> return <>
<span className='label-text'>{name}</span>
<span className='label-text' title={name}>
{name}
</span>
<div className="dropdown-tree"> <div className="dropdown-tree">
<Dropdown <Dropdown
menu={{ menu={{

10
src/pages/SystemMgm/OrgnizationMgm/index.scss

@ -11,10 +11,16 @@ $color-primary : var(--color-primary);
.org-tree-container { .org-tree-container {
width: 250px; width: 250px;
margin-right: 20px; margin-right: 20px;
.ant-tree-list {
overflow: hidden;
}
.ant-tree { .ant-tree {
.ant-tree-title { .ant-tree-title {
.label-text { .label-text {
margin-right: 20px; margin-right: 20px;
text-wrap: nowrap;
text-overflow: ellipsis;
overflow: hidden;
} }
.label-icon { .label-icon {
margin-right: 5px; margin-right: 5px;
@ -103,7 +109,9 @@ $color-primary : var(--color-primary);
padding: 4px 0 !important; padding: 4px 0 !important;
width: 100%; width: 100%;
.ant-tree-node-content-wrapper { .ant-tree-node-content-wrapper {
width: 100%;
width: unset !important;
flex: 1;
min-width: 0;
} }
.dropdown-tree { .dropdown-tree {
display: none; display: none;

12
src/pages/SystemMgm/OrgnizationMgm/loadable.jsx

@ -413,6 +413,14 @@ function OrgnizationMgm() {
setEditStatus(true) setEditStatus(true)
} }
const handleTreeText = (text) => {
if (text.length > 16) {
return text?.substring(0, 16) + '...'
} else {
return text
}
}
const tabRender = useMemo(() => { const tabRender = useMemo(() => {
return [ return [
{ {
@ -533,7 +541,9 @@ function OrgnizationMgm() {
const treeTitleRender = ({ name, children, level, pid, id, virtually_code, lng_lat, code }) => { const treeTitleRender = ({ name, children, level, pid, id, virtually_code, lng_lat, code }) => {
return <> return <>
<span className='label-text'>{name}</span>
<span className='label-text'>
{ name + 'kajsndkjand阿里山扩大你' }
</span>
<div className="dropdown-tree"> <div className="dropdown-tree">
<Dropdown <Dropdown
menu={{ menu={{

Loading…
Cancel
Save