Commit dc9cf569 authored by MrShi's avatar MrShi

dev_ssz分支,小区列表模块

parent f0ace35b
......@@ -211,16 +211,41 @@ export default defineConfig({
name: 'communitymanagement',
icon:'HddOutlined',
routes: [
{
/* {
path: './CellList',
name: 'celllist',
component:'./runTest/Template'
},*/
{
path: './housingList',
name: 'celllist',
routes: [
{ path: './', component: './CommunityManagement/housingList/HousingList' },
{ path: './Create', component: './CommunityManagement/housingList/HousingCreate' },
{ path: './Edit', component: './CommunityManagement/housingList/HousingEdit' },
{ path: './Detail', component: './CommunityManagement/housingList/HousingDetail' },
]
},
{
path: './CommunityAnnouncement',
name: 'communityannouncement',
component:'./runTest/Template'
},
/*{
path: './CommunityAnnouncement',
name: 'communityannouncement',
routes: [
{ path: './', component: './CommunityAnnouncement/communityNotice/CommunityNotice' },
{ path: './Create', component: './CommunityAnnouncement/communityNotice/CommunityNoticeCreate' },
{ path: './Edit', component: './CommunityAnnouncement/communityNotice/CommunityNoticeEdit' },
{ path: './Detail', component: './CommunityAnnouncement/communityNotice/CommunityNoticeDetail' },
]
},*/
{
path: './FacilityBookings',
name: 'facilitybookings',
......
import { getAllDevice,saveDevice,delDevice,getDeviceNum,getNewAddBug,importUserDeviceListExcel,
getUserDevice,saveUserDevice,getTargetKeys,getNewAdd,importUserListExcel,getDeviceDetails } from '@/services/communityNotice';
import { getRegion,getRegionList } from '@/services/region';
export default{
namespace: 'communityNoticeModel',
state: {
data: [],
},
effects: {
*getAllDevice({callback,payload},{ call, put }) {
const response = yield call(getAllDevice,payload);
yield put({
type: "getAll",
});
if(callback) callback(response);
},
*getRegion({callback,payload},{ call, put }) {
const response = yield call(getRegion,payload);
yield put({
type: "getRegions",
});
if(callback) callback(response);
},
*saveDevice({callback,payload},{ call, put }) {
const response = yield call(saveDevice,payload);
yield put({
type: "save",
});
if(callback) callback(response);
},
*delDevice({callback,payload},{ call, put }) {
const response = yield call(delDevice,payload);
yield put({
type: "del",
});
if(callback) callback(response);
},
*getRegionList({callback,payload},{ call, put }) {
const response = yield call(getRegionList,payload);
yield put({
type: "regionList",
});
if(callback) callback(response);
},
*getDeviceNum({callback,payload},{ call, put }) {
const response = yield call(getDeviceNum,payload);
yield put({
type: "num",
});
if(callback) callback(response);
},
*getUserDevice({callback,payload},{ call, put }) {
const response = yield call(getUserDevice,payload);
yield put({
type: "userDevice",
});
if(callback) callback(response);
},
*saveUserDevice({callback,payload},{ call, put }) {
const response = yield call(saveUserDevice,payload);
yield put({
type: "userDeviceSave",
});
if(callback) callback(response);
},
*getTargetKeys({callback,payload},{ call, put }) {
const response = yield call(getTargetKeys,payload);
yield put({
type: "targetKeys",
});
if(callback) callback(response);
},
*getNewAdd({callback,payload},{ call, put }) {
const response = yield call(getNewAdd,payload);
yield put({
type: "newAdd",
});
if(callback) callback(response);
},
*getNewAddBug({callback,payload},{ call, put }) {
const response = yield call(getNewAddBug,payload);
yield put({
type: "newAddBug",
});
if(callback) callback(response);
},
*importUserListExcel({callback,payload},{ call, put }) {
const response = yield call(importUserListExcel,payload);
yield put({
type: "importListExcel",
});
if(callback) callback(response);
},
*importUserDeviceListExcel({callback,payload},{ call, put }) {
const response = yield call(importUserDeviceListExcel,payload);
yield put({
type: "importDeviceListExcel",
});
if(callback) callback(response);
},
*getDeviceDetails({callback,payload},{ call, put }) {
const response = yield call(getDeviceDetails,payload);
yield put({
type: "deviceDetails",
});
if(callback) callback(response);
},
},
reducers: {
getAll(state, action) {
return {
...state,
data:action.payload || {},
};
},
getRegions(state, action) {
return {
...state,
data:action.payload || {},
};
},
save(state, action) {
return {
...state,
data:action.payload || {},
};
},
del(state, action) {
return {
...state,
data:action.payload || {},
};
},
regionList(state, action) {
return {
...state,
data:action.payload || {},
};
},
num(state, action) {
return {
...state,
data:action.payload || {},
};
},
userDevice(state, action) {
return {
...state,
data:action.payload || {},
};
},
userDeviceSave(state, action) {
return {
...state,
data:action.payload || {},
};
},
targetKeys(state, action) {
return {
...state,
data:action.payload || {},
};
},
newAdd(state, action) {
return {
...state,
data:action.payload || {},
};
},
newAddBug(state, action) {
return {
...state,
data:action.payload || {},
};
},
importListExcel(state, action) {
return {
...state,
data:action.payload || {},
};
},
importDeviceListExcel(state, action) {
return {
...state,
data:action.payload || {},
};
},
deviceDetails(state, action) {
return {
...state,
data:action.payload || {},
};
},
},
};
import { getAllDevice,saveDevice,delDevice,getDeviceNum,getNewAddBug,importUserDeviceListExcel,
getUserDevice,saveUserDevice,getTargetKeys,getNewAdd,importUserListExcel,getDeviceDetails } from '@/services/housingList';
import { getRegion,getRegionList } from '@/services/region';
export default{
namespace: 'housingListModel',
state: {
data: [],
},
effects: {
*getAllDevice({callback,payload},{ call, put }) {
const response = yield call(getAllDevice,payload);
yield put({
type: "getAll",
});
if(callback) callback(response);
},
*getRegion({callback,payload},{ call, put }) {
const response = yield call(getRegion,payload);
yield put({
type: "getRegions",
});
if(callback) callback(response);
},
*saveDevice({callback,payload},{ call, put }) {
const response = yield call(saveDevice,payload);
yield put({
type: "save",
});
if(callback) callback(response);
},
*delDevice({callback,payload},{ call, put }) {
const response = yield call(delDevice,payload);
yield put({
type: "del",
});
if(callback) callback(response);
},
*getRegionList({callback,payload},{ call, put }) {
const response = yield call(getRegionList,payload);
yield put({
type: "regionList",
});
if(callback) callback(response);
},
*getDeviceNum({callback,payload},{ call, put }) {
const response = yield call(getDeviceNum,payload);
yield put({
type: "num",
});
if(callback) callback(response);
},
*getUserDevice({callback,payload},{ call, put }) {
const response = yield call(getUserDevice,payload);
yield put({
type: "userDevice",
});
if(callback) callback(response);
},
*saveUserDevice({callback,payload},{ call, put }) {
const response = yield call(saveUserDevice,payload);
yield put({
type: "userDeviceSave",
});
if(callback) callback(response);
},
*getTargetKeys({callback,payload},{ call, put }) {
const response = yield call(getTargetKeys,payload);
yield put({
type: "targetKeys",
});
if(callback) callback(response);
},
*getNewAdd({callback,payload},{ call, put }) {
const response = yield call(getNewAdd,payload);
yield put({
type: "newAdd",
});
if(callback) callback(response);
},
*getNewAddBug({callback,payload},{ call, put }) {
const response = yield call(getNewAddBug,payload);
yield put({
type: "newAddBug",
});
if(callback) callback(response);
},
*importUserListExcel({callback,payload},{ call, put }) {
const response = yield call(importUserListExcel,payload);
yield put({
type: "importListExcel",
});
if(callback) callback(response);
},
*importUserDeviceListExcel({callback,payload},{ call, put }) {
const response = yield call(importUserDeviceListExcel,payload);
yield put({
type: "importDeviceListExcel",
});
if(callback) callback(response);
},
*getDeviceDetails({callback,payload},{ call, put }) {
const response = yield call(getDeviceDetails,payload);
yield put({
type: "deviceDetails",
});
if(callback) callback(response);
},
},
reducers: {
getAll(state, action) {
return {
...state,
data:action.payload || {},
};
},
getRegions(state, action) {
return {
...state,
data:action.payload || {},
};
},
save(state, action) {
return {
...state,
data:action.payload || {},
};
},
del(state, action) {
return {
...state,
data:action.payload || {},
};
},
regionList(state, action) {
return {
...state,
data:action.payload || {},
};
},
num(state, action) {
return {
...state,
data:action.payload || {},
};
},
userDevice(state, action) {
return {
...state,
data:action.payload || {},
};
},
userDeviceSave(state, action) {
return {
...state,
data:action.payload || {},
};
},
targetKeys(state, action) {
return {
...state,
data:action.payload || {},
};
},
newAdd(state, action) {
return {
...state,
data:action.payload || {},
};
},
newAddBug(state, action) {
return {
...state,
data:action.payload || {},
};
},
importListExcel(state, action) {
return {
...state,
data:action.payload || {},
};
},
importDeviceListExcel(state, action) {
return {
...state,
data:action.payload || {},
};
},
deviceDetails(state, action) {
return {
...state,
data:action.payload || {},
};
},
},
};
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>CommunityNotice Create</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<SelectOptions list={["A1 Project","B1 Project","C1 Project","D1 Project","E1 Project","F1 Project"
,"G1 Project","H1 Project","I1 Project","J1 Project","K1 Project","L1 Project","M1 Project","N1 Project"
,"O1 Project","P1 Project","Q1 Project","R1 Project","S1 Project","T1 Project","U1 Project","V1 Project"
,"W1 Project","X1 Project","Y1 Project","Z1 Project"]} onSubmit={printContent}/>
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>CommunityNotice Detail</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<SelectOptions list={["A1 Project","B1 Project","C1 Project","D1 Project","E1 Project","F1 Project"
,"G1 Project","H1 Project","I1 Project","J1 Project","K1 Project","L1 Project","M1 Project","N1 Project"
,"O1 Project","P1 Project","Q1 Project","R1 Project","S1 Project","T1 Project","U1 Project","V1 Project"
,"W1 Project","X1 Project","Y1 Project","Z1 Project"]} onSubmit={printContent}/>
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>CommunityNotice Edit</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<SelectOptions list={["A1 Project","B1 Project","C1 Project","D1 Project","E1 Project","F1 Project"
,"G1 Project","H1 Project","I1 Project","J1 Project","K1 Project","L1 Project","M1 Project","N1 Project"
,"O1 Project","P1 Project","Q1 Project","R1 Project","S1 Project","T1 Project","U1 Project","V1 Project"
,"W1 Project","X1 Project","Y1 Project","Z1 Project"]} onSubmit={printContent}/>
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
@import '~antd/lib/style/themes/default.less';
//基石
.base {
width: 100%;
background-color: #ffffff;
padding: 34px;
min-width: 1020px;
}
//头部组件
.box{
width: 100%;
height: 64px;
position: relative;
}
.item1{
position: absolute;
width: 320px;
text-align: center;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item3{
width:80px;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
}
.box1{
width: 100%;
height: 34px;
position: relative;
margin-bottom: 28px;
margin-top: 28px;
}
.box1item1{
position: absolute;
}
.box1item2{
position: absolute;
left: 206px;
}
.box2{
width: 100%;
height: 120px;
position: relative;
margin-bottom: 17px;
}
.box2item1{
position: absolute;
}
.box2item2{
position: absolute;
left: 206px;
}
.box3{
padding-left: 206px;
margin-bottom: 28px;
}
.box4{
width: 100%;
height: 34px;
position: relative;
}
.box4item1{
position: absolute;
}
.box4item2{
position: absolute;
left: 206px;
}
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
}
@import '~antd/lib/style/themes/default.less';
.pre {
margin: 12px 0;
padding: 12px 20px;
background: @input-bg;
box-shadow: @card-shadow;
}
.input {
width:200px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 10px;
}
.input1 {
width:200px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 120px 10px;
}
.body {
background:rgba(255,255,255,1);
border:1px solid rgba(229, 229, 229, 1);
}
.inputBox {
width:1250px;
height:50px;
padding-top: 10px;
}
.downIcon {
position: relative;
left: 80px;
}
.downButton {
width:120px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 10px;
text-align: left;
}
.button11 {
width:82px;
height:34px;
background:rgba(234,244,255,1);
border:1px solid rgba(178, 215, 255, 1);
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(66,159,255,1);
line-height:34px;
margin:20px 20px 7px 10px;
float: left;
}
.button1 {
width:150px;
height:34px;
background:rgba(234,244,255,1);
border:1px solid rgba(178, 215, 255, 1);
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(66,159,255,1);
line-height:34px;
margin: 7px 10px;
float: right;
}
.button2 {
width:150px;
height:34px;
background:rgba(24,144,255,1);
border-radius:4px;
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(255,255,255,1);
line-height:34px;
margin: 7px 10px;
float: left;
}
.button3 {
position: relative;
bottom: 52px;
width:72px;
height:32px;
background:rgba(255,255,255,1);
border:1px solid rgba(229, 229, 229, 1);
border-radius:4px;
margin: 10px 10px;
}
.table {
margin-right: 10px;
}
.detailsTitle {
display: inline-block;
font-size:18px;
font-family:PingFang SC;
font-weight:400;
color:rgba(73,73,73,1);
margin: 0px 30px;
}
.detailsContent {
display: inline-block;
font-size:15px;
width: 100px;
font-family:PingFang SC;
font-weight:400;
color:rgba(153,153,153,1);
margin: 10px 10px;
}
.detailsContent2 {
display: inline-block;
font-size:18px;
width: 200px;
font-family:PingFang SC;
font-weight:400;
color:rgba(51,51,51,1);
}
.detailsBox {
border-top: 1px solid rgba(229, 229, 229, 1);
margin: 10px 30px;
}
.font1 {
.detailsContent {
font-family:PingFang SC;
font-weight:400;
color:rgba(153,153,153,1);
margin: 5px 10px;
}
.backBox{
border: 1px solid rgb(0, 12, 23);
font-size: 2em;
margin: 50px ;
background: #1153ff;
}
.allCheckbox{
}
.subCheckbox{
}
}
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Housing Create</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Housing Detail</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
import React, { useState, useEffect } from 'react';
import styles from './index.less';
import { Input ,Menu,DatePicker,Upload,Modal, Button } from 'antd';
import { Link, useIntl, connect, Dispatch } from 'umi';
import TextArea from 'antd/lib/input/TextArea';
import { PlusOutlined } from '@ant-design/icons';
import SelectOptions from '../../components/SelectOptions/index';
const printContent = (comment: any)=>{
console.log(comment)
}
function getBase64(file: Blob) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
}
const Template = () => {
const [previewVisible, setPreviewVisible] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [fileList, setFileList] = useState([]);
const uploadButton = (
<div>
<PlusOutlined />
<div className="ant-upload-text">Upload</div>
</div>
);
const handleCancel = () =>{ setPreviewVisible(false) };
const handlePreview = async (file: { url: string; preview: string; originFileObj: Blob; name: any; }) => {
if (!file.url && !file.preview) {
file.preview = await getBase64(file.originFileObj);
}
setPreviewImage((file.url || file.preview));
setPreviewVisible(true);
setPreviewTitle(file.name || file.url.substring(file.url.lastIndexOf('/') + 1));
};
const handleChange = (Obj: any) => { setFileList(Obj.fileList) }
return (
<div className={styles.base}>
{/* 头部组件 */}
<div className={styles.box}>
<div className={styles.item1}>Housing Edit</div>
<button className={styles.item3}>返回</button>
</div>
{/*<SelectOptions list={["美国", "美丽的", "美好", "加拿大", "加油", "XO"].sort()} onSubmit={printContent} />*/}
<div className={styles.box1}>
<div className={styles.box1item1}>Announcement Title</div>
<div className={styles.box1item2}><Input style={{width:500}}/></div>
</div>
<div className={styles.box2}>
<div className={styles.box2item1}>Announcement Title</div>
<div className={styles.box2item2}><TextArea autoSize={false} style={{width:500,height:120}} /></div>
</div>
<div className={styles.box3}>
<Upload action="https://www.mocky.io/v2/5cc8019d300000980a055e76" listType="picture-card" fileList={fileList} onPreview={handlePreview} onChange={handleChange}>
{fileList.length >= 3 ? null : uploadButton}
</Upload>
<Modal visible={previewVisible} title={previewTitle} footer={null} onCancel={handleCancel}>
<img alt="picture" style={{ width: '100%' }} src={previewImage} />
</Modal>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>Entry into Force Time</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
< div className = { styles.box4 } >
<div className={styles.box4item1}>End Date</div>
<div className={styles.box4item2}><DatePicker/></div>
</div>
<div className={styles.line}></div>
<Button type="primary" style={{ width: 80, height: 32 }}>提交</Button>
</div>
);
};
export default Template;
This diff is collapsed.
@import '~antd/lib/style/themes/default.less';
//基石
.base {
width: 100%;
background-color: #ffffff;
padding: 34px;
min-width: 1020px;
}
//头部组件
.box{
width: 100%;
height: 64px;
position: relative;
}
.item1{
position: absolute;
width: 320px;
text-align: center;
border-left: 5px solid rgba(24,144,255,1);
font-family:'Source Han Sans CN';
font-size: 18px;
font-weight: 600;
color: #000000;
}
.item3{
width:80px;
height: 32px;
position: absolute;
right: 0;
outline: none;
background:none;
cursor: pointer;
border:1px solid rgba(217,217,217,1);
border-radius:2px;
}
.box1{
width: 100%;
height: 34px;
position: relative;
margin-bottom: 28px;
margin-top: 28px;
}
.box1item1{
position: absolute;
}
.box1item2{
position: absolute;
left: 206px;
}
.box2{
width: 100%;
height: 120px;
position: relative;
margin-bottom: 17px;
}
.box2item1{
position: absolute;
}
.box2item2{
position: absolute;
left: 206px;
}
.box3{
padding-left: 206px;
margin-bottom: 28px;
}
.box4{
width: 100%;
height: 34px;
position: relative;
}
.box4item1{
position: absolute;
}
.box4item2{
position: absolute;
left: 206px;
}
// 线栏
.line{
width: 100%;
height: 1px;
border-top: 1px solid rgba(217,217,217,1);
margin-top: 28px;
margin-bottom: 28px;
}
@import '~antd/lib/style/themes/default.less';
.pre {
margin: 12px 0;
padding: 12px 20px;
background: @input-bg;
box-shadow: @card-shadow;
}
.input {
width:200px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 10px;
}
.input1 {
width:200px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 120px 10px;
}
.body {
background:rgba(255,255,255,1);
border:1px solid rgba(229, 229, 229, 1);
}
.inputBox {
width:1250px;
height:50px;
padding-top: 10px;
}
.downIcon {
position: relative;
left: 80px;
}
.downButton {
width:120px;
height:34px;
border:1px solid rgba(229, 229, 229, 1);
border-radius:5px;
margin: 0px 10px;
text-align: left;
}
.button11 {
width:82px;
height:34px;
background:rgba(234,244,255,1);
border:1px solid rgba(178, 215, 255, 1);
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(66,159,255,1);
line-height:34px;
margin:20px 20px 7px 10px;
float: left;
}
.button1 {
width:150px;
height:34px;
background:rgba(234,244,255,1);
border:1px solid rgba(178, 215, 255, 1);
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(66,159,255,1);
line-height:34px;
margin: 7px 10px;
float: right;
}
.button2 {
width:150px;
height:34px;
background:rgba(24,144,255,1);
border-radius:4px;
font-size:14px;
font-family:PingFang SC;
font-weight:400;
color:rgba(255,255,255,1);
line-height:34px;
margin: 7px 10px;
float: left;
}
.button3 {
position: relative;
bottom: 52px;
width:72px;
height:32px;
background:rgba(255,255,255,1);
border:1px solid rgba(229, 229, 229, 1);
border-radius:4px;
margin: 10px 10px;
}
.table {
margin-right: 10px;
}
.detailsTitle {
display: inline-block;
font-size:18px;
font-family:PingFang SC;
font-weight:400;
color:rgba(73,73,73,1);
margin: 0px 30px;
}
.detailsContent {
display: inline-block;
font-size:15px;
width: 100px;
font-family:PingFang SC;
font-weight:400;
color:rgba(153,153,153,1);
margin: 10px 10px;
}
.detailsContent2 {
display: inline-block;
font-size:18px;
width: 200px;
font-family:PingFang SC;
font-weight:400;
color:rgba(51,51,51,1);
}
.detailsBox {
border-top: 1px solid rgba(229, 229, 229, 1);
margin: 10px 30px;
}
.font1 {
.detailsContent {
font-family:PingFang SC;
font-weight:400;
color:rgba(153,153,153,1);
margin: 5px 10px;
}
.backBox{
border: 1px solid rgb(0, 12, 23);
font-size: 2em;
margin: 50px ;
background: #1153ff;
}
.allCheckbox{
}
.subCheckbox{
}
}
import request from '@/utils/request';
export interface LoginParamsType {
userName: string;
password: string;
mobile: string;
captcha: string;
}
export async function fakeAccountLogin(params: LoginParamsType) {
return request('/api/tos/user/login/', {
method: 'POST',
data: params,
});
}
export async function logoutAccount() {
return request('/api/users/logout/', {
method: 'POST',
});
}
export async function getFakeCaptcha(mobile: string) {
return request(`/api/login/captcha?mobile=${mobile}`);
}
import request from '@/utils/request';
export interface LoginParamsType {
userName: string;
password: string;
mobile: string;
captcha: string;
}
export async function fakeAccountLogin(params: LoginParamsType) {
return request('/api/tos/user/login/', {
method: 'POST',
data: params,
});
}
export async function logoutAccount() {
return request('/api/users/logout/', {
method: 'POST',
});
}
export async function getFakeCaptcha(mobile: string) {
return request(`/api/login/captcha?mobile=${mobile}`);
}
import request from '@/utils/request';
export async function getRegion(params) {
return request('/api/device/getRegion', {
method: 'POST',
data: params,
});
}
export async function getRegionList(params) {
return request('/api/device/getRegionList', {
method: 'POST',
data: params,
});
}
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment