|
@@ -2,80 +2,103 @@
|
|
<div class="center">
|
|
<div class="center">
|
|
<div class="center_css">
|
|
<div class="center_css">
|
|
<div class="top_css">
|
|
<div class="top_css">
|
|
- <el-radio v-model="radio" label="1" @change="change('1')">北斗导航</el-radio>
|
|
|
|
- <el-radio v-model="radio" label="2" @change="change('2')">平台绘制</el-radio>
|
|
|
|
|
|
+ <el-radio v-model="radio" label="1" @change="change('1')">北斗导航</el-radio>
|
|
|
|
+ <el-radio v-model="radio" label="2" @change="change('2')">平台绘制</el-radio>
|
|
<div class="order-detail">
|
|
<div class="order-detail">
|
|
- <div>订单:{{querydata.orderNo}}({{startDate}} ~ <span v-if='querydata.orderStatus=="已完结"'>{{endDate}}</span><span v-else>运输中</span> )</div>
|
|
|
|
- <div>发货地:{{querydata.sendPrivate}}{{querydata.sendCity}}{{querydata.sendArea}}{{querydata.sendDetailedAddress}}</div>
|
|
|
|
- <div>卸货地:{{querydata.unloadPrivate}}{{querydata.unloadCity}}{{querydata.unloadArea}}{{querydata.unloadDetailedAddress}}</div>
|
|
|
|
|
|
+ <div>订单:{{ querydata.orderNo }}({{ startDate }} ~ <span
|
|
|
|
+ v-if='querydata.orderStatus == "已完结"'>{{ endDate }}</span><span v-else>运输中</span> )</div>
|
|
|
|
+ <div>
|
|
|
|
+ 发货地:{{ querydata.sendPrivate }}{{ querydata.sendCity }}{{ querydata.sendArea }}{{ querydata.sendDetailedAddress }}
|
|
|
|
+ </div>
|
|
|
|
+ <div>
|
|
|
|
+ 卸货地:{{ querydata.unloadPrivate }}{{ querydata.unloadCity }}{{ querydata.unloadArea }}{{ querydata.unloadDetailedAddress }}
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="map">
|
|
<div class="map">
|
|
- <map-drag :radio='radio' :orderid='querydata.id'></map-drag>
|
|
|
|
|
|
+ <map-drag :radio='radio' :orderid='querydata.id' :currentPage="currentPage" :pageSize="pageSize"
|
|
|
|
+ ref="child"></map-drag>
|
|
</div>
|
|
</div>
|
|
|
|
+ <el-pagination :current-page="currentPage" style="text-align: center; margin-top: 10px" v-if="radio==2"
|
|
|
|
+ :page-size="deptCircularPage.pageSize" layout="total, sizes, prev, pager, next, jumper" :total="deptBudgetTotal"
|
|
|
|
+ @size-change="handleSizeChange" @current-change="handleCurrentChange" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
<script>
|
|
- import {
|
|
|
|
- travelpath
|
|
|
|
- } from '@/api/orderManagement'
|
|
|
|
- import mapDrag from '@/components/mapdrag/indexMap'
|
|
|
|
- export default {
|
|
|
|
- data() {
|
|
|
|
- return {
|
|
|
|
- radio: '1',
|
|
|
|
- querydata:{},
|
|
|
|
- endDate:'',
|
|
|
|
- startDate:''
|
|
|
|
- }
|
|
|
|
|
|
+import {
|
|
|
|
+ travelpath
|
|
|
|
+} from '@/api/orderManagement'
|
|
|
|
+import mapDrag from '@/components/mapdrag/indexMap'
|
|
|
|
+export default {
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ radio: '1',
|
|
|
|
+ querydata: {},
|
|
|
|
+ endDate: '',
|
|
|
|
+ startDate: '',
|
|
|
|
+ currentPage: 1,
|
|
|
|
+ pageSize: 10,
|
|
|
|
+ deptCircularPage: {},
|
|
|
|
+ deptBudgetTotal: 20,
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ components: {
|
|
|
|
+ mapDrag
|
|
|
|
+ },
|
|
|
|
+ mounted() {
|
|
|
|
+ this.querydata = this.$route.query
|
|
|
|
+ this.getTime()
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ handleSizeChange(val) {
|
|
|
|
+ console.log(`每页 ${val} 条`)
|
|
|
|
+ this.pageSize = val
|
|
|
|
+ this.$refs.child.paging(this.currentPage,this.pageSize)
|
|
},
|
|
},
|
|
- components: {
|
|
|
|
- mapDrag
|
|
|
|
|
|
+ handleCurrentChange(val) {
|
|
|
|
+ this.currentPage = val
|
|
|
|
+ console.log(`当前页: ${val}`)
|
|
|
|
+ this.$refs.child.paging(this.currentPage,this.pageSize)
|
|
},
|
|
},
|
|
- mounted() {
|
|
|
|
-
|
|
|
|
- this.querydata=this.$route.query
|
|
|
|
- console.log(this.querydata)
|
|
|
|
- this.getTime()
|
|
|
|
|
|
+ change(val) {
|
|
|
|
+ this.getTime()
|
|
|
|
+ this.currentPage=1
|
|
|
|
+ this.pageSize=10
|
|
|
|
+ this.radio = val
|
|
},
|
|
},
|
|
- methods:{
|
|
|
|
- change(val){
|
|
|
|
- this.getTime()
|
|
|
|
- this.radio=val
|
|
|
|
- },
|
|
|
|
- getTime(){
|
|
|
|
- let _obj = {}
|
|
|
|
- _obj.orderId = this.querydata.id
|
|
|
|
- travelpath(_obj).then(response => {
|
|
|
|
- console.log(response)
|
|
|
|
- this.startDate=response.data.startDate
|
|
|
|
- this.endDate=response.data.endDate
|
|
|
|
- })
|
|
|
|
- .catch(() => {
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
|
|
+ getTime() {
|
|
|
|
+ let _obj = {}
|
|
|
|
+ _obj.orderId = this.querydata.id
|
|
|
|
+ _obj.currentPage = this.currentPage
|
|
|
|
+ _obj.pageSize = this.pageSize
|
|
|
|
+ travelpath(_obj).then(response => {
|
|
|
|
+ this.startDate = response.data.startDate
|
|
|
|
+ this.endDate = response.data.endDate
|
|
|
|
+ this.deptBudgetTotal = response.data.total
|
|
|
|
+ }).catch(() => {})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+}
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
- .center {
|
|
|
|
- padding: 20px;
|
|
|
|
- background: #f5f6f7;
|
|
|
|
- height: calc(100vh - 5vh);
|
|
|
|
- }
|
|
|
|
|
|
+.center {
|
|
|
|
+ padding: 20px;
|
|
|
|
+ background: #f5f6f7;
|
|
|
|
+ // height: calc(100vh - 5vh);
|
|
|
|
+}
|
|
|
|
|
|
- .center_css {
|
|
|
|
- background: #ffffff;
|
|
|
|
- border-radius: 1px;
|
|
|
|
- height: 100%;
|
|
|
|
- }
|
|
|
|
|
|
+.center_css {
|
|
|
|
+ background: #ffffff;
|
|
|
|
+ border-radius: 1px;
|
|
|
|
+ height: 100%;
|
|
|
|
+}
|
|
|
|
|
|
- .top_css {
|
|
|
|
- padding: 10px;
|
|
|
|
- display: flex;
|
|
|
|
|
|
+.top_css {
|
|
|
|
+ padding: 10px;
|
|
|
|
+ display: flex;
|
|
|
|
|
|
- }
|
|
|
|
|
|
+}
|
|
</style>
|
|
</style>
|