lshcomment 1.0.0

package/src/components/record/order-history.vue

@@ -0,0 +1,257 @@
+<template>
+    <div class="container-fluid bg-box">
+        <b-row>
+            <span class="title-large">进厂历史记录</span>
+        </b-row>
+        <b-row>
+            <span class="title-small mt-1">服务记录</span>
+        </b-row>
+        <b-row class="title-line"></b-row>
+        <b-row class="mt-3" v-for="(item, index) in listData" :key="index">
+            <b-col md="1">
+                <div class="appot-img"  v-if="item.isBookOrder === 0"></div>
+                <div class="appot-img2" v-else></div>
+            </b-col>
+            <b-col md="10">
+                <div>
+                    <span class="list-title">{{item.businessTypeName}}</span>
+                    <span class="list-title-second ml-3">里程数：{{item.currentMileage}}km</span>
+                </div>
+            
+                <div class="content-box">
+                    <div class="clearfix mt-1">
+                        <span class="pull-left">NO: {{item.historyOrderNo}}</span>
+                        <span class="pull-right">{{item.storeName}}</span>
+                    </div>
+                    <div class="clearfix mt-1">
+                        <span class="pull-left">销售人: {{item.salesEmpName}}</span>
+                    </div>
+                    <div class="clearfix mt-1">
+                        <span>{{item.custPlates}}</span>
+                        <span class="ml-3" :title="item.carDisplayName">{{item.carDisplayName | substrShow(16)}}</span>
+                    </div>
+                    <div class="clearfix">
+                        <span class="mult_line_ellipsis">{{item.serviceName}}</span>
+                    </div>
+                    <div class="title-line" v-show="!!item.serviceName"></div>
+                    <div class="clearfix mt-1">
+                        <span v-show="item.isBookOrder === 0">￥{{parseFloat(item.bookOrderPrice)? parseFloat(item.bookOrderPrice).toFixed(2) : '0.00'}}</span>
+                        <span v-show="item.isBookOrder === 1">{{item.bookOrderPrice}}</span>
+                         <span class="ml-3 text-danger" v-if="item.isCancel === 1">
+                             【废单】
+                         </span>
+                         <span v-else>
+                            <span class="ml-3 text-danger" v-show="item.isBookOrder === 0">{{item.orderStatus | orderStatusFliter}}</span>
+                            <span class="ml-3 text-danger" v-show="item.isBookOrder === 1">{{item.bookOrderStatus | bookOrderStatusFliter}}</span>
+                         </span>
+                        
+                    </div>
+                </div>
+            </b-col>
+        </b-row>
+    </div>
+</template>
+<script>
+import api from 'common/api'
+import common from 'common/common'
+import collectionApi from 'common/api-collection.js'
+
+export default {
+    props: {
+        // 正式车牌
+        custPlates: {
+            type: String,
+            default:''
+        },
+        // 临时车牌
+        plateNumberTmp: {
+            type: String,
+            default:''
+        },
+        // 加载历史记录条数
+        listNumes: {
+            type: Number,
+            default: 15
+        },
+    },
+    data() {
+        return {
+            listData: [],
+            serviceList: [],
+        }
+    },
+    mounted() {
+        this.getData();
+    },
+    methods:{
+        // 获取历史记录列表
+        getDataList() {
+            if((!this.custPlates) && !this.plateNumberTmp) {
+                return new Promise((reslove, reject) => {
+                    reslove(this.listData);
+                })
+            }
+            let param = {
+                custPlates: this.custPlates,
+                pageStart: 1,
+                pageNums: this.listNumes
+            }
+            if(this.custPlates) {
+                param.custPlates = this.custPlates;
+            }else if(this.plateNumberTmp){
+                param.plateNumberTmp = this.plateNumberTmp;
+            }
+            return new Promise((reslove, reject) => {
+                api.appointment.queryBookOrderHistoryList(param,res => {
+                    if(res.data.code === 'success') {
+                        this.listData = res.data.obj.list;
+                        reslove(this.listData)
+                    };
+                })
+            })
+
+        },
+        getData() {
+            this.getDataList().then(res => {
+                if(this.listData.length == 0) return;
+                let param =[];
+                for(let [i, item] of this.listData.entries()) {
+                    param.push({
+                        historyOrderNo: item.historyOrderNo,
+                        isBookOrder: item.isBookOrder,
+                    });
+                }
+                // 获取历史记录列表中的服务信息
+                api.appointment.queryBookOrderDetailListNoPage(param, result => {
+                    if(result.data.code === 'success') {
+                        for(let [key, val] of Object.entries(result.data.obj)) {
+                            let str = '';
+                            for(let [i, item] of val.entries()) {
+                                str += item.serviceName + ','
+                            }
+                            for(let [i, item] of this.listData.entries()) {
+                               if(item.historyOrderNo == key) {
+                                   this.listData[i].serviceName = str.substr(0, str.length-1);
+                                   break;
+                               }
+                            }
+                        };
+                        this.listData = JSON.parse(JSON.stringify(this.listData));
+                        this.$emit('lengthChange', this.listData.length);
+                    };
+                })
+            })
+        },
+        // 预览
+        previewOrder(val) {
+            this.getData();
+            if(val.isBookOrder === 0) {
+                common.printPreview(common.isdev() + collectionApi.repairOrder.print, {
+                    name: 'orderNo',
+                    value: val.historyOrderNo
+                })
+            }else {
+                common.printPreview(common.isdev() + collectionApi.appointment.generatePdfReportBookOrderInfo, {
+                    name: 'bookOrderNo',
+                    value: val.historyOrderNo
+                })
+            }
+        },
+        getDataLength() {
+            return this.listData.length;
+        },
+    },
+    watch: {
+        custPlates(val) {
+            this.getData();
+        },
+        plateNumberTmp(val) {
+            this.getData();
+        }
+    },
+    filters:{
+        orderStatusFliter(val) {
+            if(val === 0){
+                return '【待处理】';
+            }else if(val === 1){
+                return '【处理中】';
+            }else if(val === 9){
+                return '【待结算】';
+            }else if(val === 10){
+                return '【已结算】';
+            }
+        },
+        bookOrderStatusFliter(val) {
+          if(val === 0){
+              return '【待确认】';
+          }else if(val === 1){
+              return '【已确认】';
+          }
+       },
+       substrShow(val, len) {
+            let str
+            if(val && val.length > len) {
+                    str = val.substr(0, len) + '...';
+            }else{
+                    str = val;
+            }
+            return str
+       },
+    }
+}
+</script>
+<style scoped>
+.bg-box{
+    background: #fff;
+}
+.title-large{
+    font-size: 14px;
+    color: #48576A;
+    font-weight: 700;
+}
+.title-small{
+    font-size: 12px;
+    color: #48576A;
+}
+.title-line{
+    width: 100%;
+    border-top: 1px solid #c2cfd6;
+    margin-top: 6px;
+    margin-bottom: 6px;
+}
+.appot-img{
+    width: 18px;
+    height: 24px;
+    background-image: url(../../../static/image/appoitment3.png)
+}
+.appot-img2{
+    width: 18px;
+    height: 24px;
+    background-image: url(../../../static/image/appoitment4.png)
+}
+.list-title{
+    font-size: 14px;
+    color: #587EB9;
+}
+.list-title-second{
+    font-size: 14px;
+    color: #8897A2;
+}
+.content-box{
+    width: 100%;
+    background: #F5F8FC;
+    border-radius: 3px;
+    padding: 8px;
+}
+.mult_line_ellipsis{
+    width:100%;
+    overflow: hidden;
+    text-overflow:ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 3;
+    -webkit-box-orient: vertical;
+    color: #48576A;
+}
+</style>
+
+

package/src/components/select-car-extend-prop/select-car-extend-prop.vue

@@ -0,0 +1,265 @@
+<template>
+<div>
+    <car-info
+    	:star="star"
+        @callBack="getCarInfo" 
+        ref="carInfo"
+        @validete='validete' 
+        :validateLen = 'validateLen'
+        :showLength='showLength'
+        :isDisabled="disabled" >
+    </car-info>
+    <!-- v-show="carInfo.iotypeCode" -->
+<!--    <div v-show="carInfo.displayName">
+        <el-tabs v-model="activeCode" type="card" @tab-click="tabClick" >
+            <el-tab-pane :disabled="disabled" v-for="item in extendProps" :label="item.text" :key="item.value" :name="item.value">
+                <div class="extend-sub-prop" v-for="(ele, i) in subPropList" :key="i" @click="selectSubProp(ele)">
+                    {{ ele }}
+                </div>
+                <p v-show="!subPropList.length">暂无数据</p>
+            </el-tab-pane>
+        </el-tabs>
+        
+        <hr>
+        <p>已选扩展属性</p>
+        <hr>
+
+        <div class="manhour_borderBottom" v-for="(item, i) in selectedList" :key='i'>
+            {{ `【${item.propName}】 ：` }}
+            <span v-for="(ele, index) in item.selectedProps" :key="index">
+                {{ ele }}  
+                <i class="el-icon-circle-cross" @click="removeSubProp(ele, i)" style="marginLeft: 6px; marginRight: 6px; cursor: pointer;"></i>
+            </span>
+        </div>
+    </div>-->
+</div>
+</template>
+<script>
+
+import CarInfo from  'components/iris-carinfo'
+   
+import Vue from 'vue'
+import { Tabs, TabPane } from 'element-ui'
+Vue.use(Tabs)
+Vue.use(TabPane)
+
+import { getType } from 'common/api-common'
+import { MAIN_MODEL_ADD } from 'common/ref-code'
+import api from 'common/api'
+
+export default {
+    components: {
+        CarInfo,
+    },
+    props: {
+        disabled: {
+            type: Boolean,
+            default: false
+        },
+        star:{
+        	type: Boolean,
+            default: true
+        },
+        validateLen:{
+        	type:Number,
+			default: 6
+        },
+        showLength:{
+        	type:Number,
+			default: 5
+        },
+    },
+    data() {
+        return {
+            carInfo: {},
+            extendProps: [],
+            subPropList: [],
+            activeCode: 'second',
+            saveList: [],
+            selectedList: [],
+        }
+    },
+    computed: {
+        addInfoMap() {
+            let info = {}
+            for(let i = 0; i < this.selectedList.length; i ++) {
+                info[this.selectedList[i].propCode] = []
+                for(let j = 0; j < this.selectedList[i].selectedProps.length; j ++) {
+                    info[this.selectedList[i].propCode].push(this.selectedList[i].selectedProps[j])
+                }
+            }
+            return info
+        },
+    },
+    created() {
+        this.getExtendProps()
+    },
+    methods: {
+        requireCheck() {
+            this.$refs.carInfo.validate()
+        },
+    	clearInfo(){
+    		this.$refs.carInfo.clear()
+    	},
+    	validete(val) {
+            // this.requireCheck()
+    	 	this.$emit('validete',val)
+        },
+    	setStatus(){
+    		this.$refs.carInfo.validate();
+    	},
+        setValue(carInfo, extendProps) {
+            this.$nextTick(() => {
+                this.$refs.carInfo.setValue({
+                    factoryCode: carInfo.factoryCode,
+                    brandCode: carInfo.brandCode,
+                    seriesCode: carInfo.seriesCode,
+                    modelCode: carInfo.modelCode,
+                    opvCode: carInfo.opvCode,
+                    ioTypeCode: carInfo.iotypeCode,
+                    displayName: carInfo.displayName
+                })
+                this.selectedList = [...extendProps]
+            })
+        },
+        reset() {
+            this.$nextTick(() => {
+                this.$refs.carInfo.setValue({
+                    factoryCode: '',
+                    brandCode: '',
+                    seriesCode: '',
+                    modelCode: '',
+                    opvCode: '',
+                    ioTypeCode: '',
+                    displayName: '',
+                }, false)
+                this.$refs.carInfo.clearValue()
+                this.carInfo = {}
+                this.selectedList = []
+            })
+        },
+        tabClick() {
+            this.querySubPropList(list => {
+                this.saveList = list
+            })
+        },
+        selectSubProp(item) {
+            // this.isRemove = false
+            let obj = {
+                propName: this.findActiveName(this.activeCode),
+                propCode: this.activeCode,
+                selectedProps: []
+            }
+            obj.selectedProps.push(item)
+            let codeList = new Set([])
+            if(this.selectedList.length) {
+                this.selectedList.forEach(item => {
+                    codeList.add(item.propCode)
+                })
+            }
+            if(!codeList.has(this.activeCode) || !this.selectedList.length) {
+                this.selectedList.push(obj)
+            }else if(codeList.has(this.activeCode)) {
+                for(let i = 0; i < this.selectedList.length; i ++) {
+                    if(this.selectedList[i].propCode === this.activeCode
+                        && this.selectedList[i].selectedProps.indexOf(item) === -1) {
+                            this.selectedList[i].selectedProps.splice(0, 1)                            
+                            this.selectedList[i].selectedProps.push(item)
+                    }
+                }
+            }
+        },
+        removeSubProp(ele, i) {
+            if(this.disabled) {
+                return
+            }
+            this.selectedList.splice(i, this.selectedList.length-i)
+        },
+        getCarInfo(data) {
+            this.carInfo = {
+                factoryCode: data.factoryCode,
+                brandCode: data.brandCode,
+                seriesCode: data.seriesCode,
+                modelCode: data.modelCode,
+                // opvCode: data.opvCode,
+                // iotypeCode: data.ioTypeCode,
+                displayName: data.displayName
+            }
+            this.$emit('getCarExtendInfo', this.carInfo, this.selectedList)
+            this.subPropList = []
+            // this.selectedList = []   不能再这里清空会导致页面初始化扩展属性被清空
+        },
+        getExtendProps() {
+            getType(MAIN_MODEL_ADD, items => {
+                this.extendProps = []
+                items.forEach(item => {
+                    let data = {
+                        text: item.refDetailName,
+                        value: item.refDetailCode
+                    }
+                    this.extendProps.push(data)
+                })
+            })
+        },
+        querySubPropList(next = () => {}) {
+            let params = JSON.parse(JSON.stringify(this.carInfo))
+            params.addCode = this.activeCode
+            // params.addInfoMap = this.addInfoMap
+                
+            this.subPropList = []
+            api.skuCar.getCarAdd(params, res => {
+                if(res.data.code === 'success') {
+                    let list = res.data.obj
+                    next(list)
+                    // 后端会根据前端删除逻辑过滤并返回最新的关系池, 前端始终以最新的关系池为准
+                    // this.lastRelationList = list
+                    let arr = []
+                    list.forEach(item => {
+                        arr.push(item.addValue)
+                    })
+                    for(let item of new Set(arr).values()) {
+                        this.subPropList.push(item)
+                    }
+                }
+            })
+        },
+        findActiveName(activeCode, list = this.extendProps) {
+            let text = ''
+            list.forEach(item => {
+                if(activeCode === item.value) {
+                    text = item.text
+                }
+            })
+            return text
+        },
+    },
+    watch: {
+        selectedList: {
+            handler(val) {
+                this.$emit('getCarExtendInfo', this.carInfo, val)
+            },
+            deep: true
+        },
+    }
+}
+</script>
+<style>
+.manhour_borderBottom {
+	padding: 0.75rem 1.25rem;
+    border-bottom: 1px solid #c2cfd6;
+    
+}
+.manhour_borderBottom .el-icon-circle-cross {
+    color:#FF4949
+}
+.extend-sub-prop {
+	display: inline-block;
+	padding: 5px 5px;
+	margin: 0 10px;
+	border: 1px solid #ccc;
+	border-radius: 3px;
+	cursor: pointer;
+}
+</style>
+
+

package/src/components/select-car-extend-prop/tabs.vue

@@ -0,0 +1,54 @@
+<template>
+    <div class="tabs-container">
+        <div class="tab-box clearfix">
+            <div class="tab-item pull-left" v-for="item in tabList" :key="item.value" @click="tabClick(item)">
+                {{item.text}}
+            </div>
+        </div>
+        <div class="tab-sub-box">
+            <div class="tab-sub-item" v-for="item in itemList" :key="item.value" @click="subItemClick(item)">
+                {{item.text}}
+            </div>
+            <p v-show="!itemList.length">暂无数据</p>
+        </div>
+        
+    </div>
+</template>
+<script>
+export default {
+    props: {
+        tabList: {
+            type: Array,
+            required: true
+        },
+        itemList: {
+            type: Array,
+            default: () => []
+        }
+    },
+    data() {
+        return {
+
+        }
+    },
+    methods: {
+        tabClick(item) {
+            this.$emit('tabClick', item)
+        },
+        subItemClick(item) {
+            this.$emit('subItemClick', item)
+        }
+    }
+}
+</script>
+<style lang="scss" scoped>
+.tabs-container {
+    .tab-item {
+        padding: 10px 8px;
+    }
+}
+</style>
+
+
+
+