style:删除无用文件product

This commit is contained in:
wangsongsole 2022-10-18 10:34:53 +08:00
parent 92a2813fd0
commit 024a27236b
2 changed files with 0 additions and 775 deletions

View File

@ -1,701 +0,0 @@
import ReactDOM from "react-dom"
import React from "react"
import "./add.less"
import Ipt from "../../../components/input/main"
import Form from "../../../components/form/main"
import FormItem from "../../../components/form-item/main"
import {
Select,
Button,
ImageUpload,
onUpload,
Sweetalert,
RadioButton,
RadioGroup,
Notify
} from "zent"
import Swiper from "swiper/dist/js/swiper.js"
import "swiper/dist/css/swiper.min.css"
import Bus from "../../../assets/eventBus.js"
import {
getProductInfoSelect,
handelResponse,
uploadImg
} from "../../../assets/api.js"
import _ from "lodash"
var mySwiper = null
var timer = null
export default class adduserinfo extends React.Component {
constructor(props) {
super(props)
this.state = {
model: {
//数据模型不可少
product_id: "",
product_type: "1",
contract_price: "",
official_price: "",
cost_price: "",
quantity: "",
product_name: "",
weight: "0",
show_url: "",
describe_url: [],
detail_url: "",
stock: "",
usage: "",
detail_url: "",
map_product_name: ""
},
cur_product: null,
productOption: [],
products: [],
productpic: [],
productsList: [],
isSelectGoods: false
}
}
componentDidMount() {
mySwiper = new Swiper(".swiper-container", {
slidesPerView: 1,
centeredSlides: true,
loop: true,
autoplay: 3000,
initialSlide: 0,
observer: true, // 修改swiper自己或子元素时自动初始化swiper
observeParents: true, // 修改swiper的父元素时自动初始化swiper
pagination: ".swiper-pagination"
})
}
componentWillReceiveProps() {
mySwiper.update()
}
componentWillMount(e) {
//获取商品信息
if (this.props.data) {
let model_temp = this.props.data
let model = this.state.model
model.product_id = model_temp.product_id
model.product_type = model_temp.product_type
model.contract_price = model_temp.contract_price
model.official_price = model_temp.official_price
model.cost_price = model_temp.cost_price
model.quantity = model_temp.quantity
model.product_name = model_temp.product_name
model.weight = String(model_temp.weight)
model.show_url = model_temp.show_url
model.account_type = model_temp.account_type
model.detail_url = model_temp.detail_url
let defaultPic = []
let arr = []
let temp_productpic = this.state.productpic
let pics = ""
if (Array.isArray(model_temp.describe_url)) {
pics = model_temp.describe_url
} else {
if (
model_temp.describe_url != "" &&
model_temp.describe_url != undefined
) {
pics = model_temp.describe_url.split(",")
} else {
pics = []
}
}
for (let i = 0; i < pics.length; i++) {
let obj = {}
let nameArr = pics[i].split("/")
obj.name = nameArr[5] + i || nameArr[2] + i
obj.src = pics[i]
defaultPic.push(obj)
let obj2 = {
name: nameArr[5] + i || nameArr[2] + i,
url: pics[i]
}
temp_productpic.push(obj2)
}
this.setState({ temp_productpic })
model.describe_url = defaultPic
model.stock = model_temp.stock
model.usage = model_temp.usage
model.map_product_name = model_temp.map_product_name
this.setState({ model: model })
}
this.getProductInfo()
}
//获取直连天下商品映射信息
getProductInfo() {
let productList = sessionStorage.getItem("productsList")
productList = JSON.parse(productList)
let product_data = []
if (sessionStorage.getItem("productData")) {
product_data = JSON.parse(sessionStorage.getItem("productData"))
}
let checked_product = product_data ? product_data : []
let arr = []
this.setState({ products: productList })
_.map(productList, (res) => {
let index = checked_product.findIndex((item) => {
return item.product_id == res.id
})
let obj = {}
obj.key = res.id
obj.text = res.title
obj.disabled = index > -1 ? true : false
if (obj.disabled) {
}
obj.in = index > -1 ? checked_product[index].in : false
arr.push(obj)
return obj
})
this.setState({ productOption: arr })
if (this.state.model.product_id) {
let cur_product = arr.find((item) => {
return item.key == this.state.model.product_id
})
this.setState({ cur_product: cur_product })
if (cur_product && cur_product.in) {
this.setState({ isSelectGoods: true })
}
}
}
async submit() {
if (this.refs.form1.validator()) {
if (this.props.data) {
let temp = []
if (sessionStorage.getItem("productData")) {
temp = JSON.parse(sessionStorage.getItem("productData"))
let index = temp.findIndex((item) => {
return item.product_id == this.props.data.product_id
})
temp[index].product_name = this.state.model.product_name
temp[index].weight = this.state.model.weight
temp[index].account_type = this.state.model.account_type
temp[index].product_id = this.state.model.product_id
temp[index].product_type = this.state.model.product_type
temp[index].contract_price = this.state.model.contract_price
temp[index].official_price = this.state.model.official_price
temp[index].cost_price = this.state.model.cost_price
temp[index].quantity = this.state.model.quantity
temp[index].stock = this.state.model.quantity
temp[index].usage = this.state.model.usage
temp[index].show_url = this.state.model.show_url
temp[index].detail_url = this.state.model.detail_url
let urls = _.map(this.state.productpic, (o) => {
return o.url
})
if (urls.length <= 0) {
Notify.error(`商品图至少请上传一张`)
return
}
temp[index].describe_url = urls
temp[index].map_product_name = this.state.model.map_product_name
temp[index].account_type = this.state.model.account_type
sessionStorage.setItem("productData", JSON.stringify(temp))
}
} else {
let model = this.state.model
let urls = _.map(this.state.productpic, (o) => {
return o.url
})
if (urls.length <= 0) {
Notify.error(`商品图至少请上传一张`)
return
}
model.describe_url = urls
this.setState({ model: model })
if (this.state.model.show_url == "") {
Notify.error(`请上传商品Logo`)
return
}
let temp = []
if (sessionStorage.getItem("productData")) {
temp = JSON.parse(sessionStorage.getItem("productData"))
}
let data = temp ? temp : []
data.push(this.state.model)
sessionStorage.setItem("productData", JSON.stringify(data))
}
return true
}
}
onProductChange(e) {
this.setState({ cur_product: e })
let cur_product = this.state.products.find((item) => {
return item.id == e.key
})
let picItem = window.goods.find((item) => {
return item.id == cur_product.product_category_id
})
const productItem = picItem?.products.find(
(item) => item.id == cur_product.id
)
const obj1 = []
const obj2 = []
productItem?.pic.map((item, index) => {
obj1.push({
src: item,
id: item + index,
type: "add",
name: productItem.title + index
})
obj2.push({
url: item,
id: item + index,
type: "add",
name: productItem.title + index
})
})
let quantity = this.state.model.quantity
let model2 = {
product_id: cur_product.id,
product_type: cur_product.type,
contract_price: this.state.model.contract_price,
official_price: cur_product.official_price,
cost_price: cur_product.cost_price,
quantity: quantity,
stock: quantity,
usage: 0,
weight: this.state.model.weight,
product_name: cur_product.title,
show_url: picItem ? picItem.pic : "",
describe_url: obj1,
detail_url: "",
map_product_name: cur_product.title,
account_type: cur_product.account_type
}
this.setState({ model: model2, productpic: obj2 })
}
onTypeChange(e) {
let model2 = this.state.model
model2.type = e.target.value
this.setState({ model: model2 })
}
onUpload = (file, report) => {
return new Promise((resolve, reject) => {})
}
onUploadChange(files) {
if (files.length > 0) {
let formdata = new FormData()
formdata.append("file", files[0].file)
formdata.append("path", "common_image")
uploadImg(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
let path = req.path
let model = this.state.model
model.show_url = path
this.setState({ model: model })
},
(err) => {}
)
})
} else {
let model = this.state.model
model.show_url = ""
this.setState({ model: model })
}
}
onUploadChange1(files, e) {
let arr = _.map(files, (o) => {
return o.name
})
if (mySwiper !== 0) {
mySwiper.destroy()
}
mySwiper = new Swiper(".swiper-container", {
observer: true, //修改swiper自己或子元素时自动初始化swiper
observeParents: true, //修改swiper的父元素时自动初始化swiper
pagination: ".swiper-pagination",
paginationClickable: true,
autoplay: 3000
})
clearTimeout(timer)
timer = setTimeout(() => {
if (arr.length > this.state.productpic.length) {
//新增
for (let i = 0; i < arr.length; i++) {
let index = this.state.productpic.findIndex((o) => {
return o.name == arr[i]
})
if (index < 0) {
let path = ""
let formdata = new FormData()
formdata.append("file", files[i].file)
formdata.append("path", "common_image")
uploadImg(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
path = req.path
let obj = {
id: files[i].id,
name: files[i].name,
url: path,
type: "add"
}
let obj1 = {
id: files[i].id,
name: files[i].name,
src: path,
type: "add"
}
const model = this.state.model
model.describe_url.push(obj1)
let arr = this.state.productpic
arr.push(obj)
this.setState({ productpic: arr, model })
},
(err) => {}
)
})
}
}
}
if (arr.length < this.state.productpic.length) {
let temp_arr = Object.assign([], this.state.productpic)
this.setState({ productpic: [] })
this.state.productpic = []
let temp_arr2 = this.state.productpic
for (let i = 0; i < temp_arr.length; i++) {
let temp = temp_arr[i]
if (arr.indexOf(temp.name) > -1) {
temp_arr2.push(temp)
}
}
this.setState({ temp_arr2 })
}
// //调整位置
if (arr.length == this.state.productpic.length) {
let temp_arr = []
let pic_arr = this.state.productpic
for (let i = 0; i < arr.length; i++) {
let temp = pic_arr.find((o) => {
return o.name == arr[i]
})
temp_arr[i] = temp
}
this.setState({ productpic: temp_arr })
let left_temp_arr = files.map((item) => {
return {
...item,
url: item.src
}
})
let models = this.state.model
models.describe_url = left_temp_arr
this.setState({ model: models })
}
}, 500)
}
onUploadError = (type, data) => {
if (type === "overMaxAmount") {
Notify.error(`最多可上传 ${data.maxAmount} 张图片`)
} else if (type === "overMaxSize") {
Notify.error(`图片大小不能超过 ${data.formattedMaxSize}`)
}
}
onUploadChange2(files) {
if (files.length > 0) {
let formdata = new FormData()
formdata.append("file", files[0].file)
formdata.append("path", "common_image")
uploadImg(formdata).then((res) => {
handelResponse(
res,
(req, msg) => {
let path = req.path
let model = this.state.model
model.detail_url = path
this.setState({ model: model })
},
(err) => {}
)
})
} else {
let model = this.state.model
model.detail_url = ""
this.setState({ model: model })
}
}
render() {
//校验规则
const rules = {
product: [{ type: "required", message: "请选择映射商品" }],
quantity: [
{ type: "required", message: "请输入商品库存" },
{
type: "regExp",
message: "请输入小于100万的整数",
reg: "^(?!0)(?:[0-9]{1,6}|1000000)$"
}
],
contract_price: [
{ type: "required", message: "请输入合同价" },
{
type: "regExp",
message: "最多保留4位小数",
reg: "^[0-9]+(.[0-9]{1,4})?$"
}
],
product_name: [{ type: "required", message: "请输入商品名称" }],
/* 权重 */
weight: [
{ type: "required", message: "请输入权重" },
{
type: "regExp",
message: "请输入0~100权重数字",
reg: "^([0-9]{0,2}|100)$"
}
]
}
return (
<div id='addproduct'>
<Form model={this.state.model} rules={rules} ref='form1'>
<FormItem labelname='映射商品' prop='product' id='product'>
<Select
options={this.state.productOption}
width={520}
placeholder='请选择商品'
value={this.state.cur_product}
disabled={this.state.isSelectGoods}
onChange={(e) => {
this.onProductChange(e)
Bus.emit("change", "product", e)
}}
/>
</FormItem>
<FormItem labelname='商品类型' prop='type' id='type'>
<RadioGroup
onChange={(e) => {
this.onTypeChange(e)
}}
value={this.state.model.product_type}>
<RadioButton value={1}>直充</RadioButton>
<RadioButton value={2}>卡密</RadioButton>
</RadioGroup>
</FormItem>
<FormItem labelname='预估成本价' prop='cost_price' id='cost_price'>
<div className='line-value'>{this.state.model.cost_price}</div>
</FormItem>
<FormItem labelname='商品权重' prop='weight' id='weight'>
<Ipt
onChange={(e) => {
let model2 = this.state.model
model2.weight = e
this.setState({ model: model2 })
}}
onClearItem={(e) => {
let model2 = this.state.model
model2.weight = ""
this.setState({ model: model2 })
}}
value={this.state.model.weight}
placeholder={"请输入"}
labelWidth={"0px"}
maxLength={3}
height={"36px"}
countShow={false}
width={"520px"}
alignment={"left"}
/>
</FormItem>
<FormItem labelname='库存总数量' prop='quantity' id='quantity'>
<Ipt
onChange={(e) => {
let model2 = this.state.model
model2.quantity = e
model2.stock = e
this.setState({ model: model2 })
}}
onClearItem={(e) => {
let model2 = this.state.model
model2.quantity = ""
model2.stock = 0
this.setState({ model: model2 })
}}
value={this.state.model.quantity}
placeholder={"请输入"}
labelWidth={"0px"}
maxLength={7}
height={"36px"}
width={"520px"}
alignment={"left"}
/>
</FormItem>
<FormItem
id='contract_price'
labelname='合同价'
prop='contract_price'>
<Ipt
onChange={(e) => {
let model2 = this.state.model
model2.contract_price = e
this.setState({ model: model2 })
}}
onClearItem={(e) => {
let model2 = this.state.model
model2.contract_price = ""
this.setState({ model: model2 })
}}
value={this.state.model.contract_price}
placeholder={"请输入"}
labelWidth={"0px"}
maxLength={16}
height={"36px"}
width={"520px"}
alignment={"left"}
/>
</FormItem>
<FormItem id='product_name' labelname='商品名称' prop='product_name'>
<Ipt
onChange={(e) => {
let model2 = this.state.model
model2.product_name = e
this.setState({ model: model2 })
}}
onClearItem={(e) => {
let model2 = this.state.model
model2.product_name = ""
this.setState({ model: model2 })
}}
value={this.state.model.product_name}
placeholder={"请输入"}
labelWidth={"0px"}
maxLength={20}
height={"36px"}
width={"520px"}
alignment={"left"}
/>
</FormItem>
<FormItem
id='official_price'
labelname='商品官方价'
prop='official_price'>
<div className='line-value'>{this.state.model.official_price}</div>
</FormItem>
<FormItem id='show_url' prop='show_url' labelname='商品Logo'>
<ImageUpload
className='zent-image-upload-demo'
maxSize={2 * 1024 * 1024}
tips='图片不超过 2M'
maxAmount={1}
onError={this.onUploadError}
onChange={(e) => {
this.onUploadChange(e)
}}
fileList={
this.state.model.show_url
? [{ src: this.state.model.show_url, id: 1 }]
: null
}
value={this.state.model.show_url}
/>
</FormItem>
<FormItem prop='describe_url' labelname='商品图' id='describe_url'>
<ImageUpload
className='good-image-upload-demo'
maxSize={2 * 1024 * 1024}
tips='图片不超过 2M'
maxAmount={9}
sortable
onError={this.onUploadError}
fileList={this.state.model.describe_url}
multiple
onUpload={this.onUpload}
onChange={(e) => {
this.onUploadChange1(e)
}}
/>
</FormItem>
<FormItem
prop='detail_url'
labelname='商品详情'
id='detail_url'
required={false}>
<ImageUpload
className='zent-image-upload-demo'
maxSize={2 * 1024 * 1024}
tips='图片不超过 2M'
maxAmount={1}
onError={this.onUploadError}
fileList={
this.state.model.detail_url
? [{ src: this.state.model.detail_url }]
: null
}
onUpload={this.onUpload}
onChange={(e) => {
this.onUploadChange2(e)
}}
/>
</FormItem>
</Form>
<div className='mobile'>
<div className='mobile_top'>
{this.state.productpic ? (
<div className='swiper-container'>
<div className='swiper-wrapper' ref='swiperwrapper'>
{this.state.productpic.map((item, index) => {
return (
<div className='swiper-slide' key={index}>
<img src={item.url} />
</div>
)
})}
</div>
<div className='swiper-pagination'></div>
</div>
) : null}
</div>
<div className='mobile_center'></div>
<div className='mobile_bottom'>
{this.state.model.detail_url ? (
<img src={this.state.model.detail_url} />
) : null}
</div>
</div>
</div>
)
}
}

View File

@ -1,74 +0,0 @@
.line-value {
width: 508px;
text-align: left;
height: 36px;
border-bottom: 1px solid #e0e0e0;
padding-left: 12px;
}
.zent-image-upload-item-delete {
display: inline-block !important;
}
.mobile {
width: 375px;
height: 667px;
max-height: 667px;
background-color: #fafafa;
position: absolute;
top: 20px;
right: 20px;
border-color: 1px solid #B4B6B9;
padding: 5px;
overflow: auto;
}
.mobile_top {
width: 100%;
height: 373px;
background-image: url(https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/detailtop.png);
background-size: 100% 100%;
}
.mobile_center {
margin-top: 10px;
width: 100%;
height: 158px;
background-image: url(https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/detailipt.png);
background-size: 100% 100%;
}
.mobile_bottom {
margin-top: 10px;
width: 100%;
height: auto;
img {
width: 100%;
}
// background-image: url;
}
.swiper-container {
width: 100%;
height: 100%;
}
.swiper-slide {
img {
width: 100% !important;
height: 100% !important;
}
}
.swiper-mobile-simple {
height: 100% !important;
}
.good-image-upload-demo {
width: 300px !important;
}