panxiaohe
2 years ago
7 changed files with 1005 additions and 1 deletions
-
94src/api/shopSys.js
-
2src/views/commodity/commoditySystem/addCommodity.vue
-
52src/views/commodity/commoditySystem/addComponent.vue
-
187src/views/system/shopCrossDetail/edit.vue
-
136src/views/system/shopCrossDetail/index.vue
-
318src/views/system/storehouse/Edit.vue
-
217src/views/system/storehouse/index.vue
@ -0,0 +1,187 @@ |
|||
<!-- --> |
|||
<template> |
|||
<div> |
|||
<!-- 卡片栏 --> |
|||
<div class="cardStyle"> |
|||
<el-card class="box-card"> |
|||
<div slot="header" class="clearfix"> |
|||
<span class="card_span">店铺跨境设置</span> |
|||
<el-button class="btnShop" type="text" @click="save">保存</el-button> |
|||
<el-button |
|||
class="resBtn" |
|||
type="text" |
|||
@click=" |
|||
{ |
|||
} |
|||
" |
|||
>取消</el-button> |
|||
</div> |
|||
<!-- 详情 --> |
|||
<div class="shopDetail"> |
|||
<div class="shopDetail_l"> |
|||
<div class="shopMsg">店铺信息</div> |
|||
<div class="logo">店铺logo</div> |
|||
<div class="shopLogon"> |
|||
<!-- 上传图片 --> |
|||
<div class="uploadWidth"> |
|||
<el-upload |
|||
:headers="headers" |
|||
:action="upload" |
|||
list-type="picture-card" |
|||
:on-preview="handlePictureCardPreview" |
|||
:on-remove="handleRemove" |
|||
> |
|||
<i class="el-icon-plus" /> |
|||
</el-upload> |
|||
<el-dialog :visible.sync="dialogVisible"> |
|||
<img width="100%" :src="dialogImageUrl" alt> |
|||
</el-dialog> |
|||
</div> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">店铺名称：</div> |
|||
<el-input v-model="shopObj.name" placeholder="请输入店铺名称" /> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">发货地址：</div> |
|||
<el-input v-model="shopObj.address" placeholder="请输入发货地址" /> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">店铺简介：</div> |
|||
<el-input v-model="shopObj.det" placeholder="请输入店铺简介" /> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">注册手机号：</div> |
|||
<el-input v-model="shopObj.phone" placeholder="请输入注册手机号" /> |
|||
</div> |
|||
</div> |
|||
<div class="shopDetail_r"> |
|||
<div class="shopMsg">退货地址</div> |
|||
<div class="common"> |
|||
<div class="span_1">退货地址：</div> |
|||
<el-input v-model="shopObj.phone" placeholder="请输入退货地址" /> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">联系人</div> |
|||
<el-input v-model="shopObj.phone" placeholder="请输入联系人" /> |
|||
</div> |
|||
<div class="common"> |
|||
<div class="span_1">联系电话</div> |
|||
<el-input v-model="shopObj.phone" placeholder="请输入联系电话" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { uploadUrl } from '@/utils/request' |
|||
import { getToken } from '@/utils/auth' |
|||
export default { |
|||
components: {}, |
|||
data() { |
|||
// 这里存放数据 |
|||
return { |
|||
dialogImageUrl: '', |
|||
upload: uploadUrl, |
|||
headers: { |
|||
'Authorization-business': getToken() |
|||
}, |
|||
dialogVisible: false, |
|||
shopObj: { |
|||
name: '', |
|||
address: '', |
|||
det: '', |
|||
phone: '' |
|||
} |
|||
} |
|||
}, |
|||
// 方法集合 |
|||
methods: { |
|||
handleRemove(file, fileList) { |
|||
console.log(file, fileList) |
|||
}, |
|||
handlePictureCardPreview(file) { |
|||
console.log(file) |
|||
this.dialogImageUrl = file.data.url |
|||
this.dialogVisible = true |
|||
}, |
|||
// 保存 |
|||
save() { |
|||
this.$router.push({ name: 'editShopSys', params: { id: '1' }}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang='scss' scoped> |
|||
//@import url(); 引入公共css类 |
|||
@import url("../../../styles/elDialog.scss"); |
|||
.shopDetail { |
|||
display: flex; |
|||
margin: 50px 50px; |
|||
} |
|||
.shopDetail_l { |
|||
width: 49%; |
|||
} |
|||
.shopDetail_r { |
|||
width: 49%; |
|||
} |
|||
.resBtn { |
|||
float: right; |
|||
width: 100px; |
|||
height: 48px; |
|||
background: #ffffff; |
|||
border-radius: 4px; |
|||
color: #333333; |
|||
border: 1px solid #e0e5eb; |
|||
margin-right: 20px; |
|||
} |
|||
.btnShop { |
|||
float: right; |
|||
width: 100px; |
|||
height: 48px; |
|||
background: #409eff; |
|||
border-radius: 4px; |
|||
color: #ffffff; |
|||
} |
|||
.common { |
|||
padding: 10px; |
|||
} |
|||
.span_f { |
|||
display: flex; |
|||
} |
|||
.card_span { |
|||
font-size: 24px; |
|||
color: #333333; |
|||
} |
|||
.shopMsg { |
|||
font-size: 24px; |
|||
color: #333333; |
|||
padding: 10px; |
|||
} |
|||
.logo { |
|||
font-size: 16px; |
|||
color: #333333; |
|||
padding: 10px; |
|||
} |
|||
.shopLogon { |
|||
padding: 10px; |
|||
img { |
|||
width: 100px; |
|||
height: 100px; |
|||
border-radius: 50%; |
|||
} |
|||
} |
|||
.span_1 { |
|||
font-size: 16px; |
|||
color: #333333; |
|||
margin-bottom: 20px; |
|||
} |
|||
.span_2 { |
|||
font-size: 16px; |
|||
color: #666666; |
|||
width: 500px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,136 @@ |
|||
<template> |
|||
<div class="setting-shop-page"> |
|||
<el-form ref="ruleForm" :model="crossDetail" :rules="rules" label-width="150px"> |
|||
<div class="h5"> |
|||
<div class="title">店铺跨境信息</div> |
|||
<el-button |
|||
v-if="!disabled1" |
|||
type="text" |
|||
@click="editDisabled1()" |
|||
>取消</el-button> |
|||
<el-button v-else type="text" @click="editDisabled1()">编辑</el-button> |
|||
<el-button |
|||
v-if="!disabled1" |
|||
type="text" |
|||
@click="updateCross('ruleForm')" |
|||
>保存</el-button> |
|||
</div> |
|||
<div class="shop-details"> |
|||
<el-form-item label="电商平台名称" prop="ebpname"> |
|||
<el-input v-model="crossDetail.ebpname" :disabled="disabled1" /> |
|||
</el-form-item> |
|||
<el-form-item label="电商平台代码" prop="ebpcode"> |
|||
<el-input v-model="crossDetail.ebpcode" :disabled="disabled1" /> |
|||
</el-form-item> |
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
</template> |
|||
<script> |
|||
import { shopcrossdetailGetAll, shopcrossdetailAdd, shopcrossdetailUpdate } from '@/api/shopSys'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
disabled1: true, |
|||
crossDetail: { |
|||
crossDetailId:'', |
|||
ebpname:'', |
|||
ebpcode:'' |
|||
}, |
|||
rules: { |
|||
ebpname: [ |
|||
{ required: true, message: '请输入电商平台名称', trigger: 'blur' }, |
|||
{ min:1, max:100, message: '长度不超过100个字符', trigger: 'blur'} |
|||
], |
|||
ebpcode: [ |
|||
{ required: true, message: '请输入电商平台代码', trigger: 'blur' }, |
|||
{ min:1, max:10, message: '长度不超过10个字符', trigger: 'blur'} |
|||
], |
|||
} |
|||
}; |
|||
}, |
|||
created() { |
|||
this.getCrossDetails(); |
|||
}, |
|||
methods: { |
|||
async getCrossDetails() { |
|||
const res = await shopcrossdetailGetAll({ page: 1, |
|||
pageSize: 10}); |
|||
if (res.code === '' && res.data && res.data.total > 0) { |
|||
this.crossDetail = res.data.list[0]; |
|||
} |
|||
}, |
|||
// 编辑取消 |
|||
editDisabled1() { |
|||
this.disabled1 = !this.disabled1; |
|||
}, |
|||
async updateCross(ruleForm) { |
|||
this.$refs[ruleForm].validate(valid => { |
|||
if (valid) { |
|||
if(this.crossDetail.crossDetailId && this.crossDetail.crossDetailId.length > 0){ |
|||
shopcrossdetailUpdate(this.crossDetail).then(res => { |
|||
if (res.code === '') { |
|||
this.getCrossDetails() |
|||
this.disabled1 = true; |
|||
this.$message({ |
|||
message: '修改成功', |
|||
type: 'success', |
|||
}); |
|||
} |
|||
}) |
|||
}else { |
|||
shopcrossdetailAdd(this.crossDetail).then(res => { |
|||
if (res.code === '') { |
|||
this.getCrossDetails() |
|||
this.disabled1 = true; |
|||
this.$message({ |
|||
message: '修改成功', |
|||
type: 'success', |
|||
}); |
|||
} |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
@import url("../../../styles/elDialog.scss"); |
|||
.setting-shop-page { |
|||
margin-top: 20px; |
|||
min-height: calc(100% - 20px); |
|||
background-color: #ffffff; |
|||
padding: 15px 20px; |
|||
.h5 { |
|||
max-width: 1000px; |
|||
display: flex; |
|||
font-size: 20px; |
|||
margin: 20px auto; |
|||
padding-left: 10px; |
|||
padding-right: 200px; |
|||
|
|||
flex-wrap: 800; |
|||
.title { |
|||
flex: 1; |
|||
} |
|||
} |
|||
.shop-details { |
|||
max-width: 800px; |
|||
margin: auto; |
|||
.el-input, |
|||
.el-textarea { |
|||
width: 300px; |
|||
} |
|||
// 不能编辑样式 |
|||
.el-input.is-disabled .el-input__inner, |
|||
.el-textarea.is-disabled .el-textarea__inner { |
|||
cursor: inherit; |
|||
background-color: #f8f8f8; |
|||
border: 1px solid #f8f8f8; |
|||
color: #606266; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,318 @@ |
|||
<template> |
|||
<el-dialog |
|||
:close-on-click-modal="false" |
|||
:title="title" |
|||
:type="type" |
|||
:visible.sync="isVisible" |
|||
:modal-append-to-body="false" |
|||
:center="true" |
|||
width="80%" |
|||
top="50px" |
|||
class="dialog-wrap" |
|||
> |
|||
<el-form class="dialog-from" :model="params" label-width="150px"> |
|||
<el-form-item label="仓库名称"> |
|||
<el-input |
|||
v-model="params.storehouseName" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/> |
|||
</el-form-item> |
|||
<el-form-item label="仓库类型"> |
|||
<el-radio-group v-model="params.type"> |
|||
<el-radio :disabled="isDisabled" :label="1">自营仓</el-radio> |
|||
<el-radio :disabled="isDisabled" :label="2">委外仓</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
<el-form-item label="仓库种类"> |
|||
<el-radio-group v-model="params.kind"> |
|||
<el-radio :disabled="isDisabled" :label="1">国内仓</el-radio> |
|||
<el-radio :disabled="isDisabled" :label="2">保税仓</el-radio> |
|||
<el-radio :disabled="isDisabled" :label="3">海外仓</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="订单金额限制" v-if="params.kind==2"> |
|||
<div class="form-item-row"> |
|||
<div class="el-row" style="margin-bottom: 10px;"> |
|||
订单只有一个商品时，订单金额(即订单实付金额)不超过 |
|||
<el-input |
|||
v-model="params.oneProductOrderPriceLimit" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/>元 |
|||
</div> |
|||
</div> |
|||
<div class="form-item-row"> |
|||
<div class="el-row" style="margin-bottom: 10px;"> |
|||
订单包含多个商品时，订单金额(即订单实付金额)不超过 |
|||
<el-input |
|||
v-model="params.moreProductOrderPriceLimit" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/>元 |
|||
</div> |
|||
</div> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="订单商品数量限制" v-if="params.kind==2"> |
|||
<div class="form-item-row"> |
|||
<div class="el-row" style="margin-bottom: 10px;"> |
|||
订单中每个商品数量不超过 |
|||
<el-input |
|||
v-model="params.oneProductNumLimit" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/>件 |
|||
</div> |
|||
</div> |
|||
<div class="form-item-row"> |
|||
<div class="el-row" style="margin-bottom: 10px;"> |
|||
订单中总商品数量不超过 |
|||
<el-input |
|||
v-model="params.moreProductNumLimit" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/>件 |
|||
</div> |
|||
</div> |
|||
</el-form-item> |
|||
<el-form-item label="订单次数限制" v-if="params.kind==2"> |
|||
<div class="form-item-row"> |
|||
<div class="el-row" style="margin-bottom: 10px;"> |
|||
每个身份证每日下单次数不超过 |
|||
<el-input |
|||
v-model="params.orderNumberLimit" |
|||
maxlength="20" |
|||
:readonly="isDisabled" |
|||
onblur="value=value.replace(/(^\s*)|(\s*$)/g, '')" |
|||
/>次 |
|||
</div> |
|||
</div> |
|||
|
|||
</el-form-item> |
|||
<el-form-item label="是否收银台"> |
|||
<el-radio-group v-model="params.ifCashier"> |
|||
<el-radio :disabled="isDisabled" :label="1">是</el-radio> |
|||
<el-radio :disabled="isDisabled" :label="0">否</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div slot="footer" class="btn-wrap"> |
|||
<el-button type="primary" @click="onSubmit">确定</el-button> |
|||
<el-button @click="isVisible = false">取消</el-button> |
|||
</div> |
|||
<el-dialog |
|||
width="60%" |
|||
title="选择配送区域" |
|||
class="address-dialog" |
|||
:visible.sync="areaVisible" |
|||
append-to-body |
|||
> |
|||
<div class="area-dialog"> |
|||
<el-row> |
|||
<template v-for="(province, index) in areaList"> |
|||
<el-col v-if="province.list.length > 0" :key="index" class="province-wrap" :span="8"> |
|||
<el-checkbox-group |
|||
v-model="province.selected" |
|||
@change="checkboxChange(province.keyId, province.selected)" |
|||
> |
|||
<el-checkbox>{{ province.provinceName }}</el-checkbox> |
|||
</el-checkbox-group> |
|||
<el-cascader |
|||
v-model="province.selectCity" |
|||
:options="province.list" |
|||
:props="{ |
|||
multiple: true, |
|||
children: 'list', |
|||
label: 'city', |
|||
value: 'city' |
|||
}" |
|||
collapse-tags |
|||
filterable |
|||
@change="changeCity(province)" |
|||
/> |
|||
</el-col> |
|||
</template> |
|||
</el-row> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button @click="areaVisible = false">取 消</el-button> |
|||
<el-button type="primary" @click="getSelectData">确 定</el-button> |
|||
</div> |
|||
</el-dialog> |
|||
</el-dialog> |
|||
</template> |
|||
<script> |
|||
|
|||
import { storehouseGetById, storehouseAdd, storehouseUpdate } from '@/api/shopSys' |
|||
|
|||
export default { |
|||
props: { |
|||
dialogVisible: { |
|||
type: Boolean, |
|||
default: false |
|||
}, |
|||
type: { |
|||
type: String, |
|||
default: 'add' |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
sizeForm: {}, |
|||
headers: { |
|||
Authorization: '' |
|||
}, |
|||
dataObj: { |
|||
folderId: 1 |
|||
}, |
|||
params: { |
|||
storehouseName: '', |
|||
type: 1, |
|||
kind: 1, |
|||
ifCashier : 1, |
|||
oneProductOrderPriceLimit: 5000, |
|||
moreProductOrderPriceLimit: 5000, |
|||
oneProductNumLimit: 0, |
|||
moreProductNumLimit: 0, |
|||
orderNumberLimit: 10 |
|||
}, |
|||
checkId: null |
|||
} |
|||
}, |
|||
computed: { |
|||
isVisible: { |
|||
get() { |
|||
return this.dialogVisible |
|||
}, |
|||
set() { |
|||
this.close() |
|||
this.reset() |
|||
} |
|||
}, |
|||
isDisabled() { |
|||
return this.type === 'check' |
|||
}, |
|||
title() { |
|||
const titleMap = { |
|||
add: '新建仓库', |
|||
check: '查看仓库', |
|||
edit: '修改仓库' |
|||
} |
|||
return titleMap[this.type] |
|||
} |
|||
}, |
|||
created() { |
|||
}, |
|||
methods: { |
|||
close() { |
|||
this.$emit('close') |
|||
}, |
|||
reset() { |
|||
this.params = { |
|||
storehouseName: '', |
|||
type: 1, |
|||
kind: 1, |
|||
ifCashier : 1, |
|||
oneProductOrderPriceLimit: 5000, |
|||
moreProductOrderPriceLimit: 5000, |
|||
oneProductNumLimit: 0, |
|||
moreProductNumLimit: 0, |
|||
orderNumberLimit: 10 |
|||
} |
|||
}, |
|||
// 查看详情 |
|||
async getDetails() { |
|||
const res = await storehouseGetById({ storehouseId: this.checkId }) |
|||
if (res.code === '') { |
|||
this.params = res.data |
|||
} |
|||
}, |
|||
async onSubmit() { |
|||
if (this.params.storehouseName === '') { |
|||
this.$message.error('请输入仓库名称') |
|||
} else if (this.type === 'add') { |
|||
this.add() |
|||
} else if (this.type === 'edit') { |
|||
this.update() |
|||
} else { |
|||
this.isVisible = false |
|||
} |
|||
}, |
|||
async add() { |
|||
const res = await storehouseAdd(this.params) |
|||
if (res.code === '') { |
|||
this.isVisible = false |
|||
this.$message({ |
|||
message: '成功添加', |
|||
type: 'success' |
|||
}) |
|||
this.$emit('success') |
|||
} |
|||
}, |
|||
async update() { |
|||
const res = await storehouseUpdate(this.params) |
|||
if (res.code === '') { |
|||
this.isVisible = false |
|||
this.$message({ |
|||
message: '成功', |
|||
type: 'success' |
|||
}); |
|||
this.$emit('success') |
|||
} |
|||
}, |
|||
setParams(val = {}) { |
|||
if (val['params']) { |
|||
this.params = val['params'] |
|||
} |
|||
if (val['checkId']) { |
|||
this.checkId = val['checkId'] |
|||
this.getDetails() |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.dialog-wrap { |
|||
::v-deep .el-dialog { |
|||
display: flex; |
|||
flex-direction: column; |
|||
max-height: 80vh; |
|||
max-width: 900px; |
|||
overflow: hidden; |
|||
|
|||
.el-dialog__body { |
|||
flex: 1; |
|||
overflow: auto; |
|||
} |
|||
} |
|||
|
|||
.dialog-from { |
|||
width: 90%; |
|||
margin: auto; |
|||
|
|||
|
|||
} |
|||
|
|||
.btn-wrap { |
|||
margin: 45px auto 0; |
|||
text-align: right; |
|||
} |
|||
|
|||
.form-item-row { |
|||
// padding-top: 40px; |
|||
::v-deep .el-input { |
|||
width: 80px; |
|||
margin: 0 5px; |
|||
} |
|||
} |
|||
} |
|||
|
|||
</style> |
|||
@ -0,0 +1,217 @@ |
|||
<!-- --> |
|||
<template> |
|||
<div> |
|||
<div class="pending"> |
|||
<!-- 搜索 --> |
|||
<div class="formSearch"> |
|||
<el-form :inline="true" :model="formParams" class="demo-form-inline"> |
|||
<el-form-item label="仓库名称"> |
|||
<el-input v-model="formParams.logisticsName" placeholder="请输入仓库名称" /> |
|||
</el-form-item> |
|||
<el-form-item> |
|||
<el-button type="success" plain @click="add">新增仓库</el-button> |
|||
<el-button type="primary" plain @click="search">查询</el-button> |
|||
<span v-for="(item,index) in btnList" :key="index" class="promissStyle"> |
|||
<el-button type="success" plain @click="btnClick(item)">{{ item.permissionName }}</el-button> |
|||
</span> |
|||
</el-form-item> |
|||
</el-form> |
|||
</div> |
|||
<!-- 表格 --> |
|||
<div class="tableBox"> |
|||
<el-table |
|||
ref="multipleTable" |
|||
:data="tableData" |
|||
border |
|||
:header-cell-style="{ background: '#EEF3FF', color: '#333333' }" |
|||
tooltip-effect="dark" |
|||
style="width: 100%" |
|||
> |
|||
<el-table-column label="仓库名称" width="220"> |
|||
<template slot-scope="scope">{{ scope.row.storehouseName }}</template> |
|||
</el-table-column> |
|||
<el-table-column prop="type" label="仓库类型" width="220" > |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.type == 1">自营仓</span> |
|||
<span v-if="scope.row.type == 2">委外仓</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column prop="kind" label="仓库种类" width="220"> |
|||
<template slot-scope="scope"> |
|||
<span v-if="scope.row.kind == 1">国内仓</span> |
|||
<span v-if="scope.row.kind == 2">保税仓</span> |
|||
<span v-if="scope.row.kind == 3">海外仓</span> |
|||
</template> |
|||
</el-table-column> |
|||
<el-table-column label="操作" show-overflow-tooltip> |
|||
<template slot-scope="scope"> |
|||
<div class="btnList"> |
|||
<el-button type="text" @click="seeMore(scope.row)">查看</el-button> |
|||
<el-button type="text" @click="edit(scope.row)">编辑</el-button> |
|||
<el-button type="text" @click="del(scope.row)">删除</el-button> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
<div class="fenye"> |
|||
<el-pagination |
|||
:current-page="currentPage" |
|||
:page-sizes="[10, 20, 50, 100]" |
|||
:page-size="10" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="total" |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
/> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- 方案组件 --> |
|||
<grope-edit |
|||
ref="edit" |
|||
:dialog-visible="dialog.isVisible" |
|||
:type="dialog.type" |
|||
@close="editClose" |
|||
@success="getLists" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等） |
|||
// 例如：import 《组件名称》 from '《组件路径》'; |
|||
import { getBtnList } from '@/utils/auth' |
|||
import { storehouseGetAll, storehouseDelete } from '@/api/shopSys' |
|||
import GropeEdit from './Edit' |
|||
export default { |
|||
components: { |
|||
GropeEdit |
|||
}, |
|||
data() { |
|||
// 这里存放数据 |
|||
return { |
|||
btnList: '', |
|||
formParams: { |
|||
storehouseName: '', |
|||
page: 1, |
|||
pageSize: 10 |
|||
}, |
|||
total: 1, |
|||
tableData: [], |
|||
currentPage: 1, |
|||
dialog: { |
|||
type: 'add', |
|||
isVisible: false |
|||
} |
|||
} |
|||
}, |
|||
// 监听属性 类似于data概念 |
|||
computed: {}, |
|||
// 监控data中的数据变化 |
|||
watch: {}, |
|||
// 生命周期 - 创建完成（可以访问当前this实例） |
|||
created() {}, |
|||
// 生命周期 - 挂载完成（可以访问DOM元素） |
|||
mounted() { |
|||
this.getList(this.formParams) |
|||
this.btnList = getBtnList() |
|||
console.log(this.btnList, 'btnList') |
|||
}, |
|||
// 方法集合 |
|||
methods: { |
|||
btnClick(id) { |
|||
console.log(id) |
|||
if (id.permissionName === '新建仓库') { |
|||
this.add() |
|||
} |
|||
}, |
|||
handleSizeChange(val) { |
|||
this.formParams.pageSize = val |
|||
this.getList(this.formParams) |
|||
}, |
|||
handleCurrentChange(val) { |
|||
this.formParams.page = val |
|||
this.getList(this.formParams) |
|||
}, |
|||
getLists() { |
|||
console.log(111) |
|||
this.getList(this.formParams) |
|||
}, |
|||
// 查询 |
|||
search() { |
|||
this.total = 1 |
|||
this.formParams.page = 1 |
|||
this.getList(this.formParams) |
|||
}, |
|||
// 新建方案 |
|||
add() { |
|||
this.dialog = { |
|||
type: 'add', |
|||
isVisible: true |
|||
} |
|||
}, |
|||
// 查看 |
|||
seeMore(row) { |
|||
const { storehouseId } = row |
|||
this.dialog = { |
|||
type: 'check', |
|||
isVisible: true |
|||
} |
|||
this.$refs.edit.setParams({ |
|||
checkId: storehouseId |
|||
}) |
|||
}, |
|||
// 编辑 |
|||
edit(row) { |
|||
const { storehouseId } = row |
|||
this.dialog = { |
|||
type: 'edit', |
|||
isVisible: true |
|||
} |
|||
this.$refs.edit.setParams({ |
|||
checkId: storehouseId |
|||
}) |
|||
}, |
|||
// 关闭弹框 |
|||
editClose() { |
|||
this.dialog.isVisible = false |
|||
}, |
|||
// 删除 |
|||
del(row) { |
|||
this.$confirm('选中数据将被永久删除, 是否继续？', '提示', { |
|||
confirmButtonText: '确定', |
|||
cancelButtonText: '取消', |
|||
type: 'warning' |
|||
}) |
|||
.then(() => { |
|||
storehouseDelete({ storehouseId: row.storehouseId }).then(res => { |
|||
if (res.code === '') { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '删除成功!' |
|||
}) |
|||
} |
|||
this.getList(this.formParams) |
|||
}) |
|||
}) |
|||
.catch(() => {}) |
|||
}, |
|||
// 初始化查询所有数据 |
|||
async getList(formParams) { |
|||
const res = await storehouseGetAll(formParams) |
|||
this.tableData = res.data.list |
|||
this.total = res.data.total |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
<style lang='scss' scoped> |
|||
//@import url(); 引入公共css类 |
|||
@import url("../../../styles/elDialog.scss"); |
|||
.pending { |
|||
padding: 30px; |
|||
} |
|||
.fenye { |
|||
margin-top: 20px; |
|||
} |
|||
</style> |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue