Commit ceb7907f authored by 陈祥烨's avatar 陈祥烨

首页优化

parent 6efe2a76
...@@ -27,7 +27,6 @@ export const UrlConsts = { ...@@ -27,7 +27,6 @@ export const UrlConsts = {
* 删除机构 * 删除机构
*/ */
export const deleteByAgencyCode = ( agencyCodeId, sequenceNbrs) => { export const deleteByAgencyCode = ( agencyCodeId, sequenceNbrs) => {
console.log(formatUrl(UrlConsts.deleteAgency(), { agencyCodeId, sequenceNbrs }))
return commonDelete(formatUrl(UrlConsts.deleteAgency(), { agencyCodeId, sequenceNbrs })); return commonDelete(formatUrl(UrlConsts.deleteAgency(), { agencyCodeId, sequenceNbrs }));
}; };
import React, { Component } from 'react'; import React, { Component } from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { Tabs, TagSelect, StdFormRow, CardPane, BorderRadius} from 'amos-framework'; import { Tabs, TagSelect, StdFormRow, CardPane, BorderRadius } from 'amos-framework';
import { Row, Col } from 'amos-framework'; import { Row, Col } from 'amos-framework';
import { getSortSences } from './api'; import { getSortSences } from './api';
import './index.scss'
const { TabList, Tab, TabPanel } = Tabs; const { TabList, Tab, TabPanel } = Tabs;
const categoryScene = ['全部', '新能源', '水利环境', '医疗健康', '智慧城市', '智慧园区', '企业运营', '物流仓库', '生产制造', '其他'] const categoryScene = ['全部', '新能源', '水利环境', '医疗健康', '智慧城市', '智慧园区', '企业运营', '物流仓库', '生产制造', '其他']
const miniSences = ['综合排序', '热门推荐', '最新发布'] const miniSences = ['综合排序', '热门推荐', '最新发布']
function ListCards({ cardItems }) {
function ListCards({cardItems}) {
const rows = []; const rows = [];
// console.log("传入ListCards中的carditems:") // console.log("传入ListCards中的carditems:")
// console.log(cardItems) // console.log(cardItems)
function handleClick() {
window.open(this);
}
for (let i = 0; i < cardItems.length; i += 4) { for (let i = 0; i < cardItems.length; i += 4) {
const rowItems = cardItems.slice(i, i + 4); const rowItems = cardItems.slice(i, i + 4);
const cols = rowItems.map((cardItems, index) => ( const cols = rowItems.map((cardItems, index) => (
<Col span={6} key={index}> <Col span={6} key={index}>
<div style={{margin: 30,display:'flex',justifyContent:'center'}}> <div style={{ margin: 15, display: 'flex', justifyContent: 'center' }} >
<CardPane style={{ width:300 ,height:240,border:0}} bodyStyle={{ padding: 0}}> <button style={{ width: '100%', height: '100%', border: 0, padding: 0 }} onClick={handleClick.bind(cardItems.templateLink)}>
<div style={{height:'75%'}}> <CardPane style={{ width: '100%', height: 270, border: 0 }} bodyStyle={{ height: 270, padding: 0 }}>
<img alt="example" width="100%" height='160px' style={{objectFit:'cover',borderRadius:10}} src={+cardItems.sketch} /> <div style={{ height: '75%' }}>
</div> <img alt="example" width="100%" height='100%' style={{ objectFit: 'cover', borderRadius: 10 }} src={cardItems.sketch} />
<div style={{ padding: '10px 0px 10px 50px' }}>
<h2 style={{ margin: 0 }}>{cardItems.templateName}</h2>
<div style={{display : 'flex'}}>
<p style={{ textAlign: 'left', marginTop: '5px' }}>热度指数:{cardItems.viewTimes}</p>
<p style={{ textAlign: 'left', marginTop: '5px' }}>{cardItems.agencyName}</p>
</div> </div>
</div> <div style={{ padding: '10px 0px 10px 80px' }}>
</CardPane> <h2 style={{ textAlign: 'left', margin: 0 }}>{cardItems.templateName}</h2>
<div style={{ display: 'flex' }}>
<p style={{ textAlign: 'left', marginTop: '5px', fontSize: '16px' }}>{cardItems.agencyName} | 热度指数:{cardItems.viewTimes}</p>
</div>
</div>
</CardPane>
</button>
</div> </div>
</Col> </Col>
)); ));
...@@ -71,7 +77,7 @@ class Shifting extends Component { ...@@ -71,7 +77,7 @@ class Shifting extends Component {
this.state = { this.state = {
mode: 'divider', mode: 'divider',
cardItems: [], cardItems: [],
selectSence: categoryScene[0], selectScene: categoryScene[0],
selectMiniSence: miniSences[0] selectMiniSence: miniSences[0]
// mode2: 'line', // mode2: 'line',
// mode3: 'bullet' // mode3: 'bullet'
...@@ -91,7 +97,7 @@ class Shifting extends Component { ...@@ -91,7 +97,7 @@ class Shifting extends Component {
}); });
} }
getSenceLists = () => { getSenceLists = () => {
getSortSences(this.state.selectSence, this.state.selectMiniSence).then(response => { getSortSences(this.state.selectScene, this.state.selectMiniSence).then(response => {
this.setState({ this.setState({
cardItems: response cardItems: response
}); });
...@@ -101,51 +107,51 @@ class Shifting extends Component { ...@@ -101,51 +107,51 @@ class Shifting extends Component {
handleSenecesSubmit = (value) => { handleSenecesSubmit = (value) => {
if (value !== '') { if (value !== '') {
this.setState({ this.setState({
selectSence : value selectScene: value
}) },() => {this.componentDidMount();})
this.getSenceLists();
} }
} }
handleMiniSenecesSubmit = (value) => { handleMiniSenecesSubmit = (value) => {
if (value !== '') { if (value !== '') {
this.setState({ this.setState({
selectMiniSence : value selectMiniSence: value
}) },() => {this.componentDidMount();})
this.getSenceLists();
} }
} }
render() {
render() {
const {mode} = this.state;
const Option = TagSelect.Option; const { mode } = this.state;
// this.getSenceLists(); const Option = TagSelect.Option;
return ( // this.getSenceLists();
<div> return (
<Tabs mode={mode}> <div>
<TabList> <Tabs mode={mode}>
<span>&nbsp;&nbsp;</span> <TabList style={{padding:10}} >
<Tab>&nbsp;&nbsp;应用模板&nbsp;&nbsp;</Tab> <span>&nbsp;&nbsp;</span>
<Tab>&nbsp;&nbsp;三维模型&nbsp;&nbsp;</Tab> <Tab>&nbsp;&nbsp;应用模板&nbsp;&nbsp;</Tab>
</TabList> </TabList>
<TabPanel> <TabPanel style={{padding:0}}>
<StdFormRow label="场景" block id = 'scene' style={{padding:'11px 0px 11px 20px',}}> <StdFormRow label="场景" block id='scene' style={{ padding: '10px 0px 10px 20px' ,marginBottom:0}}>
<TagSelect defaultValue = {categoryScene[0]} data={categoryScene} onChange={this.handleSenecesSubmit} expandable single /> <TagSelect defaultValue={categoryScene[0]} data={categoryScene} onChange={this.handleSenecesSubmit} expandable single />
</StdFormRow> </StdFormRow>
<StdFormRow block style={{ padding:'0px 0px 11px 20px'}}> <StdFormRow block style={{ padding: '10px 0px 10px 20px' ,marginBottom:0}}>
<TagSelect defaultValue = {miniSences[0]} data={miniSences} onChange={this.handleMiniSenecesSubmit} expandable single /> <TagSelect defaultValue={miniSences[0]} data={miniSences} onChange={this.handleMiniSenecesSubmit} expandable single />
</StdFormRow> </StdFormRow >
<ListCards cardItems={this.state.cardItems}/> <div style={{ overflowY: 'auto', height: '800px' }}>
</TabPanel> <ListCards cardItems={this.state.cardItems} />
</div>
<TabPanel>一级选项卡 - 面板2</TabPanel>
</Tabs> </TabPanel>
</div> </Tabs>
); </div>
} );
}
} }
export default Shifting; export default Shifting;
...@@ -33,3 +33,10 @@ ...@@ -33,3 +33,10 @@
} }
} }
#scene {
.amos-stdform-row-title>span {
height: 42px;
line-height: 42px;
}
}
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