
<template>
    <div class="page">
        <LayoutTable :data='tableData' :config='tableConfig' notDel notPagination/>
    </div>
</template>

<script>
import table from "@/assets/mixins/table";

export default {
    mixins: [table],
    methods: {
      beforeFetchData(data) {
        const searchForm = {};
        Object.keys(data).forEach(key => {
          var reqKey = key;
          if (data[key] !== "") {
            searchForm[key] = undefined;
            searchForm[reqKey] = data[key];
          }
        });
        data = Object.assign({}, data, searchForm);

        if(data['query.orderColList[0]'] && data['query.orderColList[0]'].colName==undefined){
          data['query.orderColList[0]']={};
        }
        if(undefined != data['query.orderColList[0]']){
          searchForm['query.orderColList[0]']= data['query.orderColList[0]'];
          this.$route.query["query.orderColList[0]"] = data['query.orderColList[0]'];
        }

        return data;
      },
      // 表格排序
      handleSortChange(row) {
        const { prop, order } = row;
        let orderCol = {
          colName: prop,
          sortKind: order === "ascending" ? "asc" : "desc"
        };
        this.$set(
            this.query,
            "query.orderColList[0]",
            prop ? orderCol : {}
        );
        this.getData();
      },
      //跳转日志页面
      toEventLogPage(row){
        this.$router.push({
          path: "/asset/flow/eventlog/list?query.eventId="+row.id  ,

        })
      },
      //跳转事件字段页面
      toEventFieldPage(row){
        this.$router.push({
          path: "/asset/flow/eventfield/list?query.eventCode="+row.code  ,

        })
      },

        // 格式化事件前资产流转状态
        formatterBeforeFlowStatus(row, column, val) {
            const tagsMap = {
                0: "danger",
                1: "success",
            };
            let content = "";
            if (
                this.tableData.dict &&
                this.tableData.dict["beforeFlowStatus"]
            ) {
                const dict = this.tableData.dict["beforeFlowStatus"];
                let value = val + "";
                if (value.split(",").length > 1) {
                    let result = [];
                    for (let v of value.split(",")) {
                        let tag = (
                            <span>
                                {" "}
                                <el-tag
                                    type={tagsMap[val] || "info"}
                                    size="mini"
                                >
                                    {dict[v] || v}
                                </el-tag>
                            </span>
                        );
                        result.push(tag);
                    }
                    return result;
                } else {
                    content = dict[val] || val;
                    return (
                        <el-tag type={tagsMap[val] || "info"} size="mini">
                            {content}
                        </el-tag>
                    );
                }
            }
        },
    },
    data() {
        return {
            config: {
                search: [
                    {
                        name: "id",
                        type: "text",
                        label: "ID",
                    },
                    {
                        name: "code",
                        type: "text",
                        label: "事件码",
                    },
                    {
                        name: "name",
                        type: "text",
                        label: "名称",
                        fuzzy: true,
                    },
                    {
                        name: "beforeFlowStatus",
                        type: "select",
                        label: "事件前状态",
                    },
                    {
                        name: "afterFlowStatus",
                        type: "select",
                        label: "事件后状态",
                    },
                    {
                        name: "enabled",
                        type: "select",
                        label: "是否启用",
                    },
                ],
                columns: [
                    {
                        prop: "code",
                        label: "事件码",
                        sortable:true
                    },
                    {
                        prop: "name",
                        label: "事件名称",
                    },
                    {
                        prop: "enabled",
                        label: "是否启用",
                        formatter: this.formatter,
                    },
                    {
                        prop: "beforeFlowStatus",
                        label: "事件前状态",
                        formatter: this.formatterBeforeFlowStatus,
                    },
                    {
                        prop: "afterFlowStatus",
                        label: "事件后状态",
                        formatter: this.formatter,
                    },
                    {
                        prop: "script",
                        width: 280,
                        label: "事件执行事务脚本",
                    },
                  {
                    prop: "orderNo",
                    width: 80,
                    label: "排序号",
                  },
                    {
                        label: "操作",
                        width: 150,
                        formatter: (row) => {
                            return (
                                <div>
                                  <table-buttons row={row} onEdit={this.toEdit} onView={this.toView} noDel />
                                  <el-button size="mini" type="success"  icon="el-icon-setting"  onClick={() => {this.toEventFieldPage(row);}} circle title="事件扩展字段" ></el-button>

                                  <el-button size="mini" type="success"  icon="el-icon-notebook-2"  onClick={() => {this.toEventLogPage(row);}} circle title="事件日志" ></el-button>

                                </div>
                                );
                        },
                    },
                ],
            },
        };
    },
};
</script>
