jf-frock/src/views/MountOrder/details.vue

<template>
    <div>
        <FullPage 
        title='安装详情'
        :list='list' 
        @init='init' 
        :logList='logList'
        :loading='loading'
        @searchData='init' 
        @changePage='changePage'
        @changeSize='changeSize'
        @selectTable='selectTable'
        :tableColums='tableColums'
        :tableData='tableData'
        :pageIndex='pageIndex'
        :total='total'
        >
            <div slot='titleButton'>
                <Button @click="back" type='primary' ghost style="margin-right:10px;">返回</Button>
                <Button @click="confirmSuccess(selects)" type="success" ghost style="margin-right:10px;" >批量完成</Button>
            </div>
            <template slot-scope="{ row }" slot="set">
                <a class="map-margin" v-if='row.sub_state!=3' @click="confirmSuccess(row)">完成</a>
                <!-- <span v-else>已完成</span> -->
            </template>
        </FullPage>
    </div>
</template>

<script>
import {mapActions} from 'vuex'
export default {
    data(){
        return {
            list:[
                {title:'楼幢',name:'Select',filterable:true,serverName:'house',placeholder:'请选择楼幢',value:'',
                    option:[
                       
                    ]
                },
                {title:'单元',name:'Select',filterable:true,serverName:'unit',placeholder:'请选择单元',value:'',
                    option:[
                        {label:1,value:1}
                    ]
                },
                {title:'楼层',name:'Select',filterable:true,serverName:'layer',placeholder:'请选择楼层',value:'',
                    option:[
                        {label:1,value:1}
                    ]
                },
                {title:'房间',name:'Select',filterable:true,serverName:'number_detail',placeholder:'请选择房间',value:'',
                    option:[
                        {label:1,value:1}
                    ]
                },
                {title:'产品',name:'Select',serverName:'product',placeholder:'请选择产品',value:'',
                    option:[]
                },
                 {title:'图号',name:'Select',serverName:'url_number',placeholder:'请选择图号',value:'',optionValue: 'url_number', optionName: 'url_number',
                    option:[]
                },
                {title:'部件',name:'Select',serverName:'parts',placeholder:'部件',value:'',optionValue: 'title', optionName: 'title',
                option:[]} ,
                {title:'出库时间',name:'Input',start_server:'start_time',end_server:'end_time',start_value:'',end_value:'',isDate:true,serverName:'id2',start_placeholder:'开始日期',end_placeholder:'结束日期'}
            ],
            logList:[],
            tableColums:[
                {type:'selection',align:'center',width:'100',fixed:'left'},
                // {title:'订单编号',align:'center',key:'order_no',minWidth:200},
                {title:'房号',align:'center',minWidth:100,key:'number_detail',
                    render:(h,params)=>{
                        const {row} = params
                        return h('span',`${row.house}-${row.unit}-${row.layer}-${row.number_detail}`)
                    }
                },
                {title:'产品名称',align:'center',minWidth:200,key:'product_title'},
                {title:'图号',align:'center',minWidth:200,key:'url_number'},
                {title:'部件名称',align:'center',minWidth:200,key:'part_title'},
                {title:'位置',align:'center',minWidth:200,key:'position'},
                {title:'零部件名称',align:'center',minWidth:200,key:'sub_part_title'},
                {title:'芯片编码',align:'center',minWidth:200,key:'tag'},
                {title:'是否完成',align:'center',minWidth:200,key:'sub_state',
                render:(h,params)=>{
                  const {row} = params
                  return h('span',row.sub_state==3?"已完成":"未完成")
                }},
                {title:'出库时间',align:'center',minWidth:200,key:'dispatch_time',
                    render:(h,params)=>h('span',{},this.func.replaceDate(params.row.dispatch_time))
                },
                {title:'运输开始时间',align:'center',minWidth:200,key:'transport_time',
                    render:(h,params)=>h('span',{},this.func.replaceDate(params.row.transport_time))
                },
                {title:'实际结束时间',align:'center',minWidth:200,key:'end_time',
                    render:(h,params)=>h('span',{},this.func.replaceDate(params.row.end_time))
                },
                {title:'实际运输时间',align:'center',minWidth:200,key:'at_time',
                    render:(h,params)=>h('span',{},this.func.replaceDate(params.row.transport_time))
                },
                {title:'操作',align:'center',width:'150',fixed:'right',slot:'set'},
            ],
            tableData:[],
            pageIndex:1,
            total:0,
            pageSize:10,
            loading:false,
            selects:[],
            selects_out:[],
            showStock:false,
            info:{
                user_id:'',
                work_type:2,
                order_in_no:'',
                start_time:'',
                end_time:'',
                user_salary:''
            },
            users:[],
            time:''
        }
    },
    created(){
        this.getOptions()
    },
    methods:{
        init(row){
            this.axios('/api/user').then(res=>this.users = res.data.data)
            this.pageIndex = 1
            row.page_index = this.pageIndex;
            row.page_size = this.pageSize;
            if(this.func.isType(row.house) == 'Array'){
                row.house = row.house.join(',')
            }
            if(this.func.isType(row.unit) == 'Array'){
                row.unit = row.unit.join(',')
            }
            if(this.func.isType(row.layer) == 'Array'){
                row.layer = row.layer.join(',')
            }
            if(this.func.isType(row.number_detail) == 'Array'){
                row.number_detail = row.number_detail.join(',')
            }
            if(this.func.isType(row.product) == 'Array'){
                row.product = row.product.join(',')
            }
            Object.assign(row,this.$route.query)
            this.proxyObj = row;
            this.getData(row)
        },
        getOptions(){
            this.axios('/api/orders_list_detail',{params:{order_no:this.$route.query.order_no,type:this.$route.query.type}})
            .then(res=>{
                res.data.house.map(v=>{v.value = v.house;v.label = v.house})
                res.data.unit.map(v=>{v.value = v.unit;v.label = v.unit})
                res.data.layer.map(v=>{v.value = v.layer;v.label = v.layer})
                res.data.number_detail.map(v=>{v.value = v.number;v.label = v.number})
                res.data.product_title.map(v=>{v.value=v.title,v.label=v.title})
                this.list[0].option = res.data.house;
                this.list[1].option = res.data.unit;
                this.list[2].option = res.data.layer;
                this.list[3].option = res.data.number_detail;
                this.list[4].option = res.data.product_title;
                this.list[5].option = res.data.url_number;
                this.list[6].option = res.data.part_title;
                   
            })
     
        },
        getData(row){
            this.loading = true;
            this.axios('/api/orders_list_detail',{params:row}).then(res=>{
                this.loading = false;
                this.tableData = res.data.data;
                this.logList = res.data.detail
                this.total = res.data.total||0;
            })
        },
        changePage(e){
            this.pageIndex = e;
            this.proxyObj.page_index = e;
            this.getData(this.proxyObj)
        },
        changeSize(e){
            this.pageSize = e;
            this.proxyObj.page_size = this.pageSize;
            this.getData(this.proxyObj)
        },
        back(){this.$router.go(-1)},
        selectTable(row){
            let result = [],outResult = [];
            row.map(v=>v.orders_procedure_id ? result.push(v.orders_procedure_id) : '')
            this.selects = result
            this.selects_out = outResult
        },
        confirmSuccess(row){
            let params = '';
            if(!row||row.length<1){return this.$Message.error('请至少选择一项')}
            params = Array.isArray(row) ? row.join(',') : row.orders_procedure_id
            this.confirmDelete({
                title:'确认完成么',
                content:'确认完成？',
                type:'primary',
                then:()=>{
                    this.axios.post('/api/orders_dispatch_confirm',{orders_procedure_id:params})
                    .then(res=>{
                        if(res.code == 200){
                            this.$Message.success(res.msg);
                            this.getData(this.proxyObj)
                        }
                    })
                },
                cancel:()=>{
                    this.$Message.warning('您取消了操作')
                }
            })
        },
    }
}
</script>

<style lang="scss" scoped>

</style>