123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102 |
- <template>
- <div class='gcfz2'>
- <div class='table-2-input'>
- <el-date-picker size='small' v-model='dateVal' type='date' style='margin-right:12px;width:140px' placeholder='记录日期'></el-date-picker>
- <Select width='130' tipPlace='top' caption='楼层:' size='small' style='margin-right:12px' :selectdata='floorSelect' :placeholder='"请选择"'></Select>
- <el-input placeholder='请按照区域搜索' size='small' style='width:200px' prefix-icon='el-icon-search' v-model='searVal'></el-input>
- </div>
- <div class='table-2-table'>
- <el-table
- :header-cell-style='{background:"rgba(245,246,247,1)",fontFamily:"MicrosoftYaHei",color:"rgba(100,108,115,1)",lineHeight:"16px",fontSize:"12px"}'
- v-loading='loading'
- :data='bgjlTable'
- style='width: 100%'
- >
- <el-table-column label='序号' type='index' width='50'></el-table-column>
- <el-table-column prop label='楼层' width='130'>
- <template slot-scope='{row}'>{{row.floor||'--'}}</template>
- </el-table-column>
- <el-table-column prop label='库存变化' align='center'>
- <el-table-column prop label='新增(间)'>
- <template slot-scope='{row}'>{{row.xzkf||'--'}}</template>
- </el-table-column>
- <el-table-column prop label='减少(间)'>
- <template slot-scope='{row}'>{{row.jskf||'--'}}</template>
- </el-table-column>
- </el-table-column>
- <el-table-column prop label='区域(㎡)'>
- <template slot-scope='{row}'>{{row.region||'--'}}</template>
- </el-table-column>
- <el-table-column prop label='面积(㎡)'>
- <template slot-scope='{row}'>{{row.area||'--'}}</template>
- </el-table-column>
- <el-table-column prop label='调整后库房总数(间)' width='170'>
- <template slot-scope='{row}'>{{row.afterkf||'--'}}</template>
- </el-table-column>
- <el-table-column prop label='记录日期' width='130' :sortable='true'>
- <template slot-scope='{row}'>{{row.changedate||'--'}}</template>
- </el-table-column>
- </el-table>
- </div>
- <div class='table-2-p'>注:广场辅助用房使用信息变更时,需同步调整对应楼层辅助用房管理平面图</div>
- <div class='foot'>
- <el-pagination
- background
- layout='prev, pager, next'
- :total='total'
- :page-size='size'
- @prev-click='pageChanged'
- @next-click='pageChanged'
- @current-change='pageChanged'
- ></el-pagination>
- </div>
- </div>
- </template>
- <script>
- import Select from '@/components/Select/Select.vue'
- import { mapGetters } from 'vuex'
- export default {
- data() {
- return {
- dateVal: '',
- searVal: ''
- }
- },
- computed: {
- ...mapGetters(['floorSelect'])
- },
- props: ['bgjlTable', 'total', 'page', 'size', 'loading'],
- components: { Select },
- methods: {
- pageChanged(page) {
- this.page = page
- this.$emit('queryChange')
- }
- }
- }
- </script>
- <style lang="less" scoped>
- .gcfz2 {
- .table-2-input {
- display: flex;
- align-items: center;
- }
- .table-2-table {
- margin-top: 10px;
- }
- .table-2-p {
- height: 48px;
- font-size: 14px;
- font-family: MicrosoftYaHei;
- color: rgba(31, 36, 41, 1);
- line-height: 48px;
- }
- .foot {
- height: 32px;
- display: flex;
- justify-content: flex-end;
- margin-top: 28px;
- }
- }
- </style>
|