文件

269 行
9.5 KiB
HTML
可执行文件

<!--[1.6.48]-->
<style>
th {
background-color: #f5f7fa !important;
}
th > .cell {
white-space: nowrap !important;
text-align: center;
}
th, td {
text-align: center;
line-height: 30px;
padding: 0;
}
th > .cell, td > .cell {
text-align: center;
}
.el-pagination {
padding: 8px;
}
.el-input {
width: 200px;
}
.center-content {
margin: 20px 0;
display: flex;
justify-content: space-between;
align-items: center;
}
.center-content .el-input__inner {
padding: 0 15px;
text-align: left;
}
#moreEditBox * {
display: none;
}
.small-dialog-content {
margin-top: 15vh;
margin-left: 48vh;
}
.goods_title {
padding: 10px 0;
}
.el-table__row > td:last-child > .cell {
white-space: nowrap;
}
</style>
<div class="goodsBox" id="warehouse" v-cloak>
<div class="goods_title">
<div class="goods_title_inner">
采购仓库
</div>
</div>
<div class="center-content">
<div>
<if condition="$authArr['addWarehouse'] eq true">
<el-button type="primary" plain @click="addWarehouse('添加仓库','{:U('addWarehouse')}')" size="small">新增仓库
</el-button>
</if>
</div>
</div>
<div style="max-width: calc(100vw - 208px);">
<el-table size="small"
v-loading="loading"
:data="warehouseList"
border
style="width: 100%">
<el-table-column prop="index" width="50px" label="序号" show-overflow-tooltip></el-table-column>
<el-table-column prop="add_time" label="创建时间" show-overflow-tooltip></el-table-column>
<el-table-column prop="number" label="仓库编号" show-overflow-tooltip></el-table-column>
<el-table-column prop="name" label="仓库名称" show-overflow-tooltip></el-table-column>
<el-table-column prop="measure_area" label="仓库面积(m)" show-overflow-tooltip></el-table-column>
<el-table-column prop="region" label="所在地区" show-overflow-tooltip></el-table-column>
<el-table-column prop="address" label="详细地址" show-overflow-tooltip></el-table-column>
<el-table-column prop="person_name" label="负责人" show-overflow-tooltip></el-table-column>
<el-table-column prop="person_phone" label="负责人手机号" show-overflow-tooltip></el-table-column>
<el-table-column prop="remarks" label="备注" show-overflow-tooltip></el-table-column>
<el-table-column fixed="right" label="操作" style="border-right: none;">
<template slot-scope="scope">
<if condition="$authArr['setWarehouse'] eq true">
<el-button
@click.native.prevent="setWarehouse('编辑仓库','{:U('addWarehouse')}?id=' + scope.row.id)"
type="text" size="small">编辑
</el-button>
</if>
<if condition="$authArr['delWarehouse'] eq true">
<el-button @click.native.prevent="delWarehouse(scope.row.id)" style="color: #999" type="text"
size="small">删除
</el-button>
</if>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 15, 20, 25, 30, 35, 40, 45, 50]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="currentLen">
</el-pagination>
</div>
<!-- 页面加载-->
<el-dialog :title="dialogTitle"
:visible.sync="showSetChild"
:close-on-click-modal="false"
:append-to-body="true"
custom-class="small-dialog-content"
:close-on-press-escape="false"
:before-close="closeChild"
:show-close="true"
:center="true"
width="60%"
:modal="true"
>
<div id="ChildHtml" v-loading="loading"
element-loading-text="数据加载中,请等待"
element-loading-spinner="el-icon-loading"></div>
</el-dialog>
</div>
<script type="text/javascript">
var warehouse = new Vue({
el: '#warehouse',
data: function () {
return {
currentPage: 1,
currentLimit: 10,
currentLen: 0,
warehouseList: [],
loading: true,
dialogTitle: '',
showSetChild: false,
}
},
methods: {
//初始化表格信息
getData: function () {
var that = this;
that.loading = true;
$.ajax({
url: "{:U(warehouseList)}",
type: 'POST',
data: {
page: this.currentPage,
limit: this.currentLimit,
},
success: function (res) {
if (res.status == 1) {
that.loading = false;
that.warehouseList = [];
that.warehouseList = res.data;
that.$nextTick(function () {
that.currentLen = parseInt(res.count);
})
} else {
that.$message({
type: 'error',
message: res.msg,
duration: 1500
})
}
}
});
},
handleSizeChange: function (val) {
this.currentLimit = val;//切换每页数量
this.currentPage = 1;
this.getData();
},
handleCurrentChange: function (val) {
this.currentPage = val;
this.getData();//切换页数
},
closeChild: function () {
$('#ChildHtml').html('');
this.showSetChild = false;
this.getData();
},
//添加
addWarehouse: function (title, url) {
var that = this;
that.dialogTitle = title;
that.showSetChild = true;
that.loading = true;
$.get(url, function (data) {
that.loading = false;
$('#ChildHtml').html(data);
$('#ChildHtml').ready(function () {
that.loading = false;
});
});
},
//编辑
setWarehouse: function (title, url) {
var that = this;
that.dialogTitle = title;
that.showSetChild = true;
that.loading = true;
$.get(url, function (data) {
that.loading = false;
$('#ChildHtml').html(data);
$('#ChildHtml').ready(function () {
that.loading = false;
});
});
},
//删除
delWarehouse: function (id) {
var that = this;
this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
that.loading = true;
$.ajax({
url: "{:U('deleteWarehouseOperation')}",
data: {id: id},
type: "post",
success: function (res) {
if (res.status === 1) {
that.$message({
type: "success",
message: res.msg,
duration: 1000,
onClose: function () {
that.loading = false;
that.getData();
}
})
} else {
that.$message({
type: "error",
message: res.msg,
duration: 1000,
onClose: function () {
that.loading = false;
}
})
}
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消操作'
});
});
}
},
created: function () {
this.getData();
}
})
</script>