<template>
  <div class="main"> 
	<div class="tabheadtow clear"><h2 class="title">基本信息</h2></div>
	<tableGrid :info="info" :config="taskData"></tableGrid>
	
	<el-card class="mt20">
		<div class="tabheadtow clear"><h2 class="title">任务详情</h2></div>
		<div class="contenter">
			<p v-html="info.content"></p>
		</div>
	</el-card>
	
	<el-card class="mt20">
		<div class="tabheadtow clear"><h2 class="title">操作记录</h2></div>
		<el-table :data="logs"  border stripe>
		  <el-table-column label="序号" min-width="60">
			  <template slot-scope="{row}" >
			    <span>{{ row.id }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="操作人" min-width="150">
			  <template slot-scope="{row}" >
			    <span>{{ row.username }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="操作时间" min-width="150">
			  <template slot-scope="{row}" >
			    <span>{{ row.created_at|toDatetime }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="操作行为" min-width="150">
			  <template slot-scope="{row}" >
			    <span>{{ row.action }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="操作前状态" min-width="150" >
			  <template slot-scope="{row}" >
			    <span>{{ row.op_stage|toStage }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="操作后状态" min-width="150">
			  <template slot-scope="{row}" >
			    <span>{{ row.cur_stage|toStage }}</span>
			  </template>
		  </el-table-column>
		  <el-table-column label="备注" min-width="150">
			  <template slot-scope="{row}" >
			    <span>{{ row.marks||'---' }}</span>
			  </template>
		  </el-table-column>
		</el-table>
	</el-card>
	
  </div>
</template>

<script>
import {getB2BInfo} from "@/api/task";
import { toStage } from "@/utils/stringFun";
import { toDatetime } from "@/utils/date";
import tableGrid from '@/components/grid/tableGrid.vue';
import config  from './config.js';
export default {
  name: "taskInfo",
  components:{tableGrid},
  data() {
    return {
	  id:0,
	  listLoading:false,
	  taskData:config.b2bData,
      info: {},
	  list:[],
      logs: [],
    }
  },
  methods: {

	async getData(){
		let param = {id: this.id}
		const res = await getB2BInfo( param )
		if (res.code == 200){
		    this.info = res.data.info||{}
		    this.logs = res.data.logs||[]
		}
	}
  },
  filters: {
	  toDatetime,
	  toStage
  },
  created() {
	this.id = +this.$route.query.id;
	this.getData( )
  }
};
</script>
<style scoped lang="scss">
.warning {
  color: #dc143c;
}
.th{line-height: 28px;}

</style>