| 1 |
- @extends('layouts.base')
@section('title', '快递匹配')
@section('content')
<link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}" />
<link rel="stylesheet" href="{{resource_get('plugins/yz-supply/assent/css/album1.css?time='.time())}}">
<div class="all">
<div id="app" v-cloak>
<div class="vue-head">
<div class="top-title">
<span :class="item.class" v-for="(item,index) in albumTopTitle" @click="skipUrl(item)" :key="index">[[item.name]]</span>
</div>
</div>
<div class="vue-main">
<div class="vue-main-title">
<div class="vue-main-title-left"></div>
<div class="vue-main-title-content">快递匹配列表</div>
<div class="vue-main-title-button">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="addGoods">添加快递匹配</el-button>
</div>
</div>
<div class="vue-main-form">
<el-table :data="list" style="width: 100%;margin-bottom: 130px;" >
{{-- <el-table-column type="selection" width="55"></el-table-column>--}}
<el-table-column prop="id" label="ID" align="center" width="120"></el-table-column>
<el-table-column label="商城快递code">
<template slot-scope="scope">
[[scope.row.shop_code]]
</template>
</el-table-column>
<el-table-column label="商城快递名称">
<template slot-scope="scope">
[[scope.row.shop_name]]
</template>
</el-table-column>
<el-table-column label="中台快递code">
<template slot-scope="scope">
[[scope.row.code]]
</template>
</el-table-column>
<el-table-column label="中台快递名称">
<template slot-scope="scope">
[[scope.row.name]]
</template>
</el-table-column>
<el-table-column prop="refund_time" label="操作" align="center" width="320">
<template slot-scope="scope">
<el-link title="修改" :underline="false" @click="oneUpdate(scope.row)" style="width:50px;">
<i class="fa fa-edit"></i>
</el-link>
<el-link title="删除" :underline="false" @click="oneDel(scope.row.id)" style="width:50px;">
<i class="iconfont icon-ht_operation_delete"></i>
</el-link>
</template>
</el-table-column>
</el-table>
</div>
</div>
<!-- 单品风控商品添加 -->
<el-dialog :visible.sync="confirm_search_show" width="750px" :title="confirm_search_show_title">
<div style="height:400px;overflow:auto" id="confirm-send">
<el-form ref="goods_search" :model="goods_search" :rules="goods_search_rules" label-width="15%">
<div >
<el-form-item label="商城快递名称" prop="">
<el-select v-model="form.value" placeholder="请选择商城快递名称" clearable remote filterable @change="changeShopExpress">
{{-- :key="item.value"--}}
<el-option v-for="item in shop_express" :label="item.name" :value="item.value"></el-option>
</el-select>
</el-form-item>
</div>
<div >
<el-form-item label="中台快递名称" prop="">
<el-select v-model="form.code" placeholder="请选择中台快递名称" clearable remote filterable @change="changeExpress">
{{-- :key="item.code"--}}
<el-option v-for="item in express" :label="item.name" :value="item.code"></el-option>
</el-select>
</el-form-item>
</div>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="confirm_search_show = false">取 消</el-button>
<el-button type="primary" @click="sureconfirmAdd()">[[confirm_title]]</el-button>
</span>
</el-dialog>
<!-- 分页 -->
<div class="vue-page" >
<el-row>
<el-col align="right">
<el-pagination layout="prev, pager, next,jumper" @current-change="search" :total="total"
:page-size="per_page" :current-page="current_page" background
></el-pagination>
</el-col>
</el-row>
</div>
</div>
</div>
<script>
var app = new Vue({
el: "#app",
delimiters: ['[[', ']]'],
name: 'test',
data() {
return {
albumTopTitle: [
{
id: 1,
name: "基础设置",
class:"album-name-against",
url:"{!! yzWebFullUrl('plugin.yz-supply.admin.set.index') !!}"
},
{
id: 2,
name: "中台配置列表",
class:"album-name-against",
url:"{!! yzWebFullUrl('plugin.yz-supply.admin.middleground-configuration.index') !!}"
},
{
id: 3,
name: "支付设置",
class:"album-name-against",
url:"{!! yzWebFullUrl('plugin.yz-supply.admin.set.pay') !!}"
},
{
id: 4,
name: "快递匹配",
class:"album-name",
url:"{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.index') !!}"
},
{
id: 5,
name: "导入分类",
class:"album-name-against",
url:"{!! yzWebFullUrl('plugin.yz-supply.admin.import-categorys.index') !!}"
},
],
shop_express:[],//商城快递信息
express:[],//中台快递信息
form:{
value:"",
code:"",
},
confirm_search_show_title:"添加快递匹配",
confirm_title:"确认添加",
list:[],
rules: {},
current_page:1,
total:1,
per_page:1,
id:'',
name:'',
search_form:{},
selectedBranchs:[],
readonly:false,
confirm_search_show:false,// 确认发货弹窗
//商品搜索条件
goods_search:{
title:"",
},
goods_search_rules:{
},
yz_goods_control_ids:[],//已添加的id
goods_search_list:[
],
goods_ids:[],//选择的商品id
del_goods_ids:[],
}
},
created() {
},
mounted() {
this.getData(1);
this.getShopExpress();
this.getExpress();
},
methods: {
skipUrl(item){
window.location.href = item.url
},
changeShopExpress(){
this.$forceUpdate()
},
changeExpress(){
this.$forceUpdate()
},
sureconfirmAdd(){
if(this.form.value == ""){
this.$message({
message: '请选择商城快递名称',
type: 'error'
});
return false;
}
if(this.form.code == ""){
this.$message({
message: '请选择中台快递名称',
type: 'error'
});
return false;
}
formData = {
};
var url = '{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.create') !!}';
if (this.form.id >0){
formData.id = this.form.id;
url = '{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.update') !!}';
}
console.log(this.shop_express);
for (i in this.shop_express){
if (this.shop_express[i].value == this.form.value){
formData.shop_code = this.shop_express[i].value;
formData.shop_name = this.shop_express[i].name;
}
}
for (i in this.express){
if (this.express[i].code == this.form.code){
formData.code = this.express[i].code;
formData.name = this.express[i].name;
}
}
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post(url,{form: formData}).then(function(response) {
if (response.data.result) {
this.$message({
message: response.data.msg,
type: 'success'
});
loading.close();
this.confirm_search_show = false;
this.getData(1);
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
searchGoods(){
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.get-data') !!}',{keyword: this.goods_search.title}).then(function(response) {
if (response.data.result) {
this.goods_search_list = response.data.data.data;
loading.close();
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
//选择商品
selectedGoods(selection) {
let arr = [];
for(let j = 0,len = selection.length; j < len; j++){
console.log(selection[j].id);
arr.push(selection[j].id);
}
this.del_goods_ids = arr;
},
//选择商品
moreGoodsChange(selection) {
let arr = [];
for(let j = 0,len = selection.length; j < len; j++){
console.log(selection[j].id);
arr.push(selection[j].id);
}
this.goods_ids = arr;
},
getData(page,json) {
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.get-data') !!}',{page:page,search:json}).then(function(response) {
if (response.data.result) {
this.list = response.data.data.data;
this.current_page=response.data.data.current_page;
this.total=response.data.data.total;
this.per_page=response.data.data.per_page;
console.log(this.total);
loading.close();
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
getShopExpress() {
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.get-shop-express') !!}').then(function(response) {
if (response.data.result) {
this.shop_express = response.data.data.data;
loading.close();
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
getExpress() {
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.get-express') !!}').then(function(response) {
if (response.data.result) {
this.express = response.data.data.data;
loading.close();
} else {
this.$message({
message: response.data.msg,
type: 'error'
});
}
loading.close();
}, function(response) {
this.$message({
message: response.data.msg,
type: 'error'
});
loading.close();
});
},
search(val) {
var that = this;
let json = {
id: that.search_form.id,
name: that.search_form.name,
};
console.log(json)
this.getData(val,json);
},
// 添加新风控商品
addGoods() {
this.confirm_search_show = true;
this.confirm_search_show_title = "添加快递匹配";
this.confirm_title = "确认添加";
this.form.id = 0;
},
oneUpdate(item){
this.confirm_search_show = true;
this.confirm_search_show_title = "编辑快递匹配";
this.confirm_title = "确认修改";
this.form.id = item.id;
this.form.value = item.shop_code;
this.form.code = item.code;
},
patchDel(){
if(this.del_goods_ids.length == 0){
this.$message({type: 'error',message: '请选择要删除的商品'});
return false;
}
this.del();
},
oneDel(id){
this.del_goods_ids.push(id);
this.del();
},
del() {
this.$confirm('确定删除吗', '提示', {confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning'}).then(() => {
let loading = this.$loading({target:document.querySelector(".content"),background: 'rgba(0, 0, 0, 0)'});
this.$http.post('{!! yzWebFullUrl('plugin.yz-supply.admin.express-matching.delete') !!}',{ids:this.del_goods_ids}).then(function (response) {
if (response.data.result) {
this.$message({type: 'success',message: '删除成功!'});
this.getData(1);
}
else{
this.$message({type: 'error',message: response.data.msg});
}
loading.close();
},function (response) {
this.$message({type: 'error',message: response.data.msg});
loading.close();
}
);
}).catch(() => {
this.$message({type: 'info',message: '已取消删除'});
});
},
},
})
</script>
@endsection
|
