<template>
    <div>
        <el-dialog
            title="备注"
            :visible.sync="objProps.dialogFormVisible"
            width="30%"
            :before-close="handleDialogClose">
            <div>
                <el-form ref="formSend" :model="form" :rules="rulesSend">
                    <!-- afterSale：客诉 -->
                <el-form-item prop="remake" v-if="objProps.scene=='afterSale'">
                    <el-input type="textarea" 
                    class="textheight" 
                    v-model="objProps.remake" 
                    placeholder="请填写备注："
                    maxlength="150"
                    show-word-limit></el-input>
                </el-form-item>
                <el-form-item prop="supplierRemark" v-else>
                    <el-input type="textarea" 
                    class="textheight" 
                    v-model="objProps.supplierRemark" 
                    placeholder="请填写备注："
                    maxlength="150"
                    show-word-limit></el-input>
                </el-form-item>
           
                </el-form>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button @click="cancelForm('formSend',objProps.dialogFormVisible)">取 消</el-button>
                <el-button type="primary" :disabled="isDisabled" @click="confirmSend('formSend',objProps.dialogFormVisible)">确认</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import { _getStorage } from "@/utils/utils";
export default {
    name:"orderRemark",
    data(){
        return{
            isDisabled:false,
            showDialog:false,
            form:{
                supplierRemark:this.objProps.supplierRemark?this.objProps.supplierRemark:'',
                remake:this.objProps.remake?this.objProps.remake:''
            },
            rulesSend:{
                supplierRemark:[{ required: true, message: '备注不能为空',trigger: 'blur'}],
                remake:[{ required: true, message: '备注不能为空',trigger: 'blur'}],
            }
        }
    },
    props:{
        objProps:{
            type:Object,
            default:()=>{ return {}}
        }
    },
    watch:{
        objProps:{
            deep:true,
            handler: function(value) {
                this.showDialog = value.dialogFormVisible
            }
        }
    },
    methods:{
      confirmSend(formName,val){
            let orderid = this.objProps.orderid;
            let { brandId } = _getStorage('info');
            let data = this.form;
            if(this.objProps.scene=='afterSale'){
                data.id = this.objProps.id;
                data.remake = this.objProps.remake  
            }else{
                data.orderId = orderid;
                data.supplierRemark = this.objProps.supplierRemark  
            }
            this.$refs[formName].validate(valid => {
                if (valid) {
                    this.isDisabled =true
                    this.$axios.post(this.objProps.url,{
                        ...data,
                        brandId
                    }).then((res)=>{
                        let {code,data,msg,message} = res.data
                        if(code == 200){
                            this.$message.success(msg || message);
                            this.cancelForm('formSend',val,'ok');
                        }else{
                            this.$message.error(msg || message);
                        }
                        this.isDisabled =false
                    }).catch((res)=>{
                        this.isDisabled =false
                    });
                }
            })
            
      },
      cancelForm(formName,val,type){
          this.$refs[formName].resetFields();
          const data = {
            state:!val,
            }
          this.$emit("resData", data,type);
      },
      handleDialogClose() {
          this.cancelForm('formSend',true)
      },
    },
}
</script>
<style lang="scss" scoped>
.textheight >>> .el-textarea__inner {
  height: 150px;
  max-height: 150px;
}
</style>
