|
@@ -0,0 +1,370 @@
|
|
|
+<template>
|
|
|
+ <div class="SippliersList">
|
|
|
+ <Toptitle title="用友物料列表">
|
|
|
+ <Button type="primary" @click="handleOnceTogether">一键同步</Button>
|
|
|
+ </Toptitle>
|
|
|
+ <div class="content">
|
|
|
+ <div class="content_left">
|
|
|
+ <!-- <div :class="item.is_select?'is_select':''" v-for="(item,index) in materialList" :key="index" @click="handleSelect(item,index)">{{item.title}}</div> -->
|
|
|
+ <Tree :data="treeData" @on-select-change='handleSelect'></Tree>
|
|
|
+ </div>
|
|
|
+ <div class="content_right">
|
|
|
+ <div class="content_right_topform">
|
|
|
+ <Form :label-width="90" :model="searchData">
|
|
|
+ <FormItem label="存货编码:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ v-model="searchData.code"
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="存货编码"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="存货名称:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ v-model="searchData.title"
|
|
|
+ clearable
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="存货名称"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="存货简称:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ v-model="searchData.abbreviation_title"
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="存货简称"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+
|
|
|
+ <FormItem label="物料分类:">
|
|
|
+ <Select
|
|
|
+ v-model="searchData.type_id"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ label-in-value
|
|
|
+ style="width: 150px"
|
|
|
+ >
|
|
|
+ <Option
|
|
|
+ v-for="item in materialList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.title"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ </Option>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="品牌:">
|
|
|
+ <Select
|
|
|
+ v-model="searchData.brand_id"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ style="width: 150px"
|
|
|
+ >
|
|
|
+ <Option v-for="item in brandList" :key="item.id" :label='item.title' :value="item.id"/>
|
|
|
+ </Select>
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="高:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ v-model="searchData.long"
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="高"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="宽:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ v-model="searchData.width"
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="宽"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+ <FormItem label="厚:">
|
|
|
+ <Input
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
+ clearable
|
|
|
+ v-model="searchData.high"
|
|
|
+ style="width: 150px"
|
|
|
+ placeholder="厚"
|
|
|
+ />
|
|
|
+ </FormItem>
|
|
|
+ <FormItem :label-width='30'>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="handleSearch"
|
|
|
+ style="margin-right: 10px"
|
|
|
+ >搜索</Button
|
|
|
+ >
|
|
|
+ </FormItem>
|
|
|
+ </Form>
|
|
|
+ <div class="content_right_topfrom_btn"></div>
|
|
|
+ </div>
|
|
|
+ <div class="content_right_content">
|
|
|
+ <div class="content_right_content_table">
|
|
|
+ <Table
|
|
|
+ :columns="tableColumns"
|
|
|
+ border
|
|
|
+ :loading="tableLoading"
|
|
|
+ :data="tableData"
|
|
|
+ max-height='450'
|
|
|
+ >
|
|
|
+ <template slot="image" slot-scope="{row}">
|
|
|
+ <img :src="$store.state.ip+row.img_url" v-show="row.img_url">
|
|
|
+ </template>
|
|
|
+ </Table>
|
|
|
+ <div class="content_right_content_page">
|
|
|
+ <Page
|
|
|
+ :page-size-opts="[10, 20, 30, 40, 100,1000]"
|
|
|
+ @on-page-size-change="changeSize"
|
|
|
+ @on-change="changePage"
|
|
|
+ :current="pageIndex"
|
|
|
+ show-total
|
|
|
+ show-elevator
|
|
|
+ :total="total"
|
|
|
+ show-sizer
|
|
|
+ :page-size="pageSize"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// 这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
|
|
|
+// 例如:import 《组件名称》 from '《组件路径》';
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "SippliersList",
|
|
|
+ components: {},
|
|
|
+ props: {},
|
|
|
+ // import引入的组件需要注入到对象中才能使用
|
|
|
+ data() {
|
|
|
+ // 这里存放数据
|
|
|
+ return {
|
|
|
+ treeData:[],
|
|
|
+ selectID:null,
|
|
|
+ proxyData:{},
|
|
|
+ materialList:[],
|
|
|
+ brandList:[],
|
|
|
+ tableColumns: [
|
|
|
+ { title: "存货分类", key: "type_title", align: "center", resizable: true,width: 130,fixed:'left' },
|
|
|
+ { title: "存货编码", key: "code", align: "center", resizable: true,width: 130,fixed:'left' },
|
|
|
+ { title: "存货名称", key: "title", align: "center",resizable: true,width: 200,fixed:'left' },
|
|
|
+ { title: "存货简称", key: "abbreviation_title", align: "center",resizable: true,width: 130 },
|
|
|
+ { title: "存货代码", key: "codes", align: "center",resizable: true,width: 130 }, { title: "存货助记码", key: "material_help_code", align: "center", resizable: true,minWidth: 200 },
|
|
|
+ { title: "品牌", key: "brand_title", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "规格型号", key: "measure", align: "center", resizable: true,width: 100,render:(h,params)=>{
|
|
|
+ const {row}=params;
|
|
|
+ return h('span',{},`${row.long}*${row.width}*${row.high}`)
|
|
|
+ } }, { title: "计量单位", key: "unit", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "高", key: "long", align: "center",resizable: true,width: 130 },
|
|
|
+ { title: "宽", key: "width", align: "center",resizable: true,width: 130 },
|
|
|
+ { title: "厚", key: "high", align: "center",resizable: true,width: 130},
|
|
|
+ { title: "主要供应商名称", key: "supply_title", align: "center", resizable: true,width: 200 },
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ { title: "默认税率", key: "fax", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "参考成本", key: "reference_cost", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "最新成本", key: "prime_cost", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "启用日期", key: "start_time", align: "center", resizable: true,width: 200 },
|
|
|
+ { title: "停用日期", key: "end_time", align: "center", resizable: true,minWidth: 200 },
|
|
|
+ { title: "最高库存", key: "top_number", align: "center",resizable: true,width: 130},
|
|
|
+ { title: "安全库存", key: "warning_number", align: "center",resizable: true,width: 130 },
|
|
|
+ { title: "附件", key: "", align: "center", resizable: true,width: 200,slot:'image'},
|
|
|
+ ],
|
|
|
+ tableData: [],
|
|
|
+ tableLoading: false,
|
|
|
+ pageIndex: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 0,
|
|
|
+ searchData: {
|
|
|
+ code:'',
|
|
|
+ title:'',
|
|
|
+ abbreviation_title:'',
|
|
|
+ type_id:'',
|
|
|
+ brand_id:'',
|
|
|
+ long:'',
|
|
|
+ high:'',
|
|
|
+ width:''
|
|
|
+ }
|
|
|
+ };
|
|
|
+ },
|
|
|
+ // 生命周期 - 创建完成(可以访问当前this实例)
|
|
|
+ created() {
|
|
|
+ //获取物料层级
|
|
|
+ this.axios.post('/api/yy_material_type_list').then(res=>{
|
|
|
+ this.treeData = res.data;
|
|
|
+ })
|
|
|
+ //获取品牌
|
|
|
+ this.axios.get('/api/brand_list').then(res=>{
|
|
|
+ this.brandList = res.data.data;
|
|
|
+ })
|
|
|
+ //获取物料分类
|
|
|
+ this.axios.get('/api/basics_material_index').then(res=>{
|
|
|
+ this.materialList = res.data.data;
|
|
|
+ this.materialList.forEach(v=>{
|
|
|
+ v.is_select = false;
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 生命周期 - 挂载完成(可以访问DOM元素)
|
|
|
+ mounted() {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleSearch(){
|
|
|
+ this.proxyData = JSON.parse(JSON.stringify(this.searchData));
|
|
|
+ this.pageIndex=1;
|
|
|
+ this.initData(this.proxyData,this.selectID);
|
|
|
+ },
|
|
|
+ handleSelect(e){
|
|
|
+ this.pageIndex = 1;
|
|
|
+ this.selectID = e[0].ids;
|
|
|
+ this.initData(this.proxyData,e[0].ids);
|
|
|
+
|
|
|
+ },
|
|
|
+ handleOnceTogether(){
|
|
|
+ this.axios.get('/api/change_data').then(res=>{
|
|
|
+ if(res.code==200){
|
|
|
+ this.$Message.success(res.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ initData(row,type_id) {
|
|
|
+ this.tableLoading = true;
|
|
|
+ this.axios({
|
|
|
+ method: "post",
|
|
|
+ url: "/api/yy_material_list",
|
|
|
+ data: {
|
|
|
+ ...row,
|
|
|
+ type_id,
|
|
|
+ page_index: this.pageIndex,
|
|
|
+ page_size: this.pageSize,
|
|
|
+ },
|
|
|
+ }).then((res) => {
|
|
|
+ this.tableLoading = false;
|
|
|
+ this.total = res.data.total;
|
|
|
+ this.tableData = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ remove(root, node, data) {
|
|
|
+ if (node.children && node.children.length > 0) {
|
|
|
+ this.$Message.error("有子集时不可删除");
|
|
|
+ } else {
|
|
|
+ const parentKey = root.find((el) => el === node).parent;
|
|
|
+ const parent = root.find((el) => el.nodeKey === parentKey).node;
|
|
|
+ const index = parent.children.indexOf(data);
|
|
|
+ parent.children.splice(index, 1);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeSize(e) {
|
|
|
+ this.pageSize = e;
|
|
|
+ this.pageIndex = 1;
|
|
|
+ this.initData(this.proxyData,this.selectID);
|
|
|
+ },
|
|
|
+ changePage(e) {
|
|
|
+ this.pageIndex = e;
|
|
|
+ this.initData(this.proxyData,this.selectID);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ // 监听属性 类似于data概念
|
|
|
+ computed: {},
|
|
|
+ // 监控data中的数据变化
|
|
|
+ watch: {},
|
|
|
+ beforeCreate() {}, // 生命周期 - 创建之前
|
|
|
+ beforeMount() {}, // 生命周期 - 挂载之前
|
|
|
+ beforeUpdate() {}, // 生命周期 - 更新之前
|
|
|
+ updated() {}, // 生命周期 - 更新之后
|
|
|
+ beforeDestroy() {}, // 生命周期 - 销毁之前
|
|
|
+ destroyed() {}, // 生命周期 - 销毁完成
|
|
|
+ activated() {}, // 如果页面有keep-alive缓存功能,这个函数会触发
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang='scss' scoped>
|
|
|
+.is_select{
|
|
|
+ background-color: #2d8cf0;
|
|
|
+ border: 1px solid #2d8cf0!important;
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+.content {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding-top: 30px;
|
|
|
+ .content_left {
|
|
|
+ width: 10%;
|
|
|
+ height: 70vh;
|
|
|
+ border-right: 1px solid #515a6e;
|
|
|
+ overflow: auto;
|
|
|
+ // div{
|
|
|
+ // width: 90%;
|
|
|
+ // border-radius: 4px;
|
|
|
+ // box-shadow: 2px 2px 2px #969daf;
|
|
|
+ // font-size:16px;
|
|
|
+ // text-align: center;
|
|
|
+ // margin-top: 10px;
|
|
|
+ // border: 1px solid #8f9296;
|
|
|
+ // cursor: pointer;
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ .content_right {
|
|
|
+ width: 88%;
|
|
|
+ .content_right_topform {
|
|
|
+ /deep/.ivu-form {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ }
|
|
|
+ /deep/.ivu-form-item {
|
|
|
+ display: inline-block;
|
|
|
+ width: 250px;
|
|
|
+ }
|
|
|
+ .content_right_topfrom_btn {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .content_right_content {
|
|
|
+ border-top: 1px solid #f4f4f4;
|
|
|
+ // margin-top: 20px;
|
|
|
+ padding-top: 20px;
|
|
|
+ .content_right_content_btn {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+ .content_right_content_table {
|
|
|
+ }
|
|
|
+ .content_right_content_page {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ padding-top: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.demo-tree-render {
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+/deep/ .ivu-table-fixed-body{
|
|
|
+ height: auto!important;;
|
|
|
+ }
|
|
|
+</style>
|