Skip to content

E
ElectricitySheep
Commit e1a1b079 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 74013aab
Hide whitespace changes
Inline Side-by-side
Showing with 194 additions and 196 deletions
src/components/CommodityMan/SpecificationTemplate.vue
View file @ e1a1b079
<template> <template>
<div class="SpeTemplate"> <div class="SpeTemplate">
<div class="head-title"> <div class="head-title">
规格模板 规格模板
<el-button @click="openDig" style="float:right;margin-top: -5px;margin-left:20px;" size="small" type="primary">新增模板管理</el-button> <el-button @click="openDig" style="float:right;margin-top: -5px;margin-left:20px;" size="small" type="primary">
新增模板管理</el-button>
</div> </div>
<div class="content"> <div class="content">
<div> <div>
<div class="searchInput" style="width:250px"> <div class="searchInput" style="width:250px">
<el-input style="display:inline-block;width:225px;height:30px" <el-input style="display:inline-block;width:225px;height:30px" placeholder="请输入规格名搜索"
placeholder="请输入规格名搜索" @keyup.enter.native="msg.pageIndex=1,getList()" v-model="msg.Name" @clear="msg.pageIndex=1,getList()"
@keyup.enter.native="msg.pageIndex=1,getList()" size="small" clearable>
v-model="msg.Name" </el-input>
@clear="msg.pageIndex=1,getList()" <span @click="msg.pageIndex=1,getList()" class="el-icon-search"
size="small" style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
clearable>
</el-input>
<span @click="msg.pageIndex=1,getList()" class="el-icon-search" style="color:#979dad;font-size:14px;position:relative;top:1px"></span>
</div>
</div> </div>
<el-table </div>
:data="tableData" <el-table :data="tableData" v-loading="loading" border style="width: 100%;margin:20px 0">
v-loading="loading" <el-table-column prop="Name" width="300" label="规格名">
border </el-table-column>
style="width: 100%;margin:20px 0"> <el-table-column prop="address" label="规格值">
<el-table-column <template slot-scope="scope">
prop="Name" <el-tag size="small" v-for="(item,index) in scope.row.SpecList" :key="index" style="margin:0 5px"
width="300" type="info">{{item}}</el-tag>
label="规格名"> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="address" width="200" label="操作">
prop="address" <template slot-scope="scope">
label="规格值"> <img @click="Edit(scope.row)" style="width:32px;height:32px" src="../../assets/img/userman/edit.png" alt="">
<template slot-scope="scope"> <img @click="Delete(scope.row)" style="width:32px;height:32px;margin:0 10px"
<el-tag size="small" v-for="(item,index) in scope.row.SpecList" :key="index" style="margin:0 5px" type="info">{{item}}</el-tag> src="../../assets/img/userman/del.png" alt="">
</template> </template>
</el-table-column> </el-table-column>
<el-table-column </el-table>
prop="address" <el-pagination style="text-align:right" background @current-change="handleCurrentChange" :page-size="msg.pageSize"
width="200" layout="prev, pager, next" :total="total">
label="操作"> </el-pagination>
<template slot-scope="scope">
<img @click="Edit(scope.row)" style="width:32px;height:32px" src="../../assets/img/userman/edit.png" alt="">
<img @click="Delete(scope.row)" style="width:32px;height:32px;margin:0 10px" src="../../assets/img/userman/del.png" alt="">
</template>
</el-table-column>
</el-table>
<el-pagination style="text-align:right"
background
@current-change="handleCurrentChange"
:page-size="msg.pageSize"
layout="prev, pager, next"
:total="total">
</el-pagination>
</div> </div>
<!-- 新增规格模板 --> <!-- 新增规格模板 -->
<el-dialog custom-class="attr-template" title="充值" :visible.sync="ggmbDig" width="960px"> <el-dialog custom-class="attr-template" title="规格" :visible.sync="ggmbDig" width="960px">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px"> <el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px">
<el-form-item label="规格名" prop="Name"> <el-form-item label="规格名" prop="Name">
<el-input size="small" v-model="addMsg.Name" style="width:330px"></el-input> <el-input size="small" v-model="addMsg.Name" style="width:330px"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="规格值" prop="SpecList"> <el-form-item label="规格值" prop="SpecList">
<div flex="dir:left" style="flex-wrap: wrap;"> <div flex="dir:left" style="flex-wrap: wrap;">
<div v-for="(item,index) in SpecList" :key="index" class="attr-list"> <div v-for="(item,index) in SpecList" :key="index" class="attr-list">
<el-input size="small" v-model="item.num" style="width:152px"></el-input> <el-input size="small" v-model="item.num" style="width:152px"></el-input>
<i @click="deleteGgz(item,index)" class="el-icon-error close"></i> <i @click="deleteGgz(item,index)" class="el-icon-error close"></i>
</div>
<span @click="addGgz" class="point blue">添加规格值</span>
</div> </div>
<span @click="addGgz" class="point blue">添加规格值</span>
</div>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
...@@ -74,188 +58,202 @@ ...@@ -74,188 +58,202 @@
<el-button size="small" type="primary" @click="submitForm('addMsg')">确 定</el-button> <el-button size="small" type="primary" @click="submitForm('addMsg')">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: "SpeTemplate", name: "SpeTemplate",
data(){ data() {
return{ return {
ggmbDig:false, ggmbDig: false,
msg:{ msg: {
pageIndex:1, pageIndex: 1,
pageSize:15, pageSize: 15,
Name:'', Name: '',
Id:0, Id: 0,
Content:'', Content: '',
}, },
total:0, total: 0,
tableData:[ tableData: [{
{Name:'11'} Name: '11'
], }],
loading:false, loading: false,
addMsg:{ addMsg: {
Id:0, Id: 0,
Name:'', Name: '',
SpecList:[], SpecList: [],
}, },
rules:{ rules: {
SpecList: [], SpecList: [],
Name: [ Name: [{
{ required: true, message: '规格名不能为空', trigger: 'blur' } required: true,
], message: '规格名不能为空',
}, trigger: 'blur'
SpecList:[], }],
},
SpecList: [],
} }
}, },
created(){ created() {
this.getList(); this.getList();
}, },
methods:{ methods: {
Delete(item){ Delete(item) {
let that=this; let that = this;
that.$confirm('是否删除?', '提示', { that.$confirm('是否删除?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
type: 'warning' type: 'warning'
}).then(() => { }).then(() => {
this.apipost('/api/product/DelProductSpecificationInfo',{SpecificationId:item.Id}, this.apipost('/api/product/DelProductSpecificationInfo', {
res => { SpecificationId: item.Id
if (res.data.resultCode === 1) { },
this.getList(); res => {
this.Success(res.data.message) if (res.data.resultCode === 1) {
this.getList();
this.Success(res.data.message)
} else { } else {
this.Error(res.data.message); this.Error(res.data.message);
} }
}, },
null null
); );
}).catch(() => { }).catch(() => {
});
},
Edit(row){
this.addMsg=row;
this.SpecList=[];
row.SpecList.forEach(item=>{
let obj={
num:item
}
this.SpecList.push(obj)
})
this.ggmbDig=true;
}, });
deleteGgz(item,index){ },
this.SpecList.splice(index,1); Edit(row) {
}, this.addMsg = row;
addGgz(){ this.SpecList = [];
let obj={num:''} row.SpecList.forEach(item => {
this.SpecList.push(obj); let obj = {
}, num: item
openDig(){ }
this.addMsg={ this.SpecList.push(obj)
Id:0, })
Name:'', this.ggmbDig = true;
SpecList:[],
},
deleteGgz(item, index) {
this.SpecList.splice(index, 1);
},
addGgz() {
let obj = {
num: ''
}
this.SpecList.push(obj);
},
openDig() {
this.addMsg = {
Id: 0,
Name: '',
SpecList: [],
}
this.SpecList = [];
this.ggmbDig = true;
},
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
for (let i = 0; i < this.SpecList.length; i++) {
if (this.SpecList[i].num == "") {
this.Error("规格值不能为空");
return;
}
} }
this.SpecList=[]; this.addMsg.SpecList = [];
this.ggmbDig=true; this.SpecList.forEach(item => {
}, this.addMsg.SpecList.push(item.num);
submitForm(formName){ })
this.$refs[formName].validate((valid) => { this.apipost('/api/product/SetProductSpecificationInfo', this.addMsg,
if (valid) { res => {
for(let i=0;i<this.SpecList.length;i++){ if (res.data.resultCode === 1) {
if(this.SpecList[i].num==""){ this.getList();
this.Error("规格值不能为空"); this.Success(res.data.message)
return; this.ggmbDig = false;
}
}
this.addMsg.SpecList=[];
this.SpecList.forEach(item=>{
this.addMsg.SpecList.push(item.num);
})
this.apipost('/api/product/SetProductSpecificationInfo',this.addMsg,
res => {
if (res.data.resultCode === 1) {
this.getList();
this.Success(res.data.message)
this.ggmbDig=false;
} else {
this.Error(res.data.message);
}
},
null
);
} else { } else {
return false; this.Error(res.data.message);
} }
}); },
}, null
handleCurrentChange(val) { );
this.msg.pageIndex = val; } else {
this.getList(); return false;
}, }
getList(){ });
this.loading=true; },
this.apipost("/api/product/GetProductSpecificationPageList", this.msg, res => { handleCurrentChange(val) {
this.loading=false; this.msg.pageIndex = val;
if(res.data.resultCode==1){ this.getList();
this.total=res.data.data.count; },
let pageData=res.data.data.pageData; getList() {
this.tableData=pageData; this.loading = true;
} this.apipost("/api/product/GetProductSpecificationPageList", this.msg, res => {
this.loading = false;
}) if (res.data.resultCode == 1) {
}, this.total = res.data.data.count;
let pageData = res.data.data.pageData;
this.tableData = pageData;
}
})
},
}, },
}; };
</script> </script>
<style> <style>
.attr-template .attr-list { .attr-template .attr-list {
display: inline-block; display: inline-block;
margin-right: 10px; margin-right: 10px;
margin-bottom: 10px; margin-bottom: 10px;
position: relative; position: relative;
cursor: move; cursor: move;
} }
.attr-template .close {
.attr-template .close {
position: absolute; position: absolute;
top: -4px; top: -4px;
right: -4px; right: -4px;
font-size: 16px; font-size: 16px;
cursor: pointer; cursor: pointer;
background: #ffffff; background: #ffffff;
} }
.SpeTemplate .content .searchInput{
.SpeTemplate .content .searchInput {
border: 1px solid #DCDFE6; border: 1px solid #DCDFE6;
border-radius: 4px; border-radius: 4px;
} }
.SpeTemplate .content .searchInput .el-input__inner{
border:none;outline:none; .SpeTemplate .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
} }
.SpeTemplate .content .searchInput{
.SpeTemplate .content .searchInput {
line-height: normal; line-height: normal;
display: inline-table; display: inline-table;
width: 100%; width: 100%;
border-collapse: separate; border-collapse: separate;
border-spacing: 0; border-spacing: 0;
width:250px; width: 250px;
margin-right: 20px; margin-right: 20px;
} }
.SpeTemplate .content{
.SpeTemplate .content {
background: #fff; background: #fff;
margin-top:10px; margin-top: 10px;
padding: 20px; padding: 20px;
box-sizing: border-box; box-sizing: border-box;
} }
</style> </style>
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