|
@@ -0,0 +1,112 @@
|
|
|
+<template>
|
|
|
+ <el-dialog width="700px" :show-close="false" destroy-on-close :visible.sync="dialogTableVisible">
|
|
|
+ <div class="send-content">
|
|
|
+ <div class="top-juhe">
|
|
|
+ <div class="left-content">
|
|
|
+ <div class="juhe-icon">
|
|
|
+ <img src="../../../static/image/juhe-icon.png" />
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div class="juhe-title">聚合配送</div>
|
|
|
+ <div class="quan-wang">
|
|
|
+ <span>全网运力推单</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="right-content">
|
|
|
+ <div class="right-title">
|
|
|
+ 预估<span>7.8~10.8</span>元
|
|
|
+ </div>
|
|
|
+ <div>优惠合计2元</div>
|
|
|
+ </div>
|
|
|
+ <img src="../../../static/image/choose-icon.png" class="choose-icon" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogTableVisible: true,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ init() {
|
|
|
+ this.dialogTableVisible = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ /deep/ .el-dialog__header {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+ /deep/ .el-dialog__body {
|
|
|
+ padding: 22px !important;
|
|
|
+ }
|
|
|
+ .send-content {
|
|
|
+ border-radius: 10px;
|
|
|
+ }
|
|
|
+ .top-juhe {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 20px;
|
|
|
+ position: relative;
|
|
|
+ border: 1px solid #999;
|
|
|
+ border-radius: 8px;
|
|
|
+ overflow: hidden;
|
|
|
+ .left-content {
|
|
|
+ display: flex;
|
|
|
+ .juhe-icon {
|
|
|
+ align-self: center;
|
|
|
+ font-size: 0;
|
|
|
+ width: 41px;
|
|
|
+ height: 40px;
|
|
|
+ margin-right: 12px;
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .juhe-title {
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #0D1E40;
|
|
|
+ }
|
|
|
+ .quan-wang {
|
|
|
+ margin-top: 8px;
|
|
|
+ span {
|
|
|
+ display: inline-block;
|
|
|
+ padding: 0px 4px;
|
|
|
+ border: 1px solid #FC7200;
|
|
|
+ border-radius: 2px;
|
|
|
+ color: #FC7200;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .right-content {
|
|
|
+ .right-title {
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #0D1E40;
|
|
|
+ span {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #FC7200;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .choose-icon {
|
|
|
+ width: 32px;
|
|
|
+ height: 32px;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|