Skip to content

Commit

Permalink
增删改查
Browse files Browse the repository at this point in the history
  • Loading branch information
wxh1018 committed Nov 26, 2019
1 parent e4dfe45 commit 0264ca7
Show file tree
Hide file tree
Showing 11 changed files with 329 additions and 72 deletions.
1 change: 1 addition & 0 deletions src/pages/.umi/dva.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export function _onCreate() {
});

app.model({ namespace: 'login', ...(require('C:/Users/wxh/Desktop/East Dragon shop/shop/East-Dragon-shop/src/models/login.js').default) });
app.model({ namespace: 'editpro', ...(require('C:/Users/wxh/Desktop/East Dragon shop/shop/East-Dragon-shop/src/pages/models/editpro.js').default) });
app.model({ namespace: 'home', ...(require('C:/Users/wxh/Desktop/East Dragon shop/shop/East-Dragon-shop/src/pages/models/home.js').default) });
app.model({ namespace: 'product', ...(require('C:/Users/wxh/Desktop/East Dragon shop/shop/East-Dragon-shop/src/pages/models/product.js').default) });
return app;
Expand Down
10 changes: 10 additions & 0 deletions src/pages/.umi/router.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,11 @@ const routes = [
exact: true,
component: require('../login/index.js').default,
},
{
path: '/models/editpro',
exact: true,
component: require('../models/editpro.js').default,
},
{
path: '/models/home',
exact: true,
Expand Down Expand Up @@ -57,6 +62,11 @@ const routes = [
exact: false,
component: require('../index/_layout.js').default,
routes: [
{
path: '/index/editProduct/:id',
exact: true,
component: require('../index/editProduct/$id.js').default,
},
{
path: '/index/home',
exact: true,
Expand Down
40 changes: 20 additions & 20 deletions src/pages/index/_layout.js
Original file line number Diff line number Diff line change
Expand Up @@ -39,10 +39,7 @@ function index(props) {
<span className="nav-text">系统首页</span>
</Link>
</Menu.Item>
<Menu.Item key="2"><Link to="/index/transaction">
<Icon type="video-camera" />
<span className="nav-text">交易管理</span></Link>
</Menu.Item>

<Menu.Item key="3"><Link to="/index/product">
<Icon type="upload" />
<span className="nav-text"
Expand All @@ -51,37 +48,40 @@ function index(props) {
})}
>商品管理</span></Link>
</Menu.Item>
<Menu.Item key="2"><Link to="/index/transaction">
{/* <Icon type="video-camera" /> */}
<span className="nav-text"></span></Link>
</Menu.Item>
<Menu.Item key="4">
<Icon type="bar-chart" />
<span className="nav-text"> 4</span>
{/* <Icon type="bar-chart" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="5">
<Icon type="cloud-o" />
<span className="nav-text">nav 5</span>
{/* <Icon type="cloud-o" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="6">
<Icon type="appstore-o" />
<span className="nav-text">nav 6</span>
{/* <Icon type="appstore-o" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="7">
<Icon type="team" />
<span className="nav-text">nav 7</span>
{/* <Icon type="team" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="8">
<Icon type="shop" />
<span className="nav-text">nav 8</span>
{/* <Icon type="shop" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="9">
<Icon type="shop" />
<span className="nav-text">nav 8</span>
{/* <Icon type="shop" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="10">
<Icon type="shop" />
<span className="nav-text">nav 8</span>
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="11">
<Icon type="shop" />
<span className="nav-text">nav 8</span>
{/* <Icon type="shop" /> */}
<span className="nav-text"></span>
</Menu.Item>
<Menu.Item key="12">
{/* <Icon type="shop" /> */}
Expand Down
62 changes: 62 additions & 0 deletions src/pages/index/editProduct/$id.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
import { connect } from 'dva'
import { useEffect, useState } from 'react'

function edit(props) {
useEffect(() => {
props.dispatch({
type: 'editpro/gettarget',
payload: {
id: props.match.params.id
}
})
}, [])
var sel = { width: '50%', border: 'none', borderRadius: '5px', border: "1px solid skyblue", height: '50px', margin: "5px" }
var p1 = { fontSize: '16px' }
var btn = { width: "40%", borderRadius: '10px', height: "50px", outline: 'none', border: 0, cursor: 'pointer' }

let name, descriptions, quantity, price, coverImg, productCategory, selval = ''
function handlerOk() {//点击添加
if (selval.value == 1) {
alert('请选择分类')
return;
}
let params = { name: name.value, descriptions: descriptions.value, price: price.value, quantity: quantity.value, coverImg: coverImg.value, productCategory: selval.value, id: props.match.params.id }
props.dispatch({
type: 'editpro/edit',
payload: params
})

}

// name.value = props.target.name
useEffect(()=>{
name.value = props.target.name
descriptions.value = props.target.descriptions
quantity.value = props.target.quantity
price.value = props.target.price
coverImg.value = props.target.coverImg
console.log(props);
})
return (
<div>
{/* <p>{props.target.data.name}</p> */}
<p style={p1}>name:</p><input style={sel} type="text" ref={(val) => name = val} />
<p style={p1}>简介:</p><input style={sel} type="text" ref={(val) => descriptions = val} />
<p style={p1}>价格:</p><input style={sel} type="text" ref={(val) => quantity = val} />
<p style={p1}>数量:</p><input style={sel} type="text" ref={(val) => price = val} />
<p style={p1}>图片:</p><input style={sel} type="text" ref={(val) => coverImg = val} /><br></br>
<p>已有分类:</p>
<select ref={(val) => selval = val} name="" id="">
{
props.list.map((item, i) => {
return (
<option key={i} value={item._id}>{item.name}</option>
)
})
}
</select>
<button style={btn} onClick={() => handlerOk()}>上传修改</button>
</div>
)
}
export default connect(state => state.editpro)(edit)
Empty file.
176 changes: 137 additions & 39 deletions src/pages/index/product/index.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,16 @@
import { connect } from 'dva'
import { useEffect, useState } from 'react'
import { Table, Divider, Pagination } from 'antd';
import { BrowserRouter as Router, Route, Switch, ReactDOM } from 'react-router-dom';
import Link from 'umi/link'
import { Modal, Button } from 'antd';

var sty = { width: "50px", }
var sel = { width: '80%', border: 'none', borderRadius: '5px', border: "1px solid skyblue", height: '40px' }
const pro = (props) => {
useEffect(() => {
getPro()
getSort()
document.querySelector("#root > div > div > main > section > aside > div > ul > li:nth-child(2)").click()
}, [])

//获取商品
Expand All @@ -17,18 +21,19 @@ const pro = (props) => {
})
}

let name, descriptions, quantity, price, coverImg = ''
let name, descriptions, quantity, price, coverImg, productCategory = ''
const [data, setobj] = useState([])

function addpro() {//点击添加
// let params = {key:data.length+1, name: name.value, descriptions: descriptions.value, price: price.value, quantity: quantity.value,coverImg:coverImg.value}
let params = { key: data.length, name: '雪', descriptions: '零星飘落', price: 999, quantity: 66, coverImg: 'http://up.enterdesk.com/edpic/41/88/16/418816c05957155da73031963316a53c.jpg' }
function addpro(obj) {//点击添加

let params = { key: data.length + 1, name: name.value, descriptions: descriptions.value, price: price.value, quantity: quantity.value, coverImg: coverImg.value, productCategory: selval.value }
console.log(params);
props.dispatch({
type: 'product/addpro',
payload: params
})
getPro()
name.value = descriptions.value = price.value = coverImg.value=selval.value = quantity.value = ''
// setobj(() => {
// let list = [...data]
// list.unshift(params)
Expand Down Expand Up @@ -58,10 +63,20 @@ const pro = (props) => {
render: text => <a>{text}</a>,
},
{
title: '_id',
dataIndex: '_id',
title: '类别',
dataIndex: 'productCategory',
key: '_id',
render: _id => <a>{_id}</a>,
render: id => {
if (id) {
return (
<a>{id.name}</a>
)
} else {
return (
<a>暂无分类</a>
)
}
}
},
{
title: '图片',
Expand All @@ -85,51 +100,134 @@ const pro = (props) => {
},
{
title: '简介',
key: 'tags',
key: 'descriptions',
dataIndex: 'descriptions',
render: txt => <div style={{ width: '100px', textOverflow: 'ellipsis', whiteSpace: 'nowrap', overflow: 'hidden' }}> {txt}</div >
},
{
title: 'Action',
key: 'action',
render: (obj, record) => (
<span>
<a onClick={()=>edit(obj)}>修改</a>
<Link to={'/index/editproduct/' + obj._id}><span onClick={() => edit(obj)}>修改</span></Link>
<Divider type="vertical" />
<a onClick={()=>del(obj)}>删除</a>
<a onClick={() => del(obj)}>删除</a>
</span>
),
},
];
//修改
function edit(obj){
console.log(obj._id);
}
function edit(obj) {
console.log();
props.dispatch({
type: 'editpro/gettarget',
payload:{
id:obj._id
}
})
}
//删除
function del(obj){
props.dispatch({
type:'product/delpro',
payload:{
id:obj._id
function del(obj) {
props.dispatch({
type: 'product/delpro',
payload: {
id: obj._id
}
})
getPro()
}

// 添加商品弹框
var selval = ''
const getSort = () => {
props.dispatch({
type: 'product/sortList'
})
}
const [visible, setvisible] = useState(() => false)
const showModal = () => {
console.log(1);
// 请求类别
getSort()
setvisible(() => {
return true
})
}

//确定上传商品
const handleOk = e => {
if (selval.value == 1) {
alert('请选择分类')
return;
}
setvisible(() => {
console.log(selval.value);
addpro()
return false
})
};

const handleCancel = e => {
console.log(e);
setvisible(() => {
return false
})
};

//新建分类
var newval = ''
const toNew = () => {
props.dispatch({
type: 'product/newfenlei',
payload: {
name: newval.value
}
})
newval.value = ''
getSort()
}
})
getPro()
}


return (
<div>
<Table columns={columns} dataSource={data} />
name:<input type="text" ref={(val) => name = val} />
简介:<input type="text" ref={(val) => descriptions = val} />
数量:<input type="text" ref={(val) => quantity = val} />
价格:<input type="text" ref={(val) => price = val} />
图片:<input type="text" ref={(val) => coverImg = val} />
<Pagination showQuickJumper defaultCurrent={2} total={500} onChange={onChange} />
{/* <br />



return (
<div>
<div>
<Button type="primary" onClick={() => showModal()}>
添加商品
</Button>
<Modal
title="添加商品"
visible={visible}
onOk={() => handleOk()}
onCancel={(e) => handleCancel(e)}
>
<p>name:</p><input style={sel} type="text" ref={(val) => name = val} />
<p>简介:</p><input style={sel} type="text" ref={(val) => descriptions = val} />
<p>价格:</p><input style={sel} type="text" ref={(val) => quantity = val} />
<p>数量:</p><input style={sel} type="text" ref={(val) => price = val} />
<p>图片:</p><input style={sel} type="text" ref={(val) => coverImg = val} />
<p>已有分类:</p>
<select ref={(val) => selval = val} name="" id="">
{
props.sortList.map((item, i) => {
return (
<option key={i} value={item._id}>{item.name}</option>
)
})
}
</select>
<input type="text" ref={(val) => newval = val} />
<button onClick={() => toNew()}>新建分类</button>

</Modal>
</div>
<Table columns={columns} dataSource={data} />

{/* <br />
<Pagination showQuickJumper defaultCurrent={2} total={500} onChange={onChange} disabled /> */}
<button onClick={addpro}>添加</button>
</div>
)
}

export default connect(state => state.product)(pro)
</div>
)
}

export default connect(state => state.product)(pro)
Empty file.
Loading

0 comments on commit 0264ca7

Please sign in to comment.