乐趣区

egg(67)–商品curd之商品属性与颜色关联,商品与商品类型相关联

商品属性与颜色关联
model
app/model/goods_color.js

module.exports = app => {
const mongoose = app.mongoose;
const Schema = mongoose.Schema;

const GoodsColorSchema = new Schema({
color_name:{type:String},
color_value: {type: String},
status: {type: Number,default:1},
});
return mongoose.model(‘GoodsColor’, GoodsColorSchema,’goods_color’);
}
controller
app/controller/admin/goods.js
async add() {
// 获取所有的颜色值
var colorResult = await this.ctx.model.GoodsColor.find({});
await this.ctx.render(‘admin/goods/add’,{
colorResult:colorResult,
});

}
view
app/view/admin/goods/add.html
<li> <span> 商品颜色:</span>

<% for(var i =0;i<colorResult.length;i++){%>
<input type=”checkbox” name=”colors[]” value=”<%=colorResult[i]._id%>” id=”color_<%=colorResult[i]._id%>” /> <label for=”color_<%=colorResult[i]._id%>”><%=colorResult[i].color_name%></label>
<%}%>

</li>
效果
在增加商品属性的时候,查找到所有的商品颜色

商品与商品类型相关联
router.js
router.get(‘/admin/goods’, controller.admin.goods.index);
router.get(‘/admin/goods/add’, controller.admin.goods.add);
router.get(‘/admin/goods/goodsTypeAttribute’, controller.admin.goods.goodsTypeAttribute);
router.post(‘/admin/goods/doAdd’, controller.admin.goods.doAdd);
controller
app/controller/admin/goods.js
async add() {
// 获取所有的商品类型, 对应包装与规格
var goodsType = await this.ctx.model.GoodsType.find({});
await this.ctx.render(‘admin/goods/add’,{
goodsType:goodsType
});

}
view
app/view/admin/goods/add.html

根据 attr_type 显示同的展示形式
attr_type== 1 蓝色 input
attr_type== 2 红色 textarea
attr_type== 3 绿色 select

html
<div role=”tabpanel” class=”tab-pane” id=”attribute”>
<ul class=”form_input”>
<li> <span> 商品类型: </span>
<select name=”goods_type_id” id=”goods_type_id”>
<option value=”0″>– 请选择商品类型 –</option>
<%for(var i=0;i<goodsType.length;i++){%>
<option value=”<%=goodsType[i]._id%>”><%=goodsType[i].title%></option>
<%}%>
</select>
</li>
</ul>
<ul class=”form_input” id=”goods_type_attribute”>

</ul>
</div>
js
$(function(){
$(‘#goods_type_id’).change(function(){
// alert($(this).val());
var cate_id=$(this).val();
var data=”;
$.get(‘/admin/goods/goodsTypeAttribute?cate_id=’+cate_id,function(response){
console.log(response.result);
data=response.result;
console.log(data.length);
var str=””;
for(var i=0;i<data.length;i++){
if(data[i].attr_type==1){
str+='<li><span>’+data[i].title+’: </span><input type=”hidden” name=”attr_id_list[]” value=”‘+data[i]._id+'” /> <input type=”text” name=”attr_value_list[]” /></li>’
}else if(data[i].attr_type==2){
str+='<li><span>’+data[i].title+’: </span> <input type=”hidden” name=”attr_id_list[]” value=”‘+data[i]._id+'”> <textarea cols=”50″ rows=”3″ name=”attr_value_list[]”></textarea></li>’
}else{
var arr=data[i].attr_value.split(‘\n’);
str+='<li><span>’+data[i].title+’: </span><input type=”hidden” name=”attr_id_list[]” value=”‘+data[i]._id+'”>’;
str+='<select name=”attr_value_list[]”>’;
for(var j=0;j<arr.length;j++){
str+='<option value=”‘+arr[j]+'”>’+arr[j]+'</option>’;
}
str+='</select>’;
str+='</li>’;
}
}
$(‘#goods_type_attribute’).html(str);
})
})
})
效果

退出移动版