Tmr-Multilingual/.svn/pristine/d2/d20c15ead33b9dc4ddb069897d0622dc13d0f458.svn-base

<template>
  <div class="app-container">
    <el-tabs v-model="activeName" @tab-click="handleTabClick">
      <el-tab-pane label="库存统计" name="first">
        <div class="search">
          <el-date-picker v-model="tab.table.getdataListParm.parammaps.inputDatetime" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="float: left;width: 250px;margin-bottom:10px;" />
          <el-input v-model="tab.table.getdataListParm.parammaps.source" style="float: left;width: 245px;margin-bottom:10px;" placeholder="配方名称" />
          <el-button class="successBorder" style="float: left;margin-left: 10px;margin-bottom:10px;" @click="handleSearch">查询</el-button>
          <el-button class="export" style="float: right;margin-right: 10px;margin-bottom:10px;" @click="handleExport">导出</el-button>
        </div>
        <div class="table">
          <el-table
            :key="tab.table.tableKey"
            v-loading="tab.table.listLoading"
            element-loading-text="给我一点时间"
            :data="tab.table.list"
            border
            fit
            highlight-current-row
            style="width: 100%;"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
          >
            <el-table-column label="饲料名称" min-width="130px" align="center">
              <template slot-scope="scope">
                <span>{{ scope.row.bigcowclass }}</span>
              </template>
            </el-table-column>
            <el-table-column label="期初" min-width="130px" align="center">
              <el-table-column prop="bigcowclass" align="center" label="期初库存（kg）" min-width="120" />
              <el-table-column prop="bigcowclass" align="center" label="期初金额（元）" min-width="120" />
            </el-table-column>
            <el-table-column label="用量" min-width="110px" align="center">
              <el-table-column prop="bigcowclass" align="center" label="入库重量（kg）" min-width="120" />
              <el-table-column prop="bigcowclass" align="center" label="系统出库重量（kg）" min-width="120" />
              <el-table-column prop="bigcowclass" align="center" label="人工用料重量（kg）" min-width="120" />
              <el-table-column prop="bigcowclass" align="center" label="损耗重量（kg）" min-width="120" />
            </el-table-column>
            <el-table-column label="期末" min-width="130px" align="center">
              <el-table-column prop="bigcowclass" align="center" label="期末库存（kg）" min-width="120" />
              <el-table-column prop="bigcowclass" align="center" label="期末金额（元）" min-width="120" />
            </el-table-column>
          </el-table>
          <pagination v-show="tab.table.total>=0" :total="tab.table.total" :page.sync="tab.table.getdataListParm.offset" :limit.sync="tab.table.getdataListParm.pagecount" @pagination="getTabList" />
        </div>
      </el-tab-pane>
      <el-tab-pane label="用料分析" name="second">
        <div class="search">
          <el-date-picker v-model="tab2.table.getdataListParm.parammaps.inputDatetime" class="inputDatetime" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" style="width: 250px;" />
          <span style="margin-left: 10px;">统计类型：</span>
          <el-radio v-model="tab2.radio" label="1" @change="changeRadio2">牲畜类别</el-radio>
          <el-radio v-model="tab2.radio" label="2" @change="changeRadio2">栏舍名称</el-radio>
          <el-radio v-model="tab2.radio" label="3" @change="changeRadio2">日期</el-radio>
          <el-radio v-model="tab2.radio" label="4" @change="changeRadio2">TMR设备编号</el-radio>
          <el-radio v-model="tab2.radio" label="5" @change="changeRadio2">班次</el-radio>
          <el-radio v-model="tab2.radio" label="6" @change="changeRadio2">车次</el-radio>
          <el-input v-model="tab2.table.getdataListParm.parammaps.source" style="width: 245px;" placeholder="栏舍名称" />
          <el-button class="successBorder" @click="handleSearch">查询</el-button>
        </div>
        <el-table :data="tab2.table.list" max-height="420">
          <el-table-column v-for="item in tab2.table.tableConfig" :key="item.id" align="center" :label="item.label" :prop="item.prop" :width="item.width">
            <el-table-column v-for="item1 in item.children" v-if="item.children || item.children.length>0" :key="item1.id" align="center" :label="item1.label" :prop="item1.prop" :width="item1.width">
              <el-table-column v-for="item2 in item1.children" v-if="item1.children || item1.children.length>0" :key="item2.id" :label="item2.label" :prop="item2.prop" :width="item2.width" />
            </el-table-column>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="价格分析" name="third">价格分析</el-tab-pane>
    </el-tabs>
  </div>
  </div>

</template>

<script>
import { GetDataByName } from '@/api/common'
import Cookies from 'js-cookie'
import { parseTime } from '@/utils/index.js'
import Pagination from '@/components/Pagination'
export default {
  name: 'InventoryManagement',
  components: { Pagination },
  data() {
    return {
      fileComment: [{ 'label': '商务文件评分', 'children': [{ 'label': '1' }, { 'label': '2' }, { 'label': '管理员' }] }],
      activeName: 'first',
      tab: {
        table: {
          getdataListParm: {
            name: 'getBarmilkList',
            page: 1,
            offset: 1,
            pagecount: 10,
            returntype: 'Map',
            parammaps: {
              pastureid: Cookies.get('pastureid'),
              startTime: '',
              stopTime: '',
              inputDatetime: ''
            }
          },
          tableKey: 1,
          list: [],
          total: 0,
          listLoading: true
        }
      },

      tab2: {
        table: {
          getdataListParm: {
            name: 'getBarmilkList',
            page: 1,
            offset: 1,
            pagecount: 10,
            returntype: 'Map',
            parammaps: {
              pastureid: Cookies.get('pastureid'),
              startTime: '',
              stopTime: '',
              inputDatetime: ''
            }
          },
          tableKey: 1,
          list: [],
          tableConfig: [],
          total: 0,
          listLoading: true
        },
        radio: '1'
      },
      rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
      cellStyle: { padding: 0 + 'px' }

    }
  },

  created() {
    this.getTabList()
    this.getTab2List()
  },

  methods: {
    handleTabClick() {

    },
    getTabList() {
      this.tab.table.listLoading = true
      GetDataByName(this.tab.table.getdataListParm).then(response => {
        console.log('库存统计table数据', response.data.list)
        if (response.data.list !== null) {
          this.tab.table.list = response.data.list
          this.tab.table.total = response.data.total
        } else {
          this.tab.table.list = []
        }
        setTimeout(() => {
          this.tab.table.listLoading = false
        }, 100)
      })
    },
    handleSearch() {},
    handleExport() {},

    getTab2List() {
      this.tab2.table.listLoading = true
      GetDataByName(this.tab2.table.getdataListParm).then(response => {
        console.log('库存统计table数据', response.data.list)
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '栏舍名称/饲料参数', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
        // if (response.data.list !== null) {
        //   this.tab2.table.list = response.data.list
        //   this.tab2.table.total = response.data.total
        // } else {
        //   this.tab2.table.list = []
        // }
        setTimeout(() => {
          this.tab2.table.listLoading = false
        }, 100)
      })
    },
    changeRadio2() {
      console.log(this.tab.radio)
      if (this.tab.radio == '1') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '牲畜类别', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      } else if (this.tab.radio == '2') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '栏舍名称', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      } else if (this.tab.radio == '3') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '日期', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      } else if (this.tab.radio == '4') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: 'TMR设备编号', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      } else if (this.tab.radio == '5') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '班次', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      } else if (this.tab.radio == '6') {
        this.tab2.table.list = [
          {
            'districtName': 10, 'timeDimension1': '00001', 'timeDimension2': '00002', 'timeDimension3': '00003', 'timeDimension4': '00004'
        	}, {
            'districtName': 11, 'timeDimension1': '11111', 'timeDimension2': '11112', 'timeDimension3': '11113', 'timeDimension4': '11114'
        	}, {
            'districtName': 12, 'timeDimension1': '22221', 'timeDimension2': '22222', 'timeDimension3': '22223', 'timeDimension4': '22224'
          }, {
            'districtName': 13, 'timeDimension1': '33331', 'timeDimension2': '33332', 'timeDimension3': '33333', 'timeDimension4': '33334'
          }
        ],
        this.tab2.table.tableConfig = [{
        	id: 90, label: '饲料名称', prop: '', width: '',
        	children: [{ id: 91, label: '车次', prop: 'districtName', width: '' }]
        }, {
        	id: 100, label: '饲料01', prop: '', width: '',
        	children: [
            { id: 101, label: '理论', prop: 'timeDimension1', width: '' },
            { id: 102, label: '实际', prop: 'timeDimension2', width: '' },
            { id: 103, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 104, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }, {
        	id: 110, label: '饲料02', prop: '', width: '',
        	children: [
            { id: 111, label: '理论', prop: 'timeDimension3', width: '' },
            { id: 112, label: '实际', prop: 'timeDimension4', width: '' },
            { id: 113, label: '误差值', prop: 'timeDimension2', width: '' },
            { id: 114, label: '误差率', prop: 'timeDimension2', width: '' }
          ]
        }]
      }
    }

  }
}
</script>
<style lang="scss" scoped>
  .search{margin-bottom:10px;}
</style>