
<template>
    <layout-form>
        <el-form :model="form" :loading="loading" :rules="rules" size='small' label-width='100px' ref="form">
            <el-row>
                <Field label="事件名" prop="eventCode" v-model="form.eventCode" :enumData='dict.eventCode' :disabled="pageInfo.type === 'view'" type='select' />
                <!--   <Field label="事件码" prop="eventCode" v-model="form.eventCode" :disabled="pageInfo.type === 'view'"/>-->
                <Field label="事件发生时间" prop="eventTime">
                    <el-date-picker v-model="form.eventTime" type="datetime" placeholder="选择日期时间" :disabled="pageInfo.type === 'view'"> </el-date-picker>
                </Field>
                <Field label="事件经手人" prop="name" v-model="form.eventUser" :enumData='dict.eventUser' :disabled="pageInfo.type === 'view'" type='select' />
                <Field label="事件关联人" prop="eventAfterUserArr" v-model="form.eventAfterUser" :enumData='dict.eventAfterUser'  :disabled="pageInfo.type === 'view'"  type='select' multiple/>
              <Field label="事件发生地" prop="name" v-model="form.eventAddress" :disabled="pageInfo.type === 'view'" />
                <Field label="事件前状态" prop="beforeFlowStatus" v-model="form.beforeStatus" :enumData='dict.beforeStatus' type='select' :disabled="pageInfo.type === 'view'" />
                <Field label="事件后状态" prop="afterFlowStatus" v-model="form.afteStatus" :enumData='dict.afteStatus' type='select' :disabled="pageInfo.type === 'view'" />
                <Field label="备注" prop="remark" v-model="form.remark" :disabled="pageInfo.type === 'view'" />
                <Field label="事件关联图像" prop="eventImgUrl">
                    <span style="margin-left:10px;" v-for="item in eventImgUrlArr" v-if="eventImgUrlArr.length > 0">
                        <el-image style="width: 100px; height: 100px" :src="item" :preview-src-list="eventImgUrlArr">
                        </el-image>
                    </span>
                    <span style="margin-left:10px; color: #cccccc" v-if="eventImgUrlArr.length == 0">
                        无图像
                    </span>
                </Field>
            </el-row>
            <form-buttons @submit='submitForm' v-if="pageInfo.type != 'view'" />
            <el-button @click="$router.go(-1)" size='small' icon='el-icon-circle-close-outline' v-if="pageInfo.type == 'view'">返回</el-button>
        </el-form>
    </layout-form>
</template>

<script>
import form from "@/assets/mixins/form";
export default {
    mixins: [form],
    methods: {
        beforeRender(data) {
            if (data.entity.eventImgUrl && data.entity.eventImgUrl != '无') {
                let arr = data.entity.eventImgUrl.split(",");
                this.eventImgUrlArr = arr;
            } else {
                this.eventImgUrlArr = [];
            }
          if (data.entity.eventAfterUser) {
            let arr = data.entity.eventAfterUser.split(",");
            data.entity.eventAfterUser = arr;
          } else {
            data.entity.eventAfterUser = [];
          }
            return data;
        },
    },
    data() {
        return {
            eventImgUrlArr: [],
            eventAfterUserArr: [],
            toString: ["beforeStatus", "afteStatus", "eventCode", "enabled","eventUser",],
            rules: {
                id: [{ required: true, message: "请输入ID", trigger: "blur" }],
                name: [
                    {
                        required: true,
                        message: "请输入事件名称",
                        trigger: "blur",
                    },
                ],
                enabled: [
                    {
                        required: true,
                        message: "请选择是否启用",
                        trigger: "blur",
                    },
                ],
                beforeFlowStatus: [
                    {
                        required: true,
                        message: "请选择事件前资产流转状态",
                        trigger: "blur",
                    },
                ],
                afterFlowStatus: [
                    {
                        required: true,
                        message: "请选择事件后资产流转状态",
                        trigger: "blur",
                    },
                ],
                script: [
                    {
                        required: true,
                        message: "请输入事件执行事务脚本",
                        trigger: "blur",
                    },
                ],
            },
        };
    },
};
</script>
