<style>
    .orderProductDetails-box{
        height: 660px;
        padding:  20px;
        background-color: #fff;
        overflow: hidden;
    }
    .form-box-log {
        border-left: 1px solid #E9E9E9;
        padding: 0 5px;
    }
    
    .form-log-title {
        width: 100%;
        position: relative;
    }
    
    .form-log-text {
        display: flex;
        justify-content: space-between;
        margin-bottom: 10px;
    }
    
    .form-log-text span:first-child {
        color: #409efe;
        font-size: 15px;
    }
    
    .form-log-text span:last-child {
        color: #555;
    }
    
    .form-log-text,
    .form-log-center {
        padding: 0 0 0 20px;
    }
    
    .log-radius {
        position: absolute;
        width: 5px;
        height: 5px;
        left: -8px;
        border-radius: 100%;
        top: 15px;
        background: rgba(255, 164, 117, 1);
        border-radius: 50%;
        margin-right: 10px;
    }
    
    .form-log-center {
        margin-bottom: 20px;
        letter-spacing: 2px;
    }
    .orderlog-box{
        height: 520px;
        overflow-y: scroll;
    }
    .orderlog-box-center{
        margin: 0 10px;
    }
    .noData{
        width: 100%;
        text-align: center;
        padding: 20px 0;
        font-size: 12px;
        color: #333;
    }
    </style>
        <template>
            <!-- :style="{height:logData.length>0?'460px':'400px'}" -->
            <div class="orderProductDetails-box">
                <div v-if="total>0" class="orderlog-box">
                    <div class="orderlog-box-center" v-for="(item,index) in logData" :key="index">
                        <div class="form-box-log">
                        <div class="form-log-title">
                            <span class="log-radius"></span>
                            <div class="form-log-text">
                            <span>
                                {{item.CreateByName}}
                            </span>
                            <span>
                                {{item.CreateTime}}
                            </span>
                            </div>
                        </div>
                        <div class="form-log-center">
                            {{item.LogContent}}
                        </div>
                        </div>
                    </div>
                 </div>
                 <div v-else class="noData">暂无数据</div>
                  <div v-if="total>0">
                    <el-pagination class="Mypagination" background @current-change="handleCurrentChange"
                        :page-sizes="[10, 30, 60, 90, 100]" :page-size="msg.pageSize" layout="total, sizes, prev, pager, next"
                        @size-change="handleSizeChange" :total="total">
                    </el-pagination>
                </div>
                
            </div>
        </template>
        <script>
    export default {
      components: {
        
      },
      props: {
        orderId: {
          type: Number,
          required: true,
        },
      },
      data() {
        return {
            logData: [],
            total: 0,
            msg: {
                pageIndex: 1,
                pageSize: 10,
                OrderId: "",
            },
        
        };
      },
      watch: {
        
      },
      mounted() {
        this.msg.OrderId = this.orderId
        this.getList()
      },
      methods: {
        // 操作日志
        getList() {
            this.apipost("/api/Order/GetOrderLogPageList", this.msg, (res) => {
                if (res.data.resultCode == 1) {
                    this.logData = res.data.data.pageData
                    this.total = res.data.data.count
                } else {
                    this.$message.error(res.data.message);
                }
            });
        },
        handleSizeChange(val) {
            this.msg.pageSize = val;
            this.getList();
        },
        handleCurrentChange(val) {
            this.msg.pageIndex = val;
            this.getList();
        },
      },
    };
    </script>
    