<template>
    <div>
        <el-dialog title="修改内容" :visible="resendVidable" v-if="resendVidable" @close="cancel" center
            :distroy-on-close="true">
            <div style="margin-bottom: 30px;"><span style="font-weight: bold;">发送内容:</span>{{ sendData }}</div>
            <el-form label-width="100px">
                <el-form-item v-for="(item,index) in rowData.templateParams" :label="item.paramName" :key="item.id"> 
                    <el-input v-model="rowData.templateParams[index].paramValue" @input="changeContent"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cancel" class="endbutton1" round><span>取 消</span></el-button>
                <el-button @click="submitSend" class="endbutton1" type="primary" round><span>确 认</span></el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import {
    updateSendContent,
} from "@/api/deliveryRecord/deliveryRecord.js";
export default {
    props: ["resendVidable", "rowData","queryParams"],
    data() {
        return {
            sendData:'',
            param:"",
            paramValue:""

        };
    },
    watch: {
        resendVidable(val){
            if(val){
                this.sendData = this.rowData.sendContent;
            }
        }
    },
    methods: {
        cancel() {
            this.$emit("cancelSend");
        },
        submitSend() {
            console.log(this.rowData)
            this.updateSendContentFn({
                id:this.rowData.id,
                templateParams:this.rowData.templateParams
            })
        },
        updateSendContentFn(data){
            updateSendContent(data).then(res=>{
                this.$message.success('更新成功');
                this.$emit("cancelSend");
                this.$emit('getList',this.queryParams);
            })
        },
        changeContent(){
            let templateContent = this.rowData.templateContent
            this.rowData.templateParams.forEach(item => {
                templateContent = templateContent.replace(item.param,item.paramValue)
            });
           this.sendData = templateContent
        }
    },
};
</script>

<style lang="scss" scoped></style>