Commit 3f61bcff authored by 黄媛媛's avatar 黄媛媛
parents 2968c0ef b181f574
<template> <template>
<div class="Materialwarehouse"> <div class="Archivesmaterials">
<ul class="queryul"> <div style="text-align:right;border-bottom:1px solid #E2E4EB;padding-bottom:10px">
<li> <span class="pageTitle">仓库名称</span>
<span> <span @click="morequery=!morequery" style="display:inline-flex;align-items:center;cursor: pointer;" class="f12 cd6">高级查询
<em>仓库名称</em> <img v-show="!morequery" style="width:12px;height:12px" src="../../assets/img/more.png" alt="">
<img v-show="morequery" class="roatImg" style="width:12px;height:12px" src="../../assets/img/more.png" alt="">
</span> </span>
<el-input class="w200" size="small" v-model="msg.Name" placeholder="请输入"></el-input> <span @click="getList" style="margin-left:20px" class="chaxunSpan">查询</span>
<!-- <span @click="chongzhi" style="margin-left:20px" class="addSpan">重置</span> -->
<span @click="addSupplier" style="margin-left:20px" class="addSpan">
<img style="width:10px;height:10px;margin-right:6px" src="../../assets/img/add.png" alt="">
新增</span>
</div>
<ul v-show="morequery" class="queryul">
<li>
<el-input class="w200" size="small" v-model="msg.Name" placeholder="仓库名称"></el-input>
</li> </li>
<li> <li>
<span> <el-input class="w200" size="small" v-model="msg.SuppliesNum" placeholder="物料编码"></el-input>
<em>物料编码</em>
</span>
<el-input class="w200" size="small" v-model="msg.SuppliesNum" placeholder="请输入"></el-input>
</li> </li>
<el-button @click="addSupplier" size="small" type="danger">新增</el-button>
<el-button @click="getList" size="small">查询</el-button>
</ul> </ul>
<vxe-table style="margin-top:20px" :data="tableData" :loading="loading" size="small"> <table style="margin-top:10px" class="myTable" v-loading="loading" border="0" cellspacing="0" cellpadding="0">
<vxe-table-column field="Name" title="物料档案名称"></vxe-table-column> <thead>
<vxe-table-column field="CategoryName" title="分类名称"></vxe-table-column> <th>物料档案名称</th>
<vxe-table-column field="BrandName" title="品牌名"></vxe-table-column> <th>分类名称</th>
<vxe-table-column field="Money" title="成本价"></vxe-table-column> <th>品牌名</th>
<vxe-table-column field="SupplierName" title="供应商名称"></vxe-table-column> <th>成本价</th>
<vxe-table-column field="Barcode" title="条形码号"></vxe-table-column> <th>供应商名称</th>
<vxe-table-column title="库存"> <th>条形码号</th>
<template v-slot="{ row, rowIndex }"> <th>库存</th>
<p>预警库存:{{row.ReservedStock}}</p> <th>型号</th>
<p>安全库存:{{row.SafetyStock}}</p> <th>档案编码</th>
<th>图片</th>
</template> <th>操作人</th>
</vxe-table-column> <th>操作时间</th>
<vxe-table-column field="SuppliesModel" title="型号"></vxe-table-column> <th>备注</th>
<vxe-table-column field="SuppliesNum" title="档案编码"></vxe-table-column> <th>操作</th>
<vxe-table-column title="图片"> </thead>
<template v-slot="{ row, rowIndex }"> <tbody>
<img v-for="(item,index) in row.ImageList" :key="index" :src="item" alt=""> <tr v-for="(item,index) in tableData" :key="index">
<td>
</template> <span class="commonStyle hoverSpan1"></span>
</vxe-table-column> {{item.Name}}
<vxe-table-column field="UpdateBy" title="操作人"></vxe-table-column> </td>
<vxe-table-column field="UpdateDate" title="操作时间"></vxe-table-column> <td>{{item.CategoryName}}</td>
<vxe-table-column field="Remark" title="备注"></vxe-table-column> <td>{{item.BrandName}}</td>
<vxe-table-column title="操作" width="120"> <td>{{item.Money}}</td>
<template v-slot="{ row, rowIndex }"> <td>{{item.SupplierName}}</td>
<td>{{item.Barcode}}</td>
<td>
<div>预警库存:{{item.ReservedStock}}</div>
<div>安全库存:{{item.SafetyStock}}</div>
</td>
<td>{{item.SuppliesModel}}</td>
<td>{{item.SuppliesNum}}</td>
<td>
<img v-for="(subItem,index) in item.ImageList" :key="index" :src="subItem" alt="">
</td>
<td>{{item.UpdateBy}}</td>
<td>{{item.UpdateDate}}</td>
<td>{{item.Remark}}</td>
<td>
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<i @click="Edit(row)" class="iconfont icon-xiugai"></i> <img @click="Edit(item)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<i @click="Delete(row)" class="iconfont icon-shanchu"></i> <img @click="Delete(item)" style="width:24px;height:24px" src="../../assets/img/delete.png" alt="">
</el-tooltip> </el-tooltip>
</template> <span class="commonStyle hoverSpan2"></span>
</vxe-table-column> </td>
</vxe-table>
<vxe-pager </tr>
:current-change="currentChange" <tr v-show="tableData.length==0">
:current-page.sync="currentPage" <td colspan="12" align="center">暂无数据</td>
:page-size.sync="msg.pageSize" </tr>
:total="total" </tbody>
align="center" </table>
:layouts="['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total']"> <el-pagination
</vxe-pager> @current-change="currentChange"
background
layout="prev, pager, next"
:total="total">
</el-pagination>
<el-dialog <el-dialog
:title="dialogtitle" :title="dialogtitle"
:visible.sync="dialogState" :visible.sync="dialogState"
width="680px" style="height:700px"> top="3%"
<el-form class="Archivesform" :model="addMsg" :rules="rules" ref="addMsg" label-width="100px"> width="850px">
<el-form-item label="档案名称" prop="Name"> <el-form class="MyEditForm" :model="addMsg" :rules="rules" ref="addMsg" label-width="0">
<el-form-item prop="Name">
<span class="label">档案名称</span>
<el-input size="small" v-model="addMsg.Name"></el-input> <el-input size="small" v-model="addMsg.Name"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="档案编码"> <el-form-item>
<span class="label">档案编码</span>
<el-input size="small" v-model="addMsg.SuppliesNum"></el-input> <el-input size="small" v-model="addMsg.SuppliesNum"></el-input>
</el-form-item> </el-form-item>
<el-form-item style="float:left" label="品牌名称" prop="BrandName"> <el-form-item prop="BrandName">
<span class="label">品牌名称</span>
<el-input size="small" v-model="addMsg.BrandName"></el-input> <el-input size="small" v-model="addMsg.BrandName"></el-input>
</el-form-item> </el-form-item>
<el-form-item class="treeItem" label="分类"> <el-form-item class="treeItem" style="float:left;">
<treeselect style="height:36px" class='w200 fl' :options="treedata" v-model="addMsg.CategoryId" placeholder="不限" <span class="label">分类</span>
<treeselect style="height:32px" class='w200 fl' :options="treedata" v-model="addMsg.CategoryId" placeholder="不限"
:normalizer="normalizer" @select='treeClick' /> :normalizer="normalizer" @select='treeClick' />
</el-form-item> </el-form-item>
<el-form-item label="供应商名称"> <el-form-item>
<span class="label">供应商名称</span>
<el-input size="small" v-model="addMsg.SupplierName"></el-input> <el-input size="small" v-model="addMsg.SupplierName"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="安全库存"> <el-form-item>
<span class="label">安全库存</span>
<el-input size="small" v-model="addMsg.SafetyStock"></el-input> <el-input size="small" v-model="addMsg.SafetyStock"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="预警预存"> <el-form-item>
<span class="label">预警预存</span>
<el-input size="small" v-model="addMsg.ReservedStock"></el-input> <el-input size="small" v-model="addMsg.ReservedStock"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="型号"> <el-form-item>
<span class="label">型号</span>
<el-input size="small" v-model="addMsg.SuppliesModel"></el-input> <el-input size="small" v-model="addMsg.SuppliesModel"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="单位"> <el-form-item>
<span class="label">单位</span>
<el-input size="small" v-model="addMsg.Units"></el-input> <el-input size="small" v-model="addMsg.Units"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="成本价"> <el-form-item>
<span class="label">成本价</span>
<el-input size="small" v-model="addMsg.Money"></el-input> <el-input size="small" v-model="addMsg.Money"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="条形码号"> <el-form-item>
<span class="label">条形码号</span>
<el-input size="small" v-model="addMsg.Barcode"></el-input> <el-input size="small" v-model="addMsg.Barcode"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="备注"> <el-form-item>
<span class="label">备注</span>
<el-input size="small" v-model="addMsg.Remark"></el-input> <el-input size="small" v-model="addMsg.Remark"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="图片">
<div class="_addUpload_box"> <div class="_addUpload_box">
<div class="_pic_upload"> <ul class="uploadUl">
<!-- <template v-if="addMsg.images!==''"> <li>
<div> <img src="../../assets/img/pic.png" alt="">
<div <div class="hoverDiv">
style="width:100%;height:100%;overflow: hidden;display: flex;align-items: center;" <img src="../../assets/img/imgdelete.png" alt="">
>
<img :src="addMsg.images">
<span
style="font-size:12px; color:#666666;cursor: pointer;line-height: 20px;"
@click="addMsg.images=''"
>重新上传</span>
</div>
</div> </div>
</template> --> </li>
</ul>
<div class="uploadDiv">
<el-upload <el-upload
:http-request="uploadFileBtn" :http-request="uploadFileBtn"
:multiple="false" :multiple="false"
:show-file-list="false" :show-file-list="false"
action action
> >
<i class="el-icon-plus avatar-uploader-icon"></i> <img style="width:40px;height:36px" src="../../assets/img/pic.png" alt="">
<div class="el-upload__text">点击/拖拽上传</div> <div class="el-upload__text">上传图片</div>
</el-upload> </el-upload>
</div> </div>
</div> </div>
</el-form-item> <div class="btnformItem">
<el-form-item> <span class="submitBtn" type="primary" @click="submitForm('addMsg')">确定</span>
<el-button size="small" type="primary" @click="submitForm('addMsg')">确定</el-button> <span class="exitBtn" @click="dialogState=false">取消</span>
<el-button size="small" @click="dialogState=false">取消</el-button> </div>
</el-form-item>
</el-form> </el-form>
</el-dialog> </el-dialog>
</div> </div>
...@@ -144,20 +172,21 @@ ...@@ -144,20 +172,21 @@
import Treeselect from "@riophae/vue-treeselect"; import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default { export default {
name: 'Materialwarehouse', name: 'Archivesmaterials',
components: { components: {
Treeselect Treeselect
}, },
data(){ data(){
return{ return{
morequery:false,
normalizer(node) { normalizer(node) {
var obj = { var obj = {
id: node.label, id: node.Id,
// label: node.DepartmentName, label: node.Name,
}; };
// if (node.ChildList != null && node.ChildList.length > 0) { if (node.ChildList != null && node.ChildList.length > 0) {
// obj.children = node.ChildList; obj.children = node.ChildList;
// } }
return obj; return obj;
}, },
currentPage:1, currentPage:1,
...@@ -190,7 +219,7 @@ export default { ...@@ -190,7 +219,7 @@ export default {
ImageList:'', ImageList:'',
}, },
dialogtitle:'新增物料档案', dialogtitle:'新增物料档案',
dialogState:true, dialogState:false,
rules:{ rules:{
Name: [ Name: [
{ required: true, message: '请输入供应商名称', trigger: 'blur' } { required: true, message: '请输入供应商名称', trigger: 'blur' }
...@@ -246,12 +275,7 @@ export default { ...@@ -246,12 +275,7 @@ export default {
label: 'label', label: 'label',
}, },
treedataState:false, treedataState:false,
} }
},
created(){
}, },
mounted(){ mounted(){
this.getList(); this.getList();
...@@ -348,10 +372,12 @@ export default { ...@@ -348,10 +372,12 @@ export default {
Edit(item){ Edit(item){
this.dialogtitle="编辑物料档案"; this.dialogtitle="编辑物料档案";
this.dialogState=true; this.dialogState=true;
this.addMsg={ console.log(item,'item');
Id:item.Id, this.addMsg=Object.assign({},item);
Name:item.Name, // this.addMsg={
} // Id:item.Id,
// Name:item.Name,
// }
}, },
Delete(item){ Delete(item){
let Id=item.Id; let Id=item.Id;
...@@ -390,70 +416,34 @@ export default { ...@@ -390,70 +416,34 @@ export default {
}, },
null null
); );
}, }
}, },
} }
</script> </script>
<style> <style scoped>
.Archivesform .treeItem .el-form-item__content{ .Archivesmaterials .hoverSpan1{
line-height: 36px; left: -20px;
} }
.Archivesform .el-form-item{ .Archivesmaterials .hoverSpan2{
display: inline-block; right: -20px;
position: relative;
} }
.Archivesform ._addUpload_box { .Archivesmaterials .commonStyle{
display: block; height:100%;
margin: 10px 0 0; background:#fff;
}
._addUpload_box>div{
float: left;
width: 138px;
height: 92px;
border: 1px dashed rgba(210,210,210,1);
border-radius: 2px;
cursor: pointer;
margin-bottom: 10px;
padding: 5px;
margin-right: 10px;
position: relative;
}
.Archivesform ._addUpload_box img {
height: 15px;
display: block;
margin-right: 25px;
}
.Archivesform ._addUpload_box > div.el-upload {
float: left;
width: 138px;
height: 92px;
border: 1px dashed rgba(210, 210, 210, 1);
border-radius: 2px;
cursor: pointer;
margin-bottom: 10px;
padding: 5px;
margin-right: 10px;
position: relative;
}
.Archivesform ._addUpload_box .icon-guanbi1 {
font-size: 12px;
color: white;
display: inline-block;
margin-left: 15px;
position: absolute; position: absolute;
left: 9px; width: 20px;
top: -5px; top:0;
background-color: #f56c6c; display: none;
border-radius: 50%;
height: 15px;
width: 15px;
text-align: center;
line-height: 15px;
} }
.Archivesform ._addUpload_box > div:hover { .Archivesmaterials{
background-color: #f5f5f5; background: #F8FAFB;
width: 100%;
min-height: 100%;
position: absolute;
padding: 20px 30px;
box-sizing: border-box;
} }
</style> </style>
<template> <template>
<div class="Materialwarehouse"> <div class="Materialwarehouse">
<ul class="queryul"> <div style="text-align:right;border-bottom:1px solid #E2E4EB;padding-bottom:10px">
<li> <span class="pageTitle">物料仓库</span>
<span> <span @click="morequery=!morequery" style="display:inline-flex;align-items:center;cursor: pointer;" class="f12 cd6">高级查询
<em>仓库名称</em> <img v-show="!morequery" style="width:12px;height:12px" src="../../assets/img/more.png" alt="">
<img v-show="morequery" class="roatImg" style="width:12px;height:12px" src="../../assets/img/more.png" alt="">
</span> </span>
<el-input class="w200" size="small" v-model="msg.Name" placeholder="请输入"></el-input> <span @click="getList" style="margin-left:20px" class="chaxunSpan">查询</span>
<!-- <span @click="chongzhi" style="margin-left:20px" class="addSpan">重置</span> -->
<span @click="addSupplier" style="margin-left:20px" class="addSpan">
<img style="width:10px;height:10px;margin-right:6px" src="../../assets/img/add.png" alt="">
新增</span>
</div>
<ul v-show="morequery" class="queryul">
<li>
<el-input class="w200" size="small" v-model="msg.Name" placeholder="仓库名称"></el-input>
</li> </li>
<el-button @click="addSupplier" size="small" type="danger">新增</el-button>
<el-button @click="getList" size="small">查询</el-button>
</ul> </ul>
<vxe-table style="margin-top:20px" :data="tableData" :loading="loading" size="small"> <table style="margin-top:10px" class="myTable" v-loading="loading" border="0" cellspacing="0" cellpadding="0">
<vxe-table-column field="Name" title="仓库名称"></vxe-table-column> <thead>
<vxe-table-column field="UpdateBy" title="操作人"></vxe-table-column> <th>仓库名称</th>
<vxe-table-column field="UpdateDate" title="操作时间"></vxe-table-column> <th>操作人</th>
<vxe-table-column title="操作" width="120"> <th>操作时间</th>
<template v-slot="{ row, rowIndex }"> <th width="200">操作</th>
</thead>
<tbody>
<tr v-for="(item,index) in tableData" :key="index">
<td>
<span class="commonStyle hoverSpan1"></span>
{{item.Name}}
</td>
<td>{{item.UpdateBy}}</td>
<td>{{item.UpdateDate}}</td>
<td>
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="编辑" placement="top">
<i @click="Edit(row)" class="iconfont icon-xiugai"></i> <img @click="Edit(item)" style="width:24px;height:24px" src="../../assets/img/edit.png" alt="">
</el-tooltip> </el-tooltip>
<el-tooltip class="item" effect="dark" content="编辑" placement="top"> <el-tooltip class="item" effect="dark" content="删除" placement="top">
<i @click="Delete(row)" class="iconfont icon-shanchu"></i> <img @click="Delete(item)" style="width:24px;height:24px" src="../../assets/img/delete.png" alt="">
</el-tooltip> </el-tooltip>
</template> <span class="commonStyle hoverSpan2"></span>
</vxe-table-column> </td>
</vxe-table> </tr>
<vxe-pager <tr v-show="tableData.length==0">
:current-change="currentChange" <td colspan="12" align="center">暂无数据</td>
:current-page.sync="currentPage" </tr>
:page-size.sync="msg.pageSize" </tbody>
:total="total" </table>
align="center" <el-pagination
:layouts="['PrevJump', 'PrevPage', 'Jump', 'PageCount', 'NextPage', 'NextJump', 'Sizes', 'Total']"> @current-change="currentChange"
</vxe-pager> background
layout="prev, pager, next"
:total="total">
</el-pagination>
<el-dialog <el-dialog
:title="dialogtitle" :title="dialogtitle"
:visible.sync="dialogState" :visible.sync="dialogState"
width="30%"> width="20%">
<el-form :model="addMsg" :rules="rules" ref="addMsg" label-width="100px"> <el-form class="MyEditForm" :model="addMsg" :rules="rules" ref="addMsg" label-width="0">
<el-form-item label="仓库名称" prop="Name"> <el-form-item prop="Name" style="margin-left:60px;">
<span class="label">仓库名称</span>
<el-input v-model="addMsg.Name"></el-input> <el-input v-model="addMsg.Name"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <div class="btnformItem">
<el-button type="primary" @click="submitForm('addMsg')">确定</el-button> <span class="submitBtn" type="primary" @click="submitForm('addMsg')">确定</span>
<el-button @click="dialogState=false">取消</el-button> <span class="exitBtn" @click="dialogState=false">取消</span>
</el-form-item> </div>
</el-form> </el-form>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
name: 'Materialwarehouse', name: 'Materialwarehouse',
data(){ data(){
return{ return{
morequery:false,
currentPage:1, currentPage:1,
tableData: [], tableData: [],
loading:false, loading:false,
...@@ -173,5 +193,26 @@ export default { ...@@ -173,5 +193,26 @@ export default {
</script> </script>
<style scoped> <style scoped>
.Materialwarehouse .hoverSpan1{
left: -20px;
}
.Materialwarehouse .hoverSpan2{
right: -20px;
}
.Materialwarehouse .commonStyle{
height:100%;
background:#fff;
position: absolute;
width: 20px;
top:0;
display: none;
}
.Materialwarehouse{
background: #F8FAFB;
width: 100%;
min-height: 100%;
position: absolute;
padding: 20px 30px;
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