client OverviewWidget

/*
  update()
  getList()
  isReadOnly()
  isNotReadOnly()
  isMandatory()
  isNotMandatory()
  All()
  sortValues()
  sortName()
  sortSection()
  sortLabel()
  sortReadOnly()
  sortMandatory()
*/
(async () => {
    window.s_widget_custom = window.s_widget_custom || {};
    await s_widget.setFieldValue('nextState', '');
    await s_widget.setFieldValue('currentID', s_form.sysId);
    await s_widget.setFieldValue('tableName', s_form.getTableName());
    await s_widget.setFieldValue('sections', s_form.getSectionNames());

    await s_widget.setFieldValue('formId', s_form.formId);
    await s_widget.serverUpdate();
    let names = s_widget.getFieldValue('names');
    let avalible = s_widget.getFieldValue('avalible');
    let arrNames = [];
    for (const [key, value] of Object.entries(avalible)) {
      value.forEach(v => arrNames.push(v) );
    }
    function readonlyOfNames(names) {
        let readonlyOfNames = [];
        names.forEach(value => readonlyOfNames.push(s_form.isReadonly(value)))
        return readonlyOfNames;
    }

    window.overview = {
      fields: s_widget.getFieldValue('fields'),
        names: getNames(s_widget.getFieldValue('names')), // именя доступных полей
        readonlyOfNames: readonlyOfNames(names), // массив true false для readOnly полей из массива "names"
        mandatoryServer: s_widget.getFieldValue('mandatory'),
        getChoice(val){ console.table(
          s_widget.getFieldValue('choice')[val].split(';') )//
                   },
        visibl: getVisible(names),
        avalible: avalible,
        sectionsNotvisible: Object.keys(avalible).filter(value => !s_form.isSectionVisible(value)),
        list: '',
        start() {
            s_widget.setFieldValue('isShow', 'true');
            this.getList();
            {test: "test"};
        },
        update() {
            this.visibl = getVisible(this.names);
            console.log("\u001b[1;31m updated")
        },
        nextState(state){switchStatus(state)},
        getList(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.forEach(value => getTable(table, value));

            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },
        isReadOnly() {
            this.update();
            const printSYS = this.visibl.filter(value => s_form.isReadonly(value) )
            console.log(printSYS);
            const printLAB = [];
            printSYS.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            console.log( printLAB );
        },
        isNotReadOnly() {
            this.update();
            const printSYS = this.visibl.filter(value => !s_form.isReadonly(value) )
            console.log(printSYS);
            const printLAB = [];
            printSYS.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            console.log( printLAB );
        },
        isMandatory() {
            this.update();
            const printSYS = this.visibl.filter(value => s_form.isMandatory(value))
            console.log(printSYS);
            const printLAB = [];
            printSYS.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            console.log( printLAB );
        },
        isNotMandatory() {
            this.update();
            const printSYS = this.visibl.filter(value => !s_form.isMandatory(value))
            console.log(printSYS);
            const printLAB = [];
            printSYS.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            console.log( printLAB );
        },
        All() {
            this.update();
            console.log(this.visibl);
            const printLAB = [];
            this.visibl.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            console.log( printLAB );
        },
        sortValues(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.sort((a, b) => `${b[4]}${b[5]}`.length - `${a[4]}${a[5]}`.length).forEach(value => getTable(table ,value));

            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },
        sortName(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.sort((a, b) => a[2].charCodeAt() - b[2].charCodeAt()).forEach(value => getTable(table ,value));

            // const printSYS = this.visibl.sort((a, b) => a[0].charCodeAt() - b[0].charCodeAt())
            // console.log(printSYS);
            // const printLAB = [];
            // printSYS.forEach(value => printLAB.push(s_form.getLabelOf(value)))
            // console.log( printLAB );


            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },

        sortSection(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.sort((a, b) => a[6].charCodeAt() - b[6].charCodeAt()).forEach(value => getTable(table ,value));

            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },

        sortLabel(fieldName = '') {
            this.update()
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            this.list.sort((a, b) => a[3].charCodeAt() - b[3].charCodeAt()).forEach(value => p(value));
        },
        sortReadOnly(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.sort((a, b) => b[1] - a[1]).forEach(value => getTable(table ,value));

            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },
        sortMandatory(fieldName = '') {
            this.update();
            let filter = this.visibl.filter(value => value.includes(fieldName));
            this.list = getList(filter);
            let table = [''];
            this.list.sort((a, b) => b[0] - a[0]).forEach(value => getTable(table ,value));

            let container = document.querySelector(`#template`);
            container.innerHTML = table[0];
        },
        to_fields(arrfields) {
          let fields = '';
          arrfields.forEach(value => fields += `${value}\n`);
          console.log(fields);
        },
        to_seeFields(arrfields, type = 'readonly', bool = 'true') {
          let seeFields = '';
          arrfields.forEach(value => seeFields += `${value}: {${type}: ${bool}},\n`);
          console.log(seeFields);
        },
        makeMatrix(name, del = ''){// удалить вывести
          let matrix = [];
          if (del === '') {
          if (localStorage.getItem(name) === null) {localStorage.setItem(name, 'FIELDs ,' + this.names + ';')}
          localStorage.setItem(name, localStorage.getItem(name) + s_form.getDisplayValue('state') + ',' + readonlyOfNames(names) + ';'); // readonlyOfNames(names) - массив [true false]readOnly для полей из массива "names"
          }
          if (del === 'get') {
          let colums = localStorage.getItem(name).split(';').filter(value => value != ['']);
          colums.forEach(value => matrix.push( value.split(',') ))
          matrix = _.zip(...matrix)
          console.table(matrix)
          }
          if (del === 'del') {eval (`delete localStorage.${name}`)}
        },
        stateMatrix() {   // localStorage.setItem('states', ['-2','8','6','10','7','3','4','2','0'])
          // localStorage.setItem('states', ['-2', '-1', '1', '2', '7', '9', '10'])  Change Requests http://localhost:3000/record/sys_business_rule/165789658610849621
            let way = localStorage.getItem('states').split(',');
            let currentMay = s_form.getValue('state');
            let next = way[way.indexOf(currentMay)+1];
              console.log(s_form.getDisplayValue('state') + s_form.getValue('state')  + ' № '+ (way.indexOf(currentMay)+1))
          setTimeout(() => {
            if (next == undefined ) return;
            s_widget.setFieldValue('nextState', next);
            s_widget.serverUpdate();
            s_go.reloadWindow();
          }, 2000)

          },
          stateFlou(state_s) {
              let duration = 1000;
              var s, myStringArray = state_s;
              for (s of myStringArray) {
              eval(`setTimeout(() => {  overview.nextState('${s}')}, ${duration})`)
              //console.log(`setTimeout(() => {  overview.nextState('${s}')}, ${duration})`)
              duration += 5000;
              }
          },

    };


console.log('overview.start()')


s_widget_custom.reject = () => {
s_widget.setFieldValue('isShow', 'false');}
s_widget_custom.Mandatory  = () => { overview.sortMandatory();  }
s_widget_custom.ReadOnly  = () => { overview.sortReadOnly();  }
s_widget_custom.Names  = () => { overview.sortName();  }
s_widget_custom.Values  = () => { overview.sortValues();  }
s_widget_custom.Sections  = () => { overview.sortSection();  }

s_widget_custom.isReadOnly  = () => { overview.isReadOnly();  }
s_widget_custom.isNotReadOnly  = () => { overview.isNotReadOnly();  }
s_widget_custom.isMandatory  = () => { overview.isMandatory();  }
s_widget_custom.isNotMandatory  = () => { overview.isNotMandatory();  }
s_widget_custom.All  = () => { overview.All();  }

//flou
// overview.stateMatrix();
// overview.makeMatrix('new1');
})();

function getNames(names) {
    return names.filter(value => value);
}

function getVisible(names) {
    return names.filter(value => s_form.isVisible(value));
}

function getList(visibl) {
    let info = []
    visibl.forEach(value => info.push([s_form.isMandatory(value), s_form.isReadonly(value), value, s_form.getLabelOf(value), s_form.getDisplayValue(value), s_form.getValue(value), getVisiblSection(value)]));
    return info;
}


function getTable(table, value) {
let fielsValue = value[4] && value[5] ? value[4] + ' = ' + value[5] : value[4] + value[5];
const mandatory = value[0] ? 'TRUE' : 'false';
const raedOnly = value[1] ? 'TRUE' : 'false';
let bg = '';

    if (value[0] || value[1]) {
        bg = 'style="font-weight:bold;transform: scale(1, 1.2); "'
    }

 //if(!s_form.isSectionVisible(getVisiblSection(value[2])) && s_form.getSections().length > 1) return;
let template = `<tr ${bg}>
    <td class="Mandatory"> ${mandatory} </td>
    <td class="ReadOnly"> ${raedOnly} </td>
    <td class="Names"> ${value[2] + ' ' + value[3]} </td>
    <td class="Values"> ${fielsValue} </td>
    <td class="Sections"> ${value[6]} </td>
</tr>`;
  table[0] += template;
}

function getVisiblSection(field) {
    let sections = Object.keys(overview.avalible)
    const section = sections.filter(value => overview.avalible[value].includes(field));
    return section[0];
}

    async function switchStatus(state) {
      await s_widget.setFieldValue('nextState', state);
      await s_widget.serverUpdate();
      await s_form.setValue('state', state);
      await s_form.save();
      await console.log(s_form.getDisplayValue('state'))
      await s_go.reloadWindow();
    }