tsanie/ui-lib
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

structure adjustment

Browse Source
This commit is contained in:
Tsanie Lily
2023-04-18 17:23:09 +08:00
parent af78bf0381
commit 22dbcf8db2
25 changed files with 519 additions and 138 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
lib/app/communications/customer.js
View File

@ -1,4 +1,4 @@
import { Grid, createElement, setTooltip, setTooltipNext, createIcon, createCheckbox, createRadiobox, createPopup, showAlert, showConfirm } from "../../ui";
import { Grid, createElement, setTooltip, createIcon, createCheckbox, createRadiobox, createPopup, showAlert, showConfirm } from "../../ui";
import { r, nullOrEmpty, formatUrl, isEmail, isPhone } from "../../utility";
import { createBox } from "./lib";
import Contact from "./contact";
@ -90,16 +90,39 @@ class CustomerCommunication {
element.dispatchEvent(new Event('change'));
}
/**
* @param {boolean} flag
*/
set loading(flag) {
if (this.#container == null) {
return;
}
this.#enter.disabled = flag;
this.#container.querySelector('.customer-name>.ui-input').disabled = flag;
this.#container.querySelector('.button-send-message').disabled = flag;
this.#container.querySelector('.button-edit-contacts').disabled = flag;
this.#container.querySelector('.button-edit-followers').disabled = flag;
}
get text() { return this.#enter?.value }
set text(s) {
const element = this.#enter;
if (element != null) {
element.value = s
s = String(nullOrEmpty(s) ? 0 : val.length) + '/3000';
s = String(nullOrEmpty(s) ? 0 : val.length) + '/' + String(this.#option.maxLength);
this.#container.querySelector('.message-bar .prompt-count').innerText = s;
}
}
get customerName() { return this.#container.querySelector('.customer-name>.ui-input')?.value }
set customerName(name) {
const element = this.#container.querySelector('.customer-name>.ui-input');
if (element == null) {
return;
}
element.value = name;
}
get contacts() {
return [...this.#contacts.children].map(el => {
const span = el.querySelector('span');
@ -303,7 +326,10 @@ class CustomerCommunication {
}
const container = createBox(
createElement('div', null,
createElement('div', div => div.innerText = r('messages', 'Customer Communication')),
createElement('div', div => {
div.className = 'title-module';
div.innerText = option.title ?? r('messages', 'Customer Communication');
}),
createElement('div', div => {
div.className = 'title-company';
if (nullOrEmpty(option.companyName)) {
@ -323,15 +349,16 @@ class CustomerCommunication {
// followers
this.#followers = this.#createFollowers(container, option);
// enter box
const enter = createElement('textarea');
const enter = createElement('textarea', 'ui-text');
enter.placeholder = r('typeMessage', 'Enter Message Here');
enter.maxLength = 3000;
option.maxLength ??= 3000;
enter.maxLength = option.maxLength;
// if (readonly === true) {
// enter.disabled = true;
// }
enter.addEventListener('input', () => {
const val = this.#enter.value;
const s = String(nullOrEmpty(val) ? 0 : val.length) + '/3000';
const s = String(nullOrEmpty(val) ? 0 : val.length) + '/' + String(option.maxLength);
this.#container.querySelector('.message-bar .prompt-count').innerText = s;
});
this.#enter = enter;
@ -344,6 +371,15 @@ class CustomerCommunication {
},
enter,
createElement('div', div => div.style.textAlign = 'right',
createElement('div', div => {
div.className = 'customer-name';
if (option.customerNameVisible !== true) {
div.style.display = 'none';
}
},
createElement('span', span => span.innerText = r('nameColon', 'Name:')),
createElement('input', 'ui-input')
),
createElement('div', 'prompt-count'),
createElement('button', button => {
button.className = 'roundbtn button-send-message';
@ -992,10 +1028,12 @@ class CustomerCommunication {
load(data, contacts, followers) {
const children = [];
if (data?.length > 0) {
contacts ??= this.#data.contacts;
followers ??= this.#data.allfollowers;
for (let comm of data) {
const div = createElement('div', 'item-div');
let name;
if (comm.IsReply) {
if (comm.IsReply && contacts?.length > 0) {
const c = isEmail(comm.Sender) ?
contacts.find(c => c.Email === comm.Sender) :
contacts.find(c => c.MobilePhone === comm.Sender);