前端：商品分类列表
This commit is contained in:
YunaiV
parent
e9b5adeac3
commit
40e4236af2
@ -32,3 +32,7 @@ http://www.tuicool.com/articles/YrQ7j2a
|
|||||||
|
|
||||||
1.route目录下的文件需要加上文件头部注释（写清楚文件是什么功能）
|
1.route目录下的文件需要加上文件头部注释（写清楚文件是什么功能）
|
||||||
2.component文件需要加上头部注释 （写清楚改控件的用处）
|
2.component文件需要加上头部注释 （写清楚改控件的用处）
|
||||||
|
|
||||||
|
## 补充规范
|
||||||
|
|
||||||
|
1. services 目录中，每个 api 文件，对应后端一个 api 服务。主要考虑是
|
||||||
@ -6,20 +6,20 @@ const GlobalFooter = ({ className, links, copyright }) => {
|
|||||||
const clsString = classNames(styles.globalFooter, className);
|
const clsString = classNames(styles.globalFooter, className);
|
||||||
return (
|
return (
|
||||||
<footer className={clsString}>
|
<footer className={clsString}>
|
||||||
{links && (
|
{/*{links && (*/}
|
||||||
<div className={styles.links}>
|
{/*<div className={styles.links}>*/}
|
||||||
{links.map(link => (
|
{/*{links.map(link => (*/}
|
||||||
<a
|
{/*<a*/}
|
||||||
key={link.key}
|
{/*key={link.key}*/}
|
||||||
title={link.key}
|
{/*title={link.key}*/}
|
||||||
target={link.blankTarget ? '_blank' : '_self'}
|
{/*target={link.blankTarget ? '_blank' : '_self'}*/}
|
||||||
href={link.href}
|
{/*href={link.href}*/}
|
||||||
>
|
{/*>*/}
|
||||||
{link.title}
|
{/*{link.title}*/}
|
||||||
</a>
|
{/*</a>*/}
|
||||||
))}
|
{/*))}*/}
|
||||||
</div>
|
{/*</div>*/}
|
||||||
)}
|
{/*)}*/}
|
||||||
{copyright && <div className={styles.copyright}>{copyright}</div>}
|
{copyright && <div className={styles.copyright}>{copyright}</div>}
|
||||||
</footer>
|
</footer>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -9,7 +9,7 @@ module.exports = {
|
|||||||
menu: {
|
menu: {
|
||||||
disableLocal: false,
|
disableLocal: false,
|
||||||
},
|
},
|
||||||
title: 'Ant Design Pro',
|
title: '小商城管理平台',
|
||||||
pwa: true,
|
pwa: true,
|
||||||
// your iconfont Symbol Scrip Url
|
// your iconfont Symbol Scrip Url
|
||||||
// eg：//at.alicdn.com/t/font_1039637_btcrd5co4w.js
|
// eg：//at.alicdn.com/t/font_1039637_btcrd5co4w.js
|
||||||
|
|||||||
@ -29,9 +29,7 @@ const links = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
const copyright = (
|
const copyright = (
|
||||||
<Fragment>
|
<a href='https://pc.qq.com/detail/1/detail_2661.html'>请使用谷歌浏览器(Chrome)获取最佳用户体验</a>
|
||||||
Copyright <Icon type="copyright" /> 2018 蚂蚁金服体验技术部出品
|
|
||||||
</Fragment>
|
|
||||||
);
|
);
|
||||||
|
|
||||||
class UserLayout extends Component {
|
class UserLayout extends Component {
|
||||||
@ -63,10 +61,10 @@ class UserLayout extends Component {
|
|||||||
<div className={styles.header}>
|
<div className={styles.header}>
|
||||||
<Link to="/">
|
<Link to="/">
|
||||||
<img alt="logo" className={styles.logo} src={logo} />
|
<img alt="logo" className={styles.logo} src={logo} />
|
||||||
<span className={styles.title}>后台管理系统</span>
|
<span className={styles.title}>小商城管理平台</span>
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
<div className={styles.desc}>TODO....</div>
|
{/*<div className={styles.desc}>TODO....</div>*/}
|
||||||
</div>
|
</div>
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -105,7 +105,7 @@ function List ({ dataSource, loading, pagination, searchParams, dispatch,
|
|||||||
<a className={styles.tableDelete} onClick={() => handleDelete(record)}>
|
<a className={styles.tableDelete} onClick={() => handleDelete(record)}>
|
||||||
删除
|
删除
|
||||||
</a>
|
</a>
|
||||||
</span> : ''
|
</span> : null
|
||||||
}
|
}
|
||||||
</Fragment>
|
</Fragment>
|
||||||
);
|
);
|
||||||
@ -379,13 +379,14 @@ const RoleAssignModal = Form.create()(props => {
|
|||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
@connect(({ adminList, loading }) => ({
|
|
||||||
|
@connect(({ adminList }) => ({
|
||||||
// list: adminList.list,
|
// list: adminList.list,
|
||||||
// pagination: adminList.pagination,
|
// pagination: adminList.pagination,
|
||||||
...adminList,
|
...adminList,
|
||||||
loading: loading.models.resourceList,
|
|
||||||
}))
|
}))
|
||||||
|
|
||||||
|
// 主界面
|
||||||
@Form.create()
|
@Form.create()
|
||||||
class AdminList extends PureComponent {
|
class AdminList extends PureComponent {
|
||||||
state = {
|
state = {
|
||||||
|
|||||||
@ -108,62 +108,45 @@ class LoginPage extends Component {
|
|||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</Tab>
|
</Tab>
|
||||||
<Tab key="mobile" tab={formatMessage({ id: 'app.login.tab-login-mobile' })}>
|
{/*<Tab key="mobile" tab={formatMessage({ id: 'app.login.tab-login-mobile' })}>*/}
|
||||||
{login.status === 'error' &&
|
{/*{login.status === 'error' &&*/}
|
||||||
login.type === 'mobile' &&
|
{/*login.type === 'mobile' &&*/}
|
||||||
!submitting &&
|
{/*!submitting &&*/}
|
||||||
this.renderMessage(
|
{/*this.renderMessage(*/}
|
||||||
formatMessage({ id: 'app.login.message-invalid-verification-code' })
|
{/*formatMessage({ id: 'app.login.message-invalid-verification-code' })*/}
|
||||||
)}
|
{/*)}*/}
|
||||||
<Mobile
|
{/*<Mobile*/}
|
||||||
name="username"
|
{/*name="username"*/}
|
||||||
placeholder={formatMessage({ id: 'form.phone-number.placeholder' })}
|
{/*placeholder={formatMessage({ id: 'form.phone-number.placeholder' })}*/}
|
||||||
rules={[
|
{/*rules={[*/}
|
||||||
{
|
{/*{*/}
|
||||||
required: true,
|
{/*required: true,*/}
|
||||||
message: formatMessage({ id: 'validation.phone-number.required' }),
|
{/*message: formatMessage({ id: 'validation.phone-number.required' }),*/}
|
||||||
},
|
{/*},*/}
|
||||||
{
|
{/*{*/}
|
||||||
pattern: /^1\d{10}$/,
|
{/*pattern: /^1\d{10}$/,*/}
|
||||||
message: formatMessage({ id: 'validation.phone-number.wrong-format' }),
|
{/*message: formatMessage({ id: 'validation.phone-number.wrong-format' }),*/}
|
||||||
},
|
{/*},*/}
|
||||||
]}
|
{/*]}*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
<Captcha
|
{/*<Captcha*/}
|
||||||
name="password"
|
{/*name="password"*/}
|
||||||
placeholder={formatMessage({ id: 'form.verification-code.placeholder' })}
|
{/*placeholder={formatMessage({ id: 'form.verification-code.placeholder' })}*/}
|
||||||
countDown={120}
|
{/*countDown={120}*/}
|
||||||
onGetCaptcha={this.onGetCaptcha}
|
{/*onGetCaptcha={this.onGetCaptcha}*/}
|
||||||
getCaptchaButtonText={formatMessage({ id: 'form.get-captcha' })}
|
{/*getCaptchaButtonText={formatMessage({ id: 'form.get-captcha' })}*/}
|
||||||
getCaptchaSecondText={formatMessage({ id: 'form.captcha.second' })}
|
{/*getCaptchaSecondText={formatMessage({ id: 'form.captcha.second' })}*/}
|
||||||
rules={[
|
{/*rules={[*/}
|
||||||
{
|
{/*{*/}
|
||||||
required: true,
|
{/*required: true,*/}
|
||||||
message: formatMessage({ id: 'validation.verification-code.required' }),
|
{/*message: formatMessage({ id: 'validation.verification-code.required' }),*/}
|
||||||
},
|
{/*},*/}
|
||||||
]}
|
{/*]}*/}
|
||||||
/>
|
{/*/>*/}
|
||||||
</Tab>
|
{/*</Tab>*/}
|
||||||
<div>
|
|
||||||
<Checkbox checked={autoLogin} onChange={this.changeAutoLogin}>
|
|
||||||
<FormattedMessage id="app.login.remember-me" />
|
|
||||||
</Checkbox>
|
|
||||||
<a style={{ float: 'right' }} href="">
|
|
||||||
<FormattedMessage id="app.login.forgot-password" />
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
<Submit loading={submitting}>
|
<Submit loading={submitting}>
|
||||||
<FormattedMessage id="app.login.login" />
|
<FormattedMessage id="app.login.login" />
|
||||||
</Submit>
|
</Submit>
|
||||||
<div className={styles.other}>
|
|
||||||
<FormattedMessage id="app.login.sign-in-with" />
|
|
||||||
<Icon type="alipay-circle" className={styles.icon} theme="outlined" />
|
|
||||||
<Icon type="taobao-circle" className={styles.icon} theme="outlined" />
|
|
||||||
<Icon type="weibo-circle" className={styles.icon} theme="outlined" />
|
|
||||||
<Link className={styles.register} to="/user/register">
|
|
||||||
<FormattedMessage id="app.login.signup" />
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</Login>
|
</Login>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -7,7 +7,7 @@
|
|||||||
name="viewport"
|
name="viewport"
|
||||||
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
|
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
|
||||||
/>
|
/>
|
||||||
<title>Ant Design Pro</title>
|
<title>小商城管理平台</title>
|
||||||
<link rel="icon" href="/favicon.png" type="image/x-icon" />
|
<link rel="icon" href="/favicon.png" type="image/x-icon" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|||||||
11
mobile-web/src/api/product.js
Normal file
11
mobile-web/src/api/product.js
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
import request from "../config/request";
|
||||||
|
|
||||||
|
export function getProductCategoryList(pid) {
|
||||||
|
return request({
|
||||||
|
url: 'product-api/users/category/list',
|
||||||
|
method: 'get',
|
||||||
|
params: {
|
||||||
|
pid
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -1,24 +1,23 @@
|
|||||||
|
|
||||||
import axios from 'axios'
|
import axios from 'axios'
|
||||||
import {baseUrl,dataSources} from './env';
|
import {baseUrl, dataSources} from './env';
|
||||||
import datas from '../data/data';
|
import datas from '../data/data';
|
||||||
|
|
||||||
|
|
||||||
const service =axios.create({
|
const service = axios.create({
|
||||||
baseURL: baseUrl, // api 的 base_url
|
baseURL: baseUrl, // api 的 base_url
|
||||||
timeout: 5000, // request timeout
|
timeout: 5000, // request timeout
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const servicef = function (parameter) {
|
||||||
const servicef =function(parameter){
|
// debugger;
|
||||||
if(dataSources=='local'){
|
if (dataSources == 'local') {
|
||||||
//定义回调函数和axios一致
|
//定义回调函数和axios一致
|
||||||
const promist = new Promise(function(resolve,reject){
|
const promist = new Promise(function (resolve, reject) {
|
||||||
var data=datas[parameter.url];
|
var data = datas[parameter.url];
|
||||||
if(typeof data=='string'){
|
if (typeof data == 'string') {
|
||||||
data= JSON.parse(data);
|
data = JSON.parse(data);
|
||||||
}
|
}
|
||||||
resolve(data);
|
resolve(data);
|
||||||
})
|
})
|
||||||
return promist;
|
return promist;
|
||||||
}
|
}
|
||||||
@ -26,69 +25,72 @@ const servicef =function(parameter){
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
service.interceptors.request.use(
|
service.interceptors.request.use(
|
||||||
config => {
|
config => {
|
||||||
// Do something before request is sent
|
// Do something before request is sent
|
||||||
// if (store.getters.token) {
|
// if (store.getters.token) {
|
||||||
// // 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
|
// // 让每个请求携带token-- ['X-Token']为自定义key 请根据实际情况自行修改
|
||||||
// config.headers['X-Token'] = getToken()
|
// config.headers['X-Token'] = getToken()
|
||||||
// }
|
// }
|
||||||
|
|
||||||
return config
|
return config
|
||||||
},
|
},
|
||||||
error => {
|
error => {
|
||||||
// Do something with request error
|
// Do something with request error
|
||||||
console.log(error) // for debug
|
console.log(error) // for debug
|
||||||
Promise.reject(error)
|
Promise.reject(error)
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
// response interceptor
|
// response interceptor
|
||||||
service.interceptors.response.use(
|
service.interceptors.response.use(
|
||||||
//response => response,
|
//response => response,
|
||||||
/**
|
/**
|
||||||
* 下面的注释为通过在response里，自定义code来标示请求状态
|
* 下面的注释为通过在response里，自定义code来标示请求状态
|
||||||
* 当code返回如下情况则说明权限有问题，登出并返回到登录页
|
* 当code返回如下情况则说明权限有问题，登出并返回到登录页
|
||||||
* 如想通过 xmlhttprequest 来状态码标识 逻辑可写在下面error中
|
* 如想通过 xmlhttprequest 来状态码标识 逻辑可写在下面error中
|
||||||
* 以下代码均为样例，请结合自生需求加以修改，若不需要，则可删除
|
* 以下代码均为样例，请结合自生需求加以修改，若不需要，则可删除
|
||||||
*/
|
*/
|
||||||
response => {
|
response => {
|
||||||
const res = response.data;
|
// debugger;
|
||||||
if (res.ResultCode !== 200) {
|
const res = response.data;
|
||||||
// Message({
|
if (res.code !== 0) {
|
||||||
// message: res.message,
|
// Message({
|
||||||
// type: 'error',
|
// message: res.message,
|
||||||
// duration: 5 * 1000
|
// type: 'error',
|
||||||
// })
|
// duration: 5 * 1000
|
||||||
// // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
|
// })
|
||||||
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
|
// // 50008:非法的token; 50012:其他客户端登录了; 50014:Token 过期了;
|
||||||
// // 请自行在引入 MessageBox
|
// if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
|
||||||
// // import { Message, MessageBox } from 'element-ui'
|
// // 请自行在引入 MessageBox
|
||||||
// MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
|
// // import { Message, MessageBox } from 'element-ui'
|
||||||
// confirmButtonText: '重新登录',
|
// MessageBox.confirm('你已被登出，可以取消继续留在该页面，或者重新登录', '确定登出', {
|
||||||
// cancelButtonText: '取消',
|
// confirmButtonText: '重新登录',
|
||||||
// type: 'warning'
|
// cancelButtonText: '取消',
|
||||||
// }).then(() => {
|
// type: 'warning'
|
||||||
// store.dispatch('FedLogOut').then(() => {
|
// }).then(() => {
|
||||||
// location.reload() // 为了重新实例化vue-router对象 避免bug
|
// store.dispatch('FedLogOut').then(() => {
|
||||||
// })
|
// location.reload() // 为了重新实例化vue-router对象 避免bug
|
||||||
// })
|
// })
|
||||||
// }
|
// })
|
||||||
console.log(1);
|
// }
|
||||||
return Promise.reject('error')
|
console.log(1);
|
||||||
} else {
|
return Promise.reject('error')
|
||||||
if(typeof response.data.Tag=='string'){
|
} else {
|
||||||
return JSON.parse(response.data.Tag);
|
// if (typeof response.data.Tag == 'string') {
|
||||||
}else{
|
// return JSON.parse(response.data.Tag);
|
||||||
return response.data.Tag;
|
// } else {
|
||||||
}
|
// return response.data.Tag;
|
||||||
}
|
// }
|
||||||
},
|
// debugger;
|
||||||
error => {
|
return res.data;
|
||||||
|
|
||||||
return Promise.reject(error)
|
|
||||||
}
|
}
|
||||||
)
|
},
|
||||||
|
error => {
|
||||||
|
|
||||||
|
return Promise.reject(error)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
export default servicef
|
export default servicef
|
||||||
@ -6,63 +6,71 @@
|
|||||||
show-action
|
show-action
|
||||||
@search="onSearch"
|
@search="onSearch"
|
||||||
>
|
>
|
||||||
<div slot="action" @click="onSearch">搜索</div>
|
<div slot="action" @click="onSearch">搜索</div>
|
||||||
</van-search>
|
</van-search>
|
||||||
<van-badge-group :active-key="activeKey" class="tab" :style="'height:'+fullHeight+'px'">
|
<van-badge-group :active-key="activeKey" class="tab" :style="'height:'+fullHeight+'px'">
|
||||||
<van-badge title="热门推荐" @click="onClick" />
|
<!--<van-badge title="热门推荐" @click="onClick" />-->
|
||||||
<van-badge title="手机数码" @click="onClick" />
|
<!--<van-badge title="手机数码" @click="onClick" />-->
|
||||||
<van-badge title="家用电器" @click="onClick" />
|
<!--<van-badge title="家用电器" @click="onClick" />-->
|
||||||
<van-badge title="电脑办公" @click="onClick" />
|
<!--<van-badge title="电脑办公" @click="onClick" />-->
|
||||||
<van-badge title="美妆护肤" @click="onClick" />
|
<!--<van-badge title="美妆护肤" @click="onClick" />-->
|
||||||
<van-badge title="个护清洁" @click="onClick" />
|
<!--<van-badge title="个护清洁" @click="onClick" />-->
|
||||||
<van-badge title="汽车用品" @click="onClick" />
|
<!--<van-badge title="汽车用品" @click="onClick" />-->
|
||||||
<van-badge title="男装" @click="onClick" />
|
<!--<van-badge title="男装" @click="onClick" />-->
|
||||||
<van-badge title="男鞋" @click="onClick" />
|
<!--<van-badge title="男鞋" @click="onClick" />-->
|
||||||
<van-badge title="女装" @click="onClick" />
|
<!--<van-badge title="女装" @click="onClick" />-->
|
||||||
<van-badge title="女鞋" @click="onClick" />
|
<!--<van-badge title="女鞋" @click="onClick" />-->
|
||||||
<van-badge title="母婴童装" @click="onClick" />
|
<!--<van-badge title="母婴童装" @click="onClick" />-->
|
||||||
<van-badge title="图书音像" @click="onClick" />
|
<!--<van-badge title="图书音像" @click="onClick" />-->
|
||||||
<van-badge title="运动户外" @click="onClick" />
|
<!--<van-badge title="运动户外" @click="onClick" />-->
|
||||||
<van-badge title="食品生鲜" @click="onClick" />
|
<van-badge v-for="category in rootCategories" :title="category.name" @click="onClick" />
|
||||||
</van-badge-group>
|
</van-badge-group>
|
||||||
<div class="content" :style="'width:'+fullWidth+'px;height:'+(fullHeight-7)+'px'" >
|
<div class="content" :style="'width:'+fullWidth+'px;height:'+(fullHeight-7)+'px'" >
|
||||||
<img src="https://img11.360buyimg.com/mcoss/jfs/t1/1072/23/3672/95463/5b9a0813E175891fa/e38fc2f7c2ddfec2.jpg" />
|
<!-- TODO 营销活动，暂时注释掉 -->
|
||||||
|
<!--<img src="https://img11.360buyimg.com/mcoss/jfs/t1/1072/23/3672/95463/5b9a0813E175891fa/e38fc2f7c2ddfec2.jpg" />-->
|
||||||
|
<!-- TODO 常用分类，暂时注释掉 -->
|
||||||
|
<!--<div class="category-div">-->
|
||||||
|
<!--<h4>常用分类</h4>-->
|
||||||
|
<!--<ul >-->
|
||||||
|
<!--<li>-->
|
||||||
|
<!--<router-link to="/search?keyword=xxxx">-->
|
||||||
|
<!--<img src="//img12.360buyimg.com/focus/jfs/t11824/150/2263801190/3392/8e69e1b3/5a167b8cNdcf71ae5.jpg">-->
|
||||||
|
<!--<span>蓝牙耳机</span>-->
|
||||||
|
<!--</router-link>-->
|
||||||
|
<!--</li>-->
|
||||||
|
<!--<li>-->
|
||||||
|
<!--<a >-->
|
||||||
|
<!--<img src="//img20.360buyimg.com/focus/jfs/t13759/194/897734755/2493/1305d4c4/5a1692ebN8ae73077.jpg">-->
|
||||||
|
<!--<span>iPhone</span>-->
|
||||||
|
<!--</a>-->
|
||||||
|
<!--</li>-->
|
||||||
|
<!--<div style="clear:both"></div>-->
|
||||||
|
<!--</ul>-->
|
||||||
|
<!--</div>-->
|
||||||
<div class="category-div">
|
<div class="category-div">
|
||||||
<h4>常用分类</h4>
|
<!--<h4>热门分类</h4>-->
|
||||||
<ul >
|
<ul>
|
||||||
<li>
|
<!--<li><a ><img src="//img11.360buyimg.com/focus/s140x140_jfs/t21388/146/237407622/26923/221da1b3/5b054fedN2ba90518.jpg"><span>手机</span></a></li>-->
|
||||||
<router-link to="/search?keyword=xxxx">
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t20128/208/216721929/9242/472993da/5b05522dNa2aae1bb.png"><span>耳机</span></a></li>-->
|
||||||
<img src="//img12.360buyimg.com/focus/jfs/t11824/150/2263801190/3392/8e69e1b3/5a167b8cNdcf71ae5.jpg">
|
<!--<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t21655/83/2186874549/15932/c273d29b/5b48802aN13fe73de.png"><span>剃须刀</span></a></li>-->
|
||||||
<span>蓝牙耳机</span>
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t21715/149/246679831/16257/ddbf2036/5b0565a7N8dbc0017.png"><span>路由器</span></a></li>-->
|
||||||
</router-link>
|
<!--<li><a ><img src="//img14.360buyimg.com/focus/s140x140_jfs/t1/4478/16/633/36008/5b923503E39b9dfa9/13b099f187576d8c.png"><span>月饼</span></a></li>-->
|
||||||
</li>
|
<!--<li><a ><img src="//img10.360buyimg.com/focus/s140x140_jfs/t1/1410/32/643/38009/5b9236b2Eb02fbf02/1e7de6987578dcdd.jpg" ><span>牛奶</span></a></li>-->
|
||||||
<li>
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t1/4674/14/665/25245/5b9236bbE088d5efb/6c7c2f9857736c65.jpg"><span>男士内裤</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t1/1710/26/666/26147/5b9236c3E5fd1cd42/86c6bca8f4fe1efa.png"><span>小米8</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img11.360buyimg.com/focus/s140x140_jfs/t1/3653/6/655/42593/5b9236caEfef6235b/9e118f12705f52bb.png"><span>大闸蟹</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t23881/349/2204372862/9923/4c62864a/5b7693eeNf6883734.png"><span>三只松鼠</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t24253/294/2182777138/4059/429945c9/5b76990bNde226fbc.png"><span>充电宝</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t22051/318/235303191/9297/c5ea2761/5b055000N410a7553.png"><span>空调</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img10.360buyimg.com/focus/s140x140_jfs/t19960/243/653029866/38879/91bb398b/5b055555N9245f8aa.jpg"><span>电饭煲</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img12.360buyimg.com/focus/s140x140_jfs/t1/345/33/944/5582/5b9236d2E62d8da2e/99f72d51b8f195ed.jpg"><span>电话手表</span></a></li>-->
|
||||||
|
<!--<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t1/1446/14/631/8500/5b9237e5E0d1f9e16/b1a627b92323b5ed.png"><span>华为</span></a></li>-->
|
||||||
|
<li v-for="category in childCategories">
|
||||||
<a >
|
<a >
|
||||||
<img src="//img20.360buyimg.com/focus/jfs/t13759/194/897734755/2493/1305d4c4/5a1692ebN8ae73077.jpg">
|
<img :src="category.picUrl" />
|
||||||
<span>iPhone</span>
|
<span>{{ category.name }}</span>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
<div style="clear:both"></div>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="category-div">
|
|
||||||
<h4>热门分类</h4>
|
|
||||||
<ul>
|
|
||||||
<li><a ><img src="//img11.360buyimg.com/focus/s140x140_jfs/t21388/146/237407622/26923/221da1b3/5b054fedN2ba90518.jpg"><span>手机</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t20128/208/216721929/9242/472993da/5b05522dNa2aae1bb.png"><span>耳机</span></a></li>
|
|
||||||
<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t21655/83/2186874549/15932/c273d29b/5b48802aN13fe73de.png"><span>剃须刀</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t21715/149/246679831/16257/ddbf2036/5b0565a7N8dbc0017.png"><span>路由器</span></a></li>
|
|
||||||
<li><a ><img src="//img14.360buyimg.com/focus/s140x140_jfs/t1/4478/16/633/36008/5b923503E39b9dfa9/13b099f187576d8c.png"><span>月饼</span></a></li>
|
|
||||||
<li><a ><img src="//img10.360buyimg.com/focus/s140x140_jfs/t1/1410/32/643/38009/5b9236b2Eb02fbf02/1e7de6987578dcdd.jpg" ><span>牛奶</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t1/4674/14/665/25245/5b9236bbE088d5efb/6c7c2f9857736c65.jpg"><span>男士内裤</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t1/1710/26/666/26147/5b9236c3E5fd1cd42/86c6bca8f4fe1efa.png"><span>小米8</span></a></li>
|
|
||||||
<li><a ><img src="//img11.360buyimg.com/focus/s140x140_jfs/t1/3653/6/655/42593/5b9236caEfef6235b/9e118f12705f52bb.png"><span>大闸蟹</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t23881/349/2204372862/9923/4c62864a/5b7693eeNf6883734.png"><span>三只松鼠</span></a></li>
|
|
||||||
<li><a ><img src="//img20.360buyimg.com/focus/s140x140_jfs/t24253/294/2182777138/4059/429945c9/5b76990bNde226fbc.png"><span>充电宝</span></a></li>
|
|
||||||
<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t22051/318/235303191/9297/c5ea2761/5b055000N410a7553.png"><span>空调</span></a></li>
|
|
||||||
<li><a ><img src="//img10.360buyimg.com/focus/s140x140_jfs/t19960/243/653029866/38879/91bb398b/5b055555N9245f8aa.jpg"><span>电饭煲</span></a></li>
|
|
||||||
<li><a ><img src="//img12.360buyimg.com/focus/s140x140_jfs/t1/345/33/944/5582/5b9236d2E62d8da2e/99f72d51b8f195ed.jpg"><span>电话手表</span></a></li>
|
|
||||||
<li><a ><img src="//img30.360buyimg.com/focus/s140x140_jfs/t1/1446/14/631/8500/5b9237e5E0d1f9e16/b1a627b92323b5ed.png"><span>华为</span></a></li>
|
|
||||||
<div style="clear:both">
|
<div style="clear:both">
|
||||||
</div>
|
</div>
|
||||||
</ul>
|
</ul>
|
||||||
@ -74,6 +82,8 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { Search } from "vant";
|
import { Search } from "vant";
|
||||||
|
// import { GetAddressById } from '../../api/user';
|
||||||
|
import { getProductCategoryList } from '../../api/product';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "userindex",
|
name: "userindex",
|
||||||
@ -83,6 +93,8 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
value: "",
|
value: "",
|
||||||
|
rootCategories: [],
|
||||||
|
childCategories: [],
|
||||||
activeKey: 0,
|
activeKey: 0,
|
||||||
fullHeight: document.documentElement.clientHeight - 93,
|
fullHeight: document.documentElement.clientHeight - 93,
|
||||||
fullWidth: document.documentElement.clientWidth - 99
|
fullWidth: document.documentElement.clientWidth - 99
|
||||||
@ -90,11 +102,39 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
onSearch() {
|
onSearch() {
|
||||||
|
// debugger;
|
||||||
|
// GetAddressById(1);
|
||||||
console.log(this.value);
|
console.log(this.value);
|
||||||
},
|
},
|
||||||
onClick(key) {
|
onClick(key) {
|
||||||
|
// debugger;
|
||||||
|
// GetAddressById(1);
|
||||||
|
// 设置 activeKey
|
||||||
this.activeKey = key;
|
this.activeKey = key;
|
||||||
|
// 读取子节点的分类
|
||||||
|
if (this.rootCategories.length > key) {
|
||||||
|
let response = getProductCategoryList(this.rootCategories[key].id);
|
||||||
|
response.then(data => {
|
||||||
|
this.childCategories = data;
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
let response = getProductCategoryList(0);
|
||||||
|
response.then(data => {
|
||||||
|
// console.log(data);
|
||||||
|
// debugger;
|
||||||
|
// 设置根节点的分类
|
||||||
|
this.rootCategories = data;
|
||||||
|
// 获得首个根节点的分类
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
let response = getProductCategoryList(data[0].id);
|
||||||
|
response.then(data => {
|
||||||
|
this.childCategories = data;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -3,10 +3,7 @@ package cn.iocoder.mall.product.application.config;
|
|||||||
import cn.iocoder.common.framework.config.GlobalExceptionHandler;
|
import cn.iocoder.common.framework.config.GlobalExceptionHandler;
|
||||||
import org.springframework.context.annotation.Configuration;
|
import org.springframework.context.annotation.Configuration;
|
||||||
import org.springframework.context.annotation.Import;
|
import org.springframework.context.annotation.Import;
|
||||||
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
|
import org.springframework.web.servlet.config.annotation.*;
|
||||||
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
|
|
||||||
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
|
|
||||||
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
|
|
||||||
|
|
||||||
@EnableWebMvc
|
@EnableWebMvc
|
||||||
@Configuration
|
@Configuration
|
||||||
@ -31,4 +28,13 @@ public class MVCConfiguration implements WebMvcConfigurer {
|
|||||||
registry.addResourceHandler("webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
|
registry.addResourceHandler("webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// TODO 芋艿，允许跨域
|
||||||
|
@Override
|
||||||
|
public void addCorsMappings(CorsRegistry registry) {
|
||||||
|
registry.addMapping("/**")
|
||||||
|
.allowedHeaders("*")
|
||||||
|
.allowedMethods("*")
|
||||||
|
.allowedOrigins("*");
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -1,5 +1,6 @@
|
|||||||
package cn.iocoder.mall.product.application.controller.users;
|
package cn.iocoder.mall.product.application.controller.users;
|
||||||
|
|
||||||
|
import cn.iocoder.common.framework.vo.CommonResult;
|
||||||
import cn.iocoder.mall.product.api.ProductCategoryService;
|
import cn.iocoder.mall.product.api.ProductCategoryService;
|
||||||
import cn.iocoder.mall.product.api.bo.ProductCategoryBO;
|
import cn.iocoder.mall.product.api.bo.ProductCategoryBO;
|
||||||
import cn.iocoder.mall.product.application.convert.ProductCategoryConvert;
|
import cn.iocoder.mall.product.application.convert.ProductCategoryConvert;
|
||||||
@ -26,9 +27,9 @@ public class UsersProductCategoryController {
|
|||||||
@GetMapping("/list")
|
@GetMapping("/list")
|
||||||
@ApiOperation("获得指定编号下的子分类的数组")
|
@ApiOperation("获得指定编号下的子分类的数组")
|
||||||
@ApiImplicitParam(name = "pid", value = "指定分类编号", required = true, example = "0")
|
@ApiImplicitParam(name = "pid", value = "指定分类编号", required = true, example = "0")
|
||||||
public List<UsersProductCategoryVO> list(@RequestParam("pid") Integer pid) {
|
public CommonResult<List<UsersProductCategoryVO>> list(@RequestParam("pid") Integer pid) {
|
||||||
List<ProductCategoryBO> result = productCategoryService.getListByPid(pid);
|
List<ProductCategoryBO> result = productCategoryService.getListByPid(pid);
|
||||||
return ProductCategoryConvert.INSTANCE.convertToVO(result);
|
return CommonResult.success(ProductCategoryConvert.INSTANCE.convertToVO(result));
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
Loading…
Reference in New Issue
Block a user