|
|
|
|
@ -12,35 +12,44 @@ |
|
|
|
|
<el-form label-width="80px"> |
|
|
|
|
<el-col :span="5"> |
|
|
|
|
<el-form-item label="省份"> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择省份" @change="getCity()" @clear="clearprovince()"> |
|
|
|
|
<el-option v-for="(item,index) in provinceList" :key="index" :label="item.provinceName" :value="item.provinceId"></el-option> |
|
|
|
|
<el-select v-model="form.provinces" clearable placeholder="请选择省份" |
|
|
|
|
@change="getCity()" @clear="clearprovince()"> |
|
|
|
|
<el-option v-for="(item,index) in provinceList" :key="index" |
|
|
|
|
:label="item.provinceName" :value="item.provinceId"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="5"> |
|
|
|
|
<el-form-item label="城市"> |
|
|
|
|
<el-select v-model="form.city" clearable placeholder="请选择城市" :disabled="form.provinces ? false : true" @change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in cityList" :key="index" :label="item.cityName" :value="item.cityId"></el-option> |
|
|
|
|
<el-select v-model="form.city" clearable placeholder="请选择城市" |
|
|
|
|
:disabled="form.provinces ? false : true" @change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in cityList" :key="index" |
|
|
|
|
:label="item.cityName" :value="item.cityId"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="5"> |
|
|
|
|
<el-form-item label="订单类型"> |
|
|
|
|
<el-select v-model="form.orderType" clearable placeholder="请选择订单类型" @change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in orderTypeList" :key="index" :label="item.name" :value="item.value"></el-option> |
|
|
|
|
<el-select v-model="form.orderType" clearable placeholder="请选择订单类型" |
|
|
|
|
@change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in orderTypeList" :key="index" |
|
|
|
|
:label="item.name" :value="item.value"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="5"> |
|
|
|
|
<el-form-item label="订单状态"> |
|
|
|
|
<el-select v-model="form.orderStatus" clearable placeholder="请选择订单状态" @change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in orderStatusList" :key="index" :label="item.name" :value="item.value"></el-option> |
|
|
|
|
<el-select v-model="form.orderStatus" clearable placeholder="请选择订单状态" |
|
|
|
|
@change="getData()"> |
|
|
|
|
<el-option v-for="(item,index) in orderStatusList" :key="index" |
|
|
|
|
:label="item.name" :value="item.value"></el-option> |
|
|
|
|
</el-select> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
<el-col :span="4"> |
|
|
|
|
<el-form-item> |
|
|
|
|
<el-input placeholder="请输入订单号/客户名称/订单名称" prefix-icon="el-icon-search" v-model="keyword" @keyup.enter.native="onSearch" clearable></el-input> |
|
|
|
|
<el-input placeholder="请输入订单号/客户名称/订单名称" prefix-icon="el-icon-search" |
|
|
|
|
v-model="keyword" @keyup.enter.native="onSearch" clearable></el-input> |
|
|
|
|
</el-form-item> |
|
|
|
|
</el-col> |
|
|
|
|
</el-form> |
|
|
|
|
@ -57,12 +66,15 @@ |
|
|
|
|
<span>订单列表</span> |
|
|
|
|
</div> |
|
|
|
|
<div> |
|
|
|
|
<el-button type="primary" size="small" round class="mag" @click="addOrder()">新建订单</el-button> |
|
|
|
|
<el-button type="primary" size="small" round class="mag" @click="addOrder()">新建订单 |
|
|
|
|
</el-button> |
|
|
|
|
<el-button type="primary" size="small" round @click="delAllSelection">批量删除</el-button> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<el-table :data="orderData" class="table" stripe header-align="center" @selection-change="handleSelectionChange" :row-key="getRowKeys"> |
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column> |
|
|
|
|
<el-table :data="orderData" class="table" stripe header-align="center" |
|
|
|
|
@selection-change="handleSelectionChange" :row-key="getRowKeys"> |
|
|
|
|
<el-table-column type="selection" width="55" align="center" |
|
|
|
|
:reserve-selection="true"></el-table-column> |
|
|
|
|
<el-table-column type="index" width="100" label="序号" align="center"> |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column prop="orderNumber" label="订单编号" align="center"> |
|
|
|
|
@ -83,15 +95,20 @@ |
|
|
|
|
</el-table-column> |
|
|
|
|
<el-table-column label="操作" align="center"> |
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
<el-button type="text" v-if="scope.row.isDel!==1" @click="handle('edit',scope.row)">{{scope.row.orderStatus==='已完成'?'修改':'处理'}}</el-button> |
|
|
|
|
<el-button type="text" v-if="scope.row.isDel!==1" @click="handle('edit',scope.row)"> |
|
|
|
|
{{ scope.row.orderStatus === "已完成" ? "修改" : "处理" }} |
|
|
|
|
</el-button> |
|
|
|
|
<el-button type="text" @click="handle('watch',scope.row)">查看</el-button> |
|
|
|
|
<el-button type="text" @click="handleDelete(scope.row)">删除</el-button> |
|
|
|
|
<el-button type="text" v-if="scope.row.orderStatus==='已完成'&&scope.row.isDel!==1" @click="handle('renew',scope.row)">续费</el-button> |
|
|
|
|
<el-button type="text" v-if="scope.row.orderStatus==='已完成'&&scope.row.isDel!==1" |
|
|
|
|
@click="handle('renew',scope.row)">续费 |
|
|
|
|
</el-button> |
|
|
|
|
</template> |
|
|
|
|
</el-table-column> |
|
|
|
|
</el-table> |
|
|
|
|
<div class="pagination"> |
|
|
|
|
<el-pagination background layout="total, prev, pager, next" @current-change="handleCurrentChange" :current-page="pageNo" :total="totals"> |
|
|
|
|
<el-pagination background layout="total, prev, pager, next" |
|
|
|
|
@current-change="handleCurrentChange" :current-page="pageNo" :total="totals"> |
|
|
|
|
</el-pagination> |
|
|
|
|
</div> |
|
|
|
|
</el-card> |
|
|
|
|
@ -105,170 +122,176 @@ export default { |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
form: { |
|
|
|
|
provinces: '', |
|
|
|
|
city: '', |
|
|
|
|
orderType: '', |
|
|
|
|
orderStatus: '' |
|
|
|
|
provinces: "", |
|
|
|
|
city: "", |
|
|
|
|
orderType: "", |
|
|
|
|
orderStatus: "" |
|
|
|
|
}, |
|
|
|
|
keyword: '', |
|
|
|
|
orderData:[], |
|
|
|
|
keyword: "", |
|
|
|
|
orderData: [], |
|
|
|
|
multipleSelection: [], |
|
|
|
|
provinceList: this.$store.state.provinceList, |
|
|
|
|
cityList: [], |
|
|
|
|
orderTypeList: [{ |
|
|
|
|
name: '正式', |
|
|
|
|
name: "正式", |
|
|
|
|
value: 1 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: '试用', |
|
|
|
|
value: 2 |
|
|
|
|
}], |
|
|
|
|
{ |
|
|
|
|
name: "试用", |
|
|
|
|
value: 2 |
|
|
|
|
}], |
|
|
|
|
orderStatusList: [{ |
|
|
|
|
name: '待发货', |
|
|
|
|
name: "待发货", |
|
|
|
|
value: 0 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: '已完成', |
|
|
|
|
value: 1 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: '已取消', |
|
|
|
|
value: 2 |
|
|
|
|
}], |
|
|
|
|
{ |
|
|
|
|
name: "已完成", |
|
|
|
|
value: 1 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
name: "已取消", |
|
|
|
|
value: 2 |
|
|
|
|
}], |
|
|
|
|
pageNo: 1, |
|
|
|
|
pageSize: 10, |
|
|
|
|
totals: 1, |
|
|
|
|
setTime:'', |
|
|
|
|
setTime: "" |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
watch: { |
|
|
|
|
keyword: function(val) { |
|
|
|
|
clearTimeout(this.setTime) |
|
|
|
|
this.setTime = setTimeout(()=>{ |
|
|
|
|
this.onSearch() |
|
|
|
|
},500) |
|
|
|
|
}, |
|
|
|
|
clearTimeout(this.setTime); |
|
|
|
|
this.setTime = setTimeout(() => { |
|
|
|
|
this.onSearch(); |
|
|
|
|
}, 500); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
this.getData() |
|
|
|
|
this.getData(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
test(val){ |
|
|
|
|
if(val.length>5){ |
|
|
|
|
val = 5 |
|
|
|
|
test(val) { |
|
|
|
|
if (val.length > 5) { |
|
|
|
|
val = 5; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
getData() { |
|
|
|
|
let data = { |
|
|
|
|
cityId: this.form.city, |
|
|
|
|
customerName:this.keyword, |
|
|
|
|
customerName: this.keyword, |
|
|
|
|
orderStatus: this.form.orderStatus, |
|
|
|
|
orderType: this.form.orderType, |
|
|
|
|
pageNo: this.pageNo, |
|
|
|
|
pageSize: this.pageSize, |
|
|
|
|
provinceId: this.form.provinces, |
|
|
|
|
} |
|
|
|
|
this.$post(this.api.orderList,data).then(res => { |
|
|
|
|
provinceId: this.form.provinces |
|
|
|
|
}; |
|
|
|
|
this.$post(this.api.orderList, data).then(res => { |
|
|
|
|
res.orderPage.orders.forEach(e => { |
|
|
|
|
e.orderType = this.orderTypeFn(e.orderType) |
|
|
|
|
e.orderStatus = this.orderStatusFn(e.orderStatus) |
|
|
|
|
e.orderNature = this.orderNatureFn(e.orderNature) |
|
|
|
|
}) |
|
|
|
|
this.orderData = res.orderPage.orders |
|
|
|
|
this.totals =res.orderPage.total |
|
|
|
|
}).catch(res => {}); |
|
|
|
|
e.orderType = this.orderTypeFn(e.orderType); |
|
|
|
|
e.orderStatus = this.orderStatusFn(e.orderStatus); |
|
|
|
|
e.orderNature = this.orderNatureFn(e.orderNature); |
|
|
|
|
}); |
|
|
|
|
this.orderData = res.orderPage.orders; |
|
|
|
|
this.totals = res.orderPage.total; |
|
|
|
|
}).catch(res => { |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 清除省份 |
|
|
|
|
clearprovince(){ |
|
|
|
|
this.form.city = '' |
|
|
|
|
clearprovince() { |
|
|
|
|
this.form.city = ""; |
|
|
|
|
}, |
|
|
|
|
// 获取城市 |
|
|
|
|
getCity(){ |
|
|
|
|
this.clearprovince() |
|
|
|
|
this.getCityData() |
|
|
|
|
this.pageNo = 1 |
|
|
|
|
this.getData() |
|
|
|
|
getCity() { |
|
|
|
|
this.clearprovince(); |
|
|
|
|
this.getCityData(); |
|
|
|
|
this.pageNo = 1; |
|
|
|
|
this.getData(); |
|
|
|
|
}, |
|
|
|
|
getCityData(){ |
|
|
|
|
getCityData() { |
|
|
|
|
let data = { |
|
|
|
|
provinceId: this.form.provinces |
|
|
|
|
} |
|
|
|
|
this.$get(this.api.queryCity,data).then(res => { |
|
|
|
|
this.cityList = res.list |
|
|
|
|
}).catch(res => {}); |
|
|
|
|
}; |
|
|
|
|
this.$get(this.api.queryCity, data).then(res => { |
|
|
|
|
this.cityList = res.list; |
|
|
|
|
}).catch(res => { |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
addOrder(){ |
|
|
|
|
this.$store.commit("systemData", { order_id : ''}); |
|
|
|
|
this.$router.push('/addorder'); |
|
|
|
|
addOrder() { |
|
|
|
|
this.$store.commit("systemData", { order_id: "" }); |
|
|
|
|
this.$router.push("/addorder"); |
|
|
|
|
}, |
|
|
|
|
handle(val,row){ |
|
|
|
|
this.$router.push('/addorder?'+val+'='+row.orderId); |
|
|
|
|
handle(val, row) { |
|
|
|
|
this.$router.push("/addorder?" + val + "=" + row.orderId); |
|
|
|
|
}, |
|
|
|
|
// 删除订单 |
|
|
|
|
handleDelete(row) { |
|
|
|
|
this.$confirm('确定要删除吗？', '提示', { |
|
|
|
|
type: 'warning' |
|
|
|
|
this.$confirm("确定要删除吗？", "提示", { |
|
|
|
|
type: "warning" |
|
|
|
|
}) |
|
|
|
|
.then(() => { |
|
|
|
|
var arr = [] |
|
|
|
|
arr.push(row.orderId) |
|
|
|
|
this.$post(this.api.orderDelete,{ids:arr}).then(res => { |
|
|
|
|
this.$message.success('删除成功'); |
|
|
|
|
this.getData() |
|
|
|
|
}).catch(res => {}); |
|
|
|
|
}) |
|
|
|
|
.catch(() => {}); |
|
|
|
|
.then(() => { |
|
|
|
|
var arr = []; |
|
|
|
|
arr.push(row.orderId); |
|
|
|
|
this.$post(this.api.orderDelete, { ids: arr }).then(res => { |
|
|
|
|
this.$message.success("删除成功"); |
|
|
|
|
this.getData(); |
|
|
|
|
}).catch(res => { |
|
|
|
|
}); |
|
|
|
|
}) |
|
|
|
|
.catch(() => { |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 续签 |
|
|
|
|
handleRenew(row){ |
|
|
|
|
handleRenew(row) { |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
getRowKeys(row) { |
|
|
|
|
return row.orderId; |
|
|
|
|
}, |
|
|
|
|
handleSelectionChange(val) { |
|
|
|
|
if(val.length>0){ |
|
|
|
|
this.multipleSelection = val.map(e=>e.orderId); |
|
|
|
|
}else{ |
|
|
|
|
this.multipleSelection = [] |
|
|
|
|
if (val.length > 0) { |
|
|
|
|
this.multipleSelection = val.map(e => e.orderId); |
|
|
|
|
} else { |
|
|
|
|
this.multipleSelection = []; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
delAllSelection() { |
|
|
|
|
if(this.multipleSelection.length != ''){ |
|
|
|
|
if (this.multipleSelection.length != "") { |
|
|
|
|
// 批量删除 |
|
|
|
|
this.$confirm('确定要删除吗？', '提示', { |
|
|
|
|
type: 'warning' |
|
|
|
|
this.$confirm("确定要删除吗？", "提示", { |
|
|
|
|
type: "warning" |
|
|
|
|
}) |
|
|
|
|
.then(() => { |
|
|
|
|
this.$post(this.api.orderDelete,{ids:this.multipleSelection}).then(res => { |
|
|
|
|
this.multipleSelection = []; |
|
|
|
|
this.$message.success('删除成功'); |
|
|
|
|
this.getData() |
|
|
|
|
}).catch(err => {}); |
|
|
|
|
}).catch(err => {}); |
|
|
|
|
}else{ |
|
|
|
|
this.$message.error('请先选择订单 ！'); |
|
|
|
|
.then(() => { |
|
|
|
|
this.$post(this.api.orderDelete, { ids: this.multipleSelection }).then(res => { |
|
|
|
|
this.multipleSelection = []; |
|
|
|
|
this.$message.success("删除成功"); |
|
|
|
|
this.getData(); |
|
|
|
|
}).catch(err => { |
|
|
|
|
}); |
|
|
|
|
}).catch(err => { |
|
|
|
|
}); |
|
|
|
|
} else { |
|
|
|
|
this.$message.error("请先选择订单 ！"); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onSearch(){ |
|
|
|
|
this.pageNo = 1 |
|
|
|
|
this.getData() |
|
|
|
|
onSearch() { |
|
|
|
|
this.pageNo = 1; |
|
|
|
|
this.getData(); |
|
|
|
|
}, |
|
|
|
|
handleCurrentChange(val) { |
|
|
|
|
this.pageNo = val; |
|
|
|
|
this.getData(); |
|
|
|
|
}, |
|
|
|
|
// 选择客户触发 |
|
|
|
|
gotoClient(){ |
|
|
|
|
this.$router.push('') |
|
|
|
|
gotoClient() { |
|
|
|
|
this.$router.push(""); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}; |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped> |
|
|
|
|
.mag{ |
|
|
|
|
.mag { |
|
|
|
|
margin-right: 20px; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
