Salesforce学习 Lwc（四）自定义开发 项目的label名重写

<template>
  <lightning-record-edit-form record-id={recordId} object-api-name="Opportunity"
  onsubmit={handleSubmit}>
      <lightning-messages></lightning-messages>
      <c-error-message-modal is-show-error-div={isShowErrorDiv}
      error-message-list={errorMessageList}>
      </c-error-message-modal>
      <lightning-layout multiple-rows="true">
          <lightning-layout-item size="6">
              <lightning-input-field field-name="Name"></lightning-input-field>
          </lightning-layout-item>
          <lightning-layout-item size="6">
              <lightning-input-field field-name="OrderNumber__c"></lightning-input-field>
          </lightning-layout-item>
          <lightning-layout-item size="6" padding="around-small" flexibility='auto'>
            <lightning-input type="text" label="Subject" name="subject" value={eventWrapper.subject} onchange={handleInputChange}></lightning-input>
        </lightning-layout-item>
        <lightning-layout-item size="6" padding="around-small" flexibility='auto'>
        </lightning-layout-item>
        <lightning-layout-item padding="around-small" flexibility='auto' size='6'>
            <lightning-input label="Start Date" type="datetime" name="startDateTime" value={eventWrapper.startDateTime} date-style="long" required onchange={handleInputChange}></lightning-input>
        </lightning-layout-item>
        <lightning-layout-item padding="around-small" flexibility='auto' size='6'>
            <lightning-input label="End Date" type="datetime" name="endDateTime" value={eventWrapper.endDateTime} date-style="long" required onchange={handleInputChange}></lightning-input>
        </lightning-layout-item>
        <lightning-layout-item size="6" padding="around-small" flexibility='auto'>
            <lightning-input-field
                field-name="User_For_LookUp__c" variant="label-stacked"
            ></lightning-input-field>
        </lightning-layout-item>
        <lightning-layout-item size="6" padding="around-small" flexibility='auto'>
            <lightning-input-field
                field-name="Contact_For_Lookup__c" variant="label-stacked"
            ></lightning-input-field>
        </lightning-layout-item>
          <lightning-layout-item size="12">
              <div class="slds-m-top_medium">
                  <lightning-button class="slds-m-top_small" label="Cancel"
                  onclick={handleReset}></lightning-button>
                  <lightning-button class="slds-m-top_small" type="submit"
                  label="Save Record"  onclick={handleClick}></lightning-button>
              </div>
          </lightning-layout-item>
      </lightning-layout>
  </lightning-record-edit-form>
</template>

import { LightningElement,track,api,wire } from 'lwc';
import { updateRecord,getRecord } from 'lightning/uiRecordApi';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';
import { NavigationMixin } from 'lightning/navigation';
import OPPORTUNITY_ID_FIELD from '@salesforce/schema/Opportunity.Id';
import OPPORTUNITY_NAME_FIELD from '@salesforce/schema/Opportunity.Name';
import OPPORTUNITY_ORDER_NUMBER_FIELD from '@salesforce/schema/Opportunity.OrderNumber__c';
import OPPORTUNITY_USER_FOR_LOOKUP_FIELD from '@salesforce/schema/Opportunity.User_For_LookUp__c';
import OPPORTUNITY_CONTACT_FOR_LOOKUP_FIELD from '@salesforce/schema/Opportunity.Contact_For_Lookup__c';
const fields = [
    OPPORTUNITY_ID_FIELD,
    OPPORTUNITY_NAME_FIELD,
    OPPORTUNITY_ORDER_NUMBER_FIELD,
    OPPORTUNITY_USER_FOR_LOOKUP_FIELD,
    OPPORTUNITY_CONTACT_FOR_LOOKUP_FIELD
];
export default class OpportunityDetailEditWithEditForm extends NavigationMixin(LightningElement) {

    @api recordId = '0066g00000GQ4GyAAL';
    @track isShowErrorDiv = false;
    @track errorMessageList = [];
    @track isFormValid = true;
    @track eventWrapper = {
        subject : '',
        whoId : '',
        ownerId : '',
        startDateTime : '',
        endDateTime : ''
    };
    handleInputChange(event) {
        let eventSourceName = event.target.name;
        if(eventSourceName === 'subject') {
            this.eventWrapper.subject = event.target.value;
        } else if(eventSourceName === 'startDateTime') {
            this.eventWrapper.startDateTime = event.target.value;
        } else if(eventSourceName === 'endDateTime') {
            this.eventWrapper.endDateTime = event.target.value;
        }
    }

    handleSubmit(event) {
        event.preventDefault();
        if(!this.isShowErrorDiv) {
            const fields = {};
            fields[OPPORTUNITY_ID_FIELD.fieldApiName] = this.recordId;
            fields[OPPORTUNITY_NAME_FIELD.fieldApiName] = event.detail.Name;
            fields[OPPORTUNITY_ORDER_NUMBER_FIELD.fieldApiName] = event.detail.OrderNumber__c;
            fields[OPPORTUNITY_USER_FOR_LOOKUP_FIELD.fieldApiName] = event.detail.User_For_LookUp__c;
            fields[OPPORTUNITY_CONTACT_FOR_LOOKUP_FIELD.fieldApiName] = event.detail.Contact_For_Lookup__c;
            const allFields = event.detail.fields;
            this.eventWrapper.whoId = allFields.User_For_LookUp__c;
            this.eventWrapper.ownerId = allFields.Contact_For_Lookup__c;
            console.log(JSON.stringify(this.eventWrapper));
            const recordInput = { fields };
            this.errorMessageList = [];
            this.isShowErrorDiv = false;
            updateRecord(recordInput)
            .then(() => {
                this.dispatchEvent(
                    new ShowToastEvent({
                        title: 'Success',
                        message: 'Opportunity updated',
                        variant: 'success'
                    })
                );
            }).catch(error => {
                //
            });
        }
    }

    handleClick(event) {
        let allInputList = Array.from(this.template.querySelectorAll('lightning-input-field'));
        let invalidFieldLabel = [];
        const allValid = allInputList.forEach(field => {
            if(field.required && field.value === '') {
                invalidFieldLabel.push(field.fieldName);
                this.isShowErrorDiv = true;
            }
        });

        if(this.isShowErrorDiv) {
            this.errorMessageList.push('These required fields must be completed: ' + invalidFieldLabel.join(','));
        }
    }
    handleReset(event) {
        const inputFields = this.template.querySelectorAll(
            'lightning-input-field'
        );
        if (inputFields) {
            inputFields.forEach(field => {
                field.reset();
            });
        }
    }
}