cnhis-design-vue 3.1.1 → 3.1.4-beta.1

package/packages/button-print/src/ButtonPrint.vue

@@ -1,488 +0,0 @@
-<template>
-  <span @click="handleClickWrap">
-    <NDropdown
-      class="rowFoldHideBtnList-dropdown"
-      placement="bottom-start"
-      :show="state.visible"
-      @clickoutside="handleClickOutside"
-      :options="options"
-      @select="handleSelect"
-      :render-label="renderLabel"
-    >
-      <slot
-        name="button" 
-        :handleClickPrintBtn="handleClickBtn"
-        :printSpinning="state.spinning" 
-        :printbtnText="btnText"
-        :printVisible="state.visible"
-      >
-        <NButton class="dropdown-button" style="margin: 0 8px 8px 0" @click.stop="handleClickBtn">
-          <NIcon v-if="state.spinning" :component="Reload" style="line-height: 10px" />
-          {{ btnText }}
-          <NIcon :component="ChevronDown" />
-        </NButton>
-      </slot>
-    </NDropdown>
-
-    <IdentityVerification
-      v-model="state.identityVerification.visible"
-      v-bind="$attrs"
-      @success="verifiySuccess"
-    ></IdentityVerification>
-  </span>
-</template>
-
-<script lang="tsx">
-import create from '@/core/create.js';
-export default create({
-  name: "ButtonPrint"
-})
-</script>
-
-<script setup lang="tsx">
-import { ref, reactive, computed, watch, onMounted, nextTick } from 'vue'
-import { NDropdown, NButton, NIcon } from 'naive-ui'
-import { ChevronDown, Reload } from "@vicons/ionicons5";
-import { useMessage } from 'naive-ui'
-import type { DropdownOption } from 'naive-ui'
-import Print from './utils/print.es.min.js';
-import IdentityVerification from './components/IdentityVerification.vue';
-import moment from 'moment';
-// const Print:any = import.meta.globEager('./utils/print.es.min.js')['./utils/print.es.min.js'].default;
-
-(window as any).$message = useMessage()
-let printInstance: any = null;
-
-// 在.vue文件中使用导入的interface会报错，提示要使用字面量类型，当前在github上vue的issue已经有这个问题了，目前还没解决
-interface Props {
-  btnText?: string
-  printText?: string
-  previewText?: string
-  formatEditText?: string
-  identityVerificationTitle?: string
-  params?: any[],
-  prevFn?: Function
-  verifyUser?: Function
-  queryPrintFormatByNumber: Function
-  queryTemplateParams?: Function
-  strategy?: string
-  printParams?: any[]
-}
-const props = withDefaults(defineProps<Props>(), {
-  params: () => ([]),
-  btnText: '打印',
-  printText: '直接打印',
-  previewText: '打印预览',
-  formatEditText: '格式编辑',
-  identityVerificationTitle: '打印服务身份校验',
-  prevFn: () => Promise.resolve(),
-  verifyUser: () => Promise.resolve(),
-  queryPrintFormatByNumber: () => Promise.resolve({}),
-  queryTemplateParams: () => Promise.resolve({}),
-  strategy: 'MULTI',
-});
-const emit = defineEmits(['success', 'error']);
-
-const state = reactive({
-  spinning: false,
-  visible: false,
-  formatList: [],
-  templateParams: {},
-  printParams: [],
-  currentFormatId: '',
-  identityVerification: {
-    visible: false
-  },
-  isInited: false,
-  watchPrintParamsReformatFn: null,
-  spinTimer: null
-});
-const options: Array<DropdownOption> = reactive([
-  {
-    label: props.printText,
-    key: 'printText'
-  },
-  {
-    label: props.previewText,
-    key: 'previewText'
-  },
-  {
-    label: props.formatEditText,
-    key: 'formatEditText'
-  }
-]);
-
-const currentFormatItem = computed(() => {
-  if (!state.currentFormatId) return {};
-  let id = state.currentFormatId;
-  return state.formatList.find((item: any) => item.id === id);
-})
-const formatTitle = computed(() => (currentFormatItem.value as any).name || '格式选择')
-
-const renderLabel = (option: DropdownOption) => {
-  return <span class={{'active': option.key === state.currentFormatId}}>{option.label}</span>
-}
-const getTemplateIdByFormatId = (id: string | number) => {
-  let find: any = state.formatList.find((item: any) => item.id === id);
-  return find.templateId;
-}
-const callLocalServicesSuccessCb = (res: any, type: any) => {
-  let info = {
-    type,
-    formatId: state.currentFormatId,
-    templateId: getTemplateIdByFormatId(state.currentFormatId)
-  };
-  emit('success', res, info);
-}
-const callLocalServicesErrorCb = (res: any) => {
-  emit('error', res);
-}
-const prevFnError = () => {
-  let error = {
-    message: '前置条件执行错误'
-  };
-  emit('error', error);
-}
-const getPrintParams = (index: number = 0) => {
-  const params = props.printParams?.length ? props.printParams[index] : state.printParams[index];
-  return JSON.stringify(params);
-}
-const getOnceParams = () => {
-  // 聚合一条
-  let params = {};
-  let obj: any = {};
-  if ((state.templateParams as any).customizeDataset?.length) {
-    // 有模板数据
-    const key = Object.keys((state.printParams[0] as any).datasetData || {})?.[0] || '';
-    const datasetDataKeyVal = JSON.stringify(state.printParams.map((v: any) => JSON.parse(v.datasetData[key])));
-    obj = {
-      datasetData: {}
-    };
-    obj.datasetData[key] = datasetDataKeyVal;
-  } else {
-    // 无模板数据
-    Object.keys(state.printParams[0]).forEach(v => {
-      obj[v] = [];
-      state.printParams.forEach(k => {
-        obj[v].push(k[v]);
-      });
-      obj[v] = obj[v].join(',');
-    });
-  }
-  params = Object.assign({}, JSON.parse(getPrintParams(0)), obj);
-  return JSON.stringify(params);
-}
-const handleClickPrint = () => {
-  let len = state.printParams.length;
-  const callLocalServicesSuccessCbTmp = async (data: any) => {
-    try {
-      if (--len <= 0) {
-        callLocalServicesSuccessCb(data, 'print');
-      }
-    } catch (error) {
-      console.log('error', error);
-    }
-  };
-
-  props.prevFn()
-    .catch(() => {
-      prevFnError();
-      return Promise.reject();
-    })
-    .then(() => {
-      if (props.strategy === 'MULTI') {
-        // 循环多条
-        for (let i = 0; i < state.printParams.length; i++) {
-          const queryParams = {
-            formatId: state.currentFormatId,
-            templateId: getTemplateIdByFormatId(state.currentFormatId),
-            params: getPrintParams(i)
-          };
-          printInstance.printDirect(queryParams, callLocalServicesSuccessCbTmp, callLocalServicesErrorCb);
-        }
-      } else {
-        // 聚合一条
-        const queryParams = {
-          formatId: state.currentFormatId,
-          templateId: getTemplateIdByFormatId(state.currentFormatId),
-          params: getOnceParams()
-        };
-        printInstance.printDirect(
-          queryParams,
-          (res: any) => {
-            callLocalServicesSuccessCb(res, 'print');
-          },
-          callLocalServicesErrorCb
-        );
-      }
-    })
-    .finally(() => {
-      state.visible = false;
-    });
-}
-const handleClickPreview = async () => {
-  props.prevFn()
-    .catch(() => {
-      prevFnError();
-      return Promise.reject();
-    })
-    .then(() => {
-      const params = props.strategy === 'MULTI' ? getPrintParams() : getOnceParams();
-      const queryParams = {
-        formatId: state.currentFormatId,
-        templateId: getTemplateIdByFormatId(state.currentFormatId),
-        params
-      };
-      printInstance.preview(
-        queryParams,
-        (res: any) => {
-          callLocalServicesSuccessCb(res, 'preview');
-        },
-        callLocalServicesErrorCb
-      );
-    })
-    .finally(() => {
-      state.visible = false;
-    });
-}
-const handleClickEdit = () => {
-  props.prevFn()
-    .catch(() => {
-      prevFnError();
-      return Promise.reject();
-    })
-    .then(() => {
-      state.identityVerification.visible = true;
-    })
-    .finally(() => {
-      state.visible = false;
-    });
-}
-const handleSelect = (key: string) => {
-  switch(key) {
-    case 'printText':
-      handleClickPrint();
-      break;
-    case 'previewText':
-      handleClickPreview();
-      break;
-    case 'formatEditText':
-      handleClickEdit();
-      break;
-    default:
-      state.currentFormatId = key;
-      state.visible = false
-      break;
-  }
-}
-const handleClickOutside = () => {
-  state.visible = false;
-}
-const handleClickWrap = () => {
-  setTimeout(() => {
-    state.visible = true;
-  }, 0);
-}
-const setTimeoutSpin = () => {
-  (state as any).spinTimer = setTimeout(() => {
-    state.spinning = true;
-  }, 1500);
-}
-const instantiatePrintSDK = () => {
-  if (printInstance) return false;
-  printInstance = new Print();
-}
-const getDefaultFormatId = (list: any[], key: string | number) => {
-  if (!list?.length) return '';
-  let findDefault = list.find(item => item[key] == 1);
-  return findDefault?.id || list[0].id;
-}
-const setOptions = () => {
-  const children = state.formatList.map((v: any): DropdownOption => {
-    return {
-      label: v.name,
-      key: v.id
-    }
-  })
-  options.unshift({
-    label: formatTitle.value,
-    key: 'format',
-    children
-  })
-}
-const formatFormatList = (list: any[]): any => {
-  let formatList: any[] = [];
-
-  list.forEach(item => {
-    if (!item.format) return false;
-    formatList.push(...item.format);
-  });
-
-  return formatList;
-}
-const setLoaded = () => {
-  state.spinning = false;
-  if (!state.spinTimer) return false;
-  clearTimeout(state.spinTimer);
-  state.spinTimer = null;
-}
-const requestError = () => {
-  state.isInited = false;
-  setLoaded();
-  setTimeout(() => {
-    state.visible = false;
-  }, 0);
-
-  return false;
-}
-const formatDefaultVal = (i: any, tableVal?: any) => {
-  let val = i.defaultValue || '';
-  let tVal = tableVal;
-  if (i.type === 'NUMBER') {
-    tVal = Number(tableVal) || 0;
-  }
-  if (i.type === 'DATE') {
-    tVal = tableVal ? moment(tableVal).format('YYYY-MM-DD') : '';
-  }
-  if (i.type === 'DATETIME') {
-    tVal = tableVal ? moment(tableVal).format('YYYY-MM-DD HH:mm:ss') : '';
-  }
-
-  return val ? val : tVal;
-}
-const formatPrintParams = (paramObj: any, fieldList: any[], keyName: string) => {
-  const obj: any = {};
-  fieldList.forEach((i: any) => {
-    let defaultVal = formatDefaultVal(i, paramObj[i[keyName]]);
-    if (paramObj[i[keyName]] && defaultVal) {
-      obj[i[keyName]] = defaultVal;
-    }
-  });
-
-  return obj;
-}
-const formatParams = ({ customizeDataset = [], param = [] }, params: any[] = []): any => {
-  return params.map(paramObj => {
-    let res: any = {};
-
-    // 自定义结果集
-    customizeDataset.forEach((dataSetItem: any) => {
-      const selectFieldList = dataSetItem.dataSetting[0].selectFieldList;
-      res['datasetData'] = {
-        [dataSetItem.name]: JSON.stringify(formatPrintParams(paramObj, selectFieldList, 'fieldName'))
-      };
-    });
-
-    // 参数
-    res = Object.assign({}, res, formatPrintParams(paramObj, param, 'key'));
-    return res;
-  });
-}
-const initCRM = async (formatListResult: any) => {
-  state.formatList = formatListResult ? formatFormatList(formatListResult.obj) : [];
-  console.log('formatListResult', formatListResult)
-  state.currentFormatId = getDefaultFormatId(state.formatList, 'defaultFlag');
-  setOptions()
-
-  if (!state.currentFormatId) {
-    (window as any).$message.error('获取打印格式失败，请联系管理员！');
-    return requestError();
-  }
-  if (!state.currentFormatId) {
-    requestError();
-    return;
-  }
-  let templateParamsResult = (await props.queryTemplateParams())?.obj || {};
-
-  if (templateParamsResult) {
-    state.templateParams = templateParamsResult;
-  } else {
-    return requestError();
-  }
-  state.printParams = formatParams(state.templateParams, props.params);
-}
-const init = async () => {
-  if (state.isInited) return true;
-  state.isInited = true;
-
-  setTimeoutSpin();
-
-  instantiatePrintSDK();
-  const formatListResult = await props.queryPrintFormatByNumber()
-  await initCRM(formatListResult);
-
-  setLoaded();
-
-  return true;
-}
-const handleClickBtn = async () => {
-  if (!state.visible) {
-    let result = await init();
-    if (!result) return false;
-  }
-
-  state.visible = !state.visible;
-}
-const reformatPrintParams = () => {
-  state.watchPrintParamsReformatFn && (state.watchPrintParamsReformatFn as any)();
-  /*
-    还没初始化完毕时（还没获取到模板格式配置等..）
-    触发再格式化逻辑，需等待初始化完毕，再重新执行格式化
-  */
-  if (!state.isInited) {
-    (state.watchPrintParamsReformatFn as any) = () => watch(() => state.isInited, val => {
-      if (!val) return false;
-      reformatPrintParams();
-    });
-    return;
-  }
-
-  state.printParams = formatParams(state.templateParams, props.params);
-}
-const verifiySuccess = (token: string) => {
-  state.identityVerification.visible = false;
-
-  const queryParams = {
-    formatId: state.currentFormatId,
-    templateId: getTemplateIdByFormatId(state.currentFormatId),
-    params: getPrintParams(),
-    token
-  };
-  printInstance.editPrintFormat(
-    queryParams,
-    (res: any) => {
-      callLocalServicesSuccessCb(res, 'edit');
-    },
-    callLocalServicesErrorCb
-  );
-}
-    
-onMounted(() => {
-  state.isInited = false;
-})
-
-watch(() => props.params,
-  (val: any) => {
-    if (!val?.length) return false;
-    reformatPrintParams();
-  },
-  { deep: true }
-)
-
-</script>
-
-<style lang="less" scoped>
-.dropdown-button {
-  color: #212121;
-  border-color: #d5d5d5 !important;
-  margin-left: 8px;
-  margin-bottom: 8px;
-}
-</style>
-<style lang="less">
-  .rowFoldHideBtnList-dropdown {
-    .n-dropdown-menu-wrapper span.active {
-      color: #5585f5;
-    }
-  }
-</style>

package/packages/button-print/src/components/IdentityVerification.vue

@@ -1,120 +0,0 @@
-<template>
-  <NModal
-    preset="dialog"
-    :title="identityVerificationTitle"
-    class="standard-modal standard-modal-white authentication-modal"
-    :show="modelValue"
-    :close-on-esc="false"
-    :show-icon="false"
-    :style="{ width: style.width, maxHeight: style.height, overflowY: 'auto' }"
-    @after-leave="handleClickClose"
-  >
-    <div class="content">
-      <NForm class="login-form" ref="formRef" :model="form" :rules="rules">
-        <NFormItem path="account">
-          <NInput v-model:value="form.account" placeholder="请输入账号" />
-        </NFormItem>
-        <NFormItem path="password">
-          <NInput type="password" v-model:value="form.password" placeholder="请输入密码" />
-        </NFormItem>
-        <NFormItem>
-          <NButton type="primary" class="login-form-button" @click="handleClickSubmit">登录</NButton>
-        </NFormItem>
-      </NForm>
-    </div>
-  </NModal>
-</template>
-
-<script lang="ts">
-export default {
-  name: "IdentityVerificationModal"
-}
-</script>
-
-<script setup lang="ts">
-import { ref, reactive, computed, watch, onMounted, nextTick } from 'vue'
-import { NButton, NModal, NForm, NFormItem, NInput, FormRules, FormInst } from 'naive-ui'
-import { useMessage } from 'naive-ui'
-// const crypto:any = import.meta.globEager('./utils/crypto.js');
-
-(window as any).$message = useMessage()
-
-const DEFAULT_FORM = {
-  account: '',
-  password: ''
-};
-
-const props = withDefaults(defineProps<{
-  verifyUser?: Function
-  identityVerificationTitle?: string
-  modelValue: boolean
-}>(), {
-  verifyUser: () => Promise.resolve(),
-})
-
-const emit = defineEmits(['update:modelValue', 'success']);
-
-let form = reactive(JSON.parse(JSON.stringify(DEFAULT_FORM)))
-const rules: FormRules = {
-  account: { required: true, message: '请输入账号' },
-  password: { required: true, message: '请输入密码' }
-}
-const style = {
-  width: '416px',
-  height: '328px'
-}
-const formRef = ref<FormInst | null>(null)
-
-const handleClickClose = () => {
-  emit('update:modelValue', false);
-}
-const submit = async () => {
-  const { data = {} } = await props.verifyUser(form)
-  if (data.result !== 'SUCCESS') {
-    (window as any).$message.error(data.resultMsg)
-    return false
-  }
-  emit('success', data.map?.token)
-}
-const handleClickSubmit = () => {
-  formRef.value?.validate((errors) => {
-    if (!errors) {
-      submit();
-    } else {
-      console.log(errors);
-      return false;
-    }
-  });
-}
-
-onMounted(() => {
-})
-
-watch(() => props.modelValue,
-  (val: any) => {
-    if (val) return;
-    form = JSON.parse(JSON.stringify(DEFAULT_FORM));
-  }
-)
-    
-</script>
-<style lang="less" scoped>
-.login-form {
-  padding-top: 15px;
-  &:deep(.n-input) {
-    height: 50px;
-    font-size: 14px;
-    color: #757575;
-    border-radius: 6px;
-  }
-}
-.login-form-button {
-  width: 100%;
-  height: 50px;
-  background: #2d7aff;
-  border-radius: 24px;
-  border-color: #2d7aff !important;
-  font-size: 16px;
-  color: #ffffff;
-}
-</style>

package/packages/button-print/src/interfaces.ts

@@ -1,19 +0,0 @@
-export interface Props {
-  baseUrl: string
-  btnText?: string
-  printText?: string
-  previewText?: string
-  formatEditText?: string
-  identityVerificationTitle?: string
-  authorizationKey: string
-  templateNumber: number | string
-  params: any[],
-  hisParams: any
-  prevFn?: Function
-  verifyUserUrl?: string
-  getPrintFormatByNumberUrl?: string
-  getTemplateParamsUrl?: string
-  strategy?: string
-  printConfig?: any
-  versionType?: number | string
-}