free-fe-core-modules 0.0.5 → 0.0.6

package/components/Basic/BreadCrumbs.vue

@@ -9,12 +9,13 @@
     />
     <q-space></q-space>
     <q-btn v-if="meta.length > 0 && canBack"
-      flat icon="keyboard_arrow_left" @click="back">{{backText}}</q-btn>
+      flat icon="keyboard_arrow_left" @click="back">{{$t(backText)}}</q-btn>
   </q-breadcrumbs>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
+import { useRouter, useRoute } from 'vue-router'
 import { mapWritableState } from 'pinia';
 import useAppStore from '@/stores/app';
 
@@ -24,6 +25,14 @@ export default defineComponent({
     canBack: { type: Boolean, default: true },
     backText: { type: String, default: '返回' },
   },
+  setup() {
+    const router = useRouter();
+
+    return {
+      router,
+      route: useRoute(),
+    };
+  },
   data() {
     return {
       nextFlag: false,
@@ -37,11 +46,11 @@ export default defineComponent({
       let mt = [];
       if (this.crumbs && this.crumbs.length) {
         mt = this.crumbs;
-      } else if (this.$route.meta && this.$route.meta.length) {
-        mt = this.$route.meta;
+      } else if (this.route.meta && this.route.meta.length) {
+        mt = this.route.meta;
       } else {
-        for (let i = 0; i < this.$route.matched.length; i += 1) {
-          const rm = this.$route.matched[i];
+        for (let i = 0; i < this.route.matched.length; i += 1) {
+          const rm = this.route.matched[i];
           if (rm.meta && rm.meta.length) mt = rm.meta;
         }
       }
@@ -65,14 +74,14 @@ export default defineComponent({
         return;
       }
 
-      this.$router.push(this.meta[index].route);
+      this.router.push(this.meta[index].route);
       // const backIndex = this.meta.length - 1 - index;
       // window.history.go(-backIndex);
     },
     back() {
-      const URL = this.$route.fullPath.indexOf('?') === -1
-        ? this.$route.fullPath
-        : this.$route.fullPath.split('?')[0];
+      const URL = this.route.fullPath.indexOf('?') === -1
+        ? this.route.fullPath
+        : this.route.fullPath.split('?')[0];
       if (this.whiteList.indexOf(URL) === -1) {
         window.history.go(-1);
       } else {

package/components/Basic/LeveledMenus.vue

@@ -6,7 +6,7 @@
         v-if="!m.Sub || m.Sub.length <= 0"
         clickable
         class="simple"
-        :class="group"
+        :class="`${group} level_${level || 0}`"
         :to="m.Route"
         expand-icon-class="simple-expand-icon"
         :ref="`menuItem_${group}_index`"
@@ -17,7 +17,7 @@
               <q-icon class="leaf-icon" :name="m.Icon"></q-icon>
             </q-item-section>
             <q-item-section>
-              <div class="q-item__label leaf-label">{{$t(m.Label)}}</div>
+              <div class="q-item__label leaf-label">{{translate ? $t(m.Label) : m.Label}}</div>
             </q-item-section>
             <q-item-section side
               class="leaf-expand-icon">
@@ -32,10 +32,10 @@
 
       <q-expansion-item
         v-if="m.Sub && m.Sub.length > 0"
-        :value="m.Sub.filter(s => $route.fullPath.startsWith(s.Route)).length > 0"
+        :modelValue="m.Sub.filter(s => $route.fullPath.startsWith(s.Route)).length > 0"
         exact
         class="expansion"
-        :class="group"
+        :class="`${group} level_${level || 0}`"
         :dense-toggle="dense"
         expand-icon-class="expansion-icon"
         :expand-icon="expandIcon"
@@ -44,13 +44,14 @@
         :content-inset-level="inset ? insetLevel || (showIcon ? 0.6 : 0.4) : undefined"
         expand-separator
         :icon="(showIcon && m.Icon) ? m.Icon : undefined"
-        :label="$t(m.Label)"
+        :label="translate ? $t(m.Label) : m.Label"
         :to="m.Route"
         :ref="`menuItem_${group}_index`"
       >
         <leveled-menus
           :menus="m.Sub"
           :group="`${group}_${index}`"
+          :level="level + 1"
           :showIcon="showIcon"
           :insetLevel="insetLevel"
           :dense="dense"
@@ -71,6 +72,7 @@ import { defineComponent } from 'vue';
 export default defineComponent({
   name: 'LeveledMenus',
   props: {
+    level: { type: Number, default: 0 },
     group: { type: String, default: 'DEFAULT' },
     menus: { type: Array },
     showIcon: { type: Boolean, default: true },
@@ -81,7 +83,13 @@ export default defineComponent({
     leafExpandedIcon: { type: String, default: undefined },
     expandIcon: { type: String, default: undefined },
     expandedIcon: { type: String, default: undefined },
+    translate: { type: Boolean, default: false },
   },
 });
 </script>
 
+<style lang="sass">
+.leveled-menu
+  .simple-expand-icon
+    display: none
+</style>

package/components/Basic/SummaryHead.vue

@@ -76,6 +76,7 @@
 
 <script>
 import { defineComponent } from 'vue';
+import { useRouter } from 'vue-router'
 import { useObjectData, objectDataProps } from '../../composible/useObjectData';
 
 export default defineComponent({
@@ -90,10 +91,12 @@ export default defineComponent({
       data,
       refreshData,
     } = useObjectData(props, ctx);
+    const router = useRouter();
 
     return {
-      data, 
+      data,
       refreshData,
+      router,
     };
   },
   created() {
@@ -150,7 +153,7 @@ export default defineComponent({
           // if (item.route_query) rParams.query = item.route_query;
           // if (item.route_params) rParams.params = item.route_params;
 
-          this.$router.push(item.route);
+          this.router.push(item.route);
         }
       });
     },

package/components/Dialog/BasicDialog.vue

@@ -66,6 +66,8 @@
             :Field="field"
             :values="fieldsData"
             ref="fieldsToValid"
+            @cancel="btnCancel"
+            @ok="onOKClick"
             @input="onInputFieldInput(field)"
           ></free-field>
         </div>
@@ -75,7 +77,7 @@
       <q-card-actions
         align="center"
         class="action-buttons full-width absolute"
-        v-if="canOK || canCancel"
+        v-if="(canOK || canCancel) && !hideActions"
       >
         <q-btn
           :label="cancelText"
@@ -126,6 +128,7 @@ export default defineComponent({
     needText: { type: Boolean, default: false },
     text_label: { type: String, default: '' },
     max_text_length: { type: Number, default: 100 },
+    hideActions: { type: Boolean, default: false },
     canOK: { type: Boolean, default: true },
     canCancel: { type: Boolean, default: false },
     canClose: { type: Boolean, default: false },
@@ -205,7 +208,6 @@ export default defineComponent({
     // following method is REQUIRED
     // (don't change its name --> "show")
     show() {
-      // debugger
       this.$refs.dialog.show();
       this.timeout_counter();
 

package/components/FloatingWindow/index.vue

@@ -15,6 +15,7 @@
 
 <script>
 import { defineComponent } from 'vue';
+import { useRouter } from 'vue-router'
 
 export default defineComponent({
   name: 'FloatingWindow',
@@ -24,6 +25,13 @@ export default defineComponent({
     onlyIn: { type: Array, default: () => [] },
     top: { type: Number, default: 0 },
   },
+  setup() {
+    const router = useRouter();
+
+    return {
+      router,
+    };
+  },
   data() {
     return {
       x: 150,
@@ -53,7 +61,7 @@ export default defineComponent({
         if (/^(http|https):\/\/.*/.test(this.url)) {
           window.open(this.url);
         } else {
-          this.$router.push(this.url);
+          this.router.push(this.url);
         }
       }
     },

package/components/SlidingCarousel/index.vue

@@ -27,6 +27,7 @@
 
 <script>
 import { defineComponent } from 'vue';
+import { useRouter } from 'vue-router'
 import { useObjectData, objectDataProps } from '../../composible/useObjectData';
 
 export default defineComponent({
@@ -48,9 +49,11 @@ export default defineComponent({
       refreshData,
     } = useObjectData(props, ctx);
 
+    const router = useRouter();
     return {
-      data, 
+      data,
       refreshData,
+      router,
     };
   },
   data() {
@@ -77,7 +80,7 @@ export default defineComponent({
         // window.location.href = l;
           window.open(carouse.url);
         } else {
-          this.$router.push(carouse.url);
+          this.router.push(carouse.url);
         }
       }
     },

package/components/SlidingNews/index.vue

@@ -2,7 +2,7 @@
   <div
     v-if="visible"
     class="row full-width sliding-news justify-center"
-    :class="(data && data.length) ? '' : 'empty'"
+    :class="(localData.length) ? '' : 'empty'"
   >
     <span class="sliding-news-label row items-center">
       <e-icon
@@ -26,23 +26,19 @@
       vertical
     >
       <q-carousel-slide
-        v-for="(carouse, index) in data"
+        v-for="(carouse, index) in localData"
         :key="index"
         :name="index"
         @click="newsClicked(carouse)"
         style="cursor: pointer; padding: 0; margin: 0;"
       >
-        <div class="row items-center justify-center full-height">
-          <span class="sliding-news-title">{{carouse.Title}}</span>
+        <div class="row no-wrap items-center justify-center full-height">
+          <div class="sliding-news-title col ellipsis">{{carouse.title}}</div>
           <q-space />
-          <span class="float-right sliding-news-right">
-            <span
-              class="sliding-news-date"
-              :style="`line-height: ${heightString}`"
-            >
+          <div class="sliding-news-right"
+            :style="`line-height: ${heightString}`">
               {{filter('normalDate',(carouse.PublishDate || carouse.LastUpdateDate))}}
-            </span>
-          </span>
+          </div>
         </div>
       </q-carousel-slide>
     </q-carousel>
@@ -65,6 +61,7 @@
 </template>
 
 <script>
+import { useRouter, useRoute } from 'vue-router'
 import { defineComponent } from 'vue';
 import { useObjectData, objectDataProps } from '../../composible/useObjectData';
 
@@ -72,6 +69,13 @@ export default defineComponent({
   name: 'SlidingNews',
   props: {
     ...objectDataProps,
+    fields: {
+      type: Object,
+      default: () => ({
+        title: 'Title',
+        date: 'LastUpdateDate'
+      }),
+    },
     interval: { type: Number, default: 3000 },
     height: { type: String, default: '40px' },
     width: { type: String, default: '100%' },
@@ -88,10 +92,13 @@ export default defineComponent({
       data,
       refreshData,
     } = useObjectData(props, ctx);
+    const router = useRouter();
 
     return {
-      data, 
+      data,
       refreshData,
+      router,
+      route: useRoute(),
     };
   },
   data() {
@@ -113,24 +120,26 @@ export default defineComponent({
       return this.height;
     },
   },
-  // watch: {
-  //   visible() {
-  //     if (!this.visible) {
-  //       clearInterval(this.timer);
-  //     }
-  //   },
-  // },
-  // created() {
-  //   this.timer = setInterval(this.carouselNext, this.interval);
-  // },
+  localData() {
+    const fks = Object.keys(this.fields || {});
+    return (this.data || []).map((dd) => {
+      const ret = {};
+      for (let i = 0; i < fks.length; i += 1) {
+        const fk = fks[i];
+        ret[fk] = dd[this.fields[fk]];
+      }
+
+      return { ...dd, ...ret };
+    });
+  },
   methods: {
     newsClicked(news) {
       let url = '';
       if (news.url) url += news.url;
       else if (this.url) url += `${this.url}${news.id || ''}`;
 
-      if (url && this.$route.fullPath !== url) {
-        this.$router.push({ path: url });
+      if (url && this.route.fullPath !== url) {
+        this.router.push({ path: url });
       }
     },
     // carouselNext() {

package/free-field/Fields/Category.js

@@ -1,4 +1,5 @@
 import { defineComponent, h } from 'vue';
+import { freeFieldProps } from '../composible/useFreeField';
 
 export default defineComponent({
   name: 'InputFieldCategory',
@@ -9,7 +10,7 @@ export default defineComponent({
     Description: '',
   },
   props: {
-    Field: { type: Object },
+    ...freeFieldProps,
   },
   methods: {
   },

package/free-field/Fields/Check.js

@@ -76,6 +76,7 @@ export default defineComponent({
     if (!props.Field) return {};
 
     const { fieldData, setFieldData } = useFreeField(props);
+    fieldData.value = fieldData.value || false;
 
     const before = (props.Field.showLabel && !props.Field.dense && props.Field.Label !== void 0) ? () => h(freeFieldLabel, {
       Field: props.Field,

package/free-field/Fields/DynamicList.js

@@ -463,7 +463,8 @@ export default defineComponent({
     );
 
     const bodyCell = (slotProps) => {
-      fieldsToValidate.value = slotProps.col?.List?.length > 1 ? slotProps.col.List.map((col) =>
+      const fields = ref([]);
+      fields.value = slotProps.col?.List?.length > 1 ? slotProps.col.List.map((col) =>
         h(FreeField, {
           Field: columnField(col, true, slotProps.col),
           values: slotProps.row,
@@ -478,7 +479,11 @@ export default defineComponent({
           onInput: cellChanged,
         }),
       ];
-      
+
+      // add fields from the current cell to validate list
+      fieldsToValidate.value.push(...fields.value);
+
+
       if (slotProps.col.name === "listActions") {
         return h(QTd, null, {
           default: () =>
@@ -503,15 +508,13 @@ export default defineComponent({
             rowspan: slotProps.value ? slotProps.value.rowspan || "1" : "1",
             class: "items-center justify-center",
           },
-          [
-            h(
-              "span",
-              {
-                class: "full-height full-width",
-              },
-              fieldsToValidate.value,
-            )
-          ]
+          () => h(
+            "span",
+            {
+              class: "full-height full-width",
+            },
+            fields.value,
+          )
         );
       }
     };

package/free-field/Fields/TimeRange.vue

@@ -96,7 +96,7 @@
 </template>
 
 <script>
-import { defineComponent, ref, getCurrentInstance } from 'vue';
+import { defineComponent, ref, getCurrentInstance, watch, watchEffect, computed } from 'vue';
 import { useFreeField, freeFieldProps } from '../composible/useFreeField';
 import { useFormValidator} from '../../composible/useFormValidator';
 
@@ -300,7 +300,7 @@ export default defineComponent({
     const objOptions = computed(() => props.Field.Options || undefined);
 
     const timeOptions = computed(() => {
-      if (objOptions.values) return undefined;
+      if (objOptions.value) return undefined;
 
       if (!props.Field.MinValue && !props.Field.MaxValue) {
         return undefined;
@@ -349,6 +349,8 @@ export default defineComponent({
     })
 
     return {
+      min,
+      max,
       fieldData,
       locale,
 

package/free-field/composible/freeFieldLabel.js

@@ -1,4 +1,5 @@
 import { defineComponent, h } from 'vue';
+import { QTooltip } from 'quasar';
 
 export default defineComponent({
   name: 'FreeFieldLabel',
@@ -6,13 +7,19 @@ export default defineComponent({
     Field: { type: Object },
   },
   setup(props){
+    if (!props.Field) return () => null;
+
     return () => (props.Field?.Label === void 0) ? null : h('span', {
-      class:`field-label field-label-readonly ${(props.Field.Label && props.Field.Label.trim().length)
-          ? '' : 'field-label-empty'} ${props.Field.Required ? 'required' : ''}`,
+      class: {
+        'field-label': true,
+        'field-label-readonly': props.Field.ReadOnly,
+        'field-label-empty': props.Field.Label?.trim().length <= 0,
+        required: props.Field.Required,
+      },
     }, [
       props.Field.Description && h(QTooltip, {
         anchor: "top right",
-      }, props.Field.Description),
+      }, () => props.Field.Description),
       props.Field.Label || '',
       props.Field.Required && h('span', {
         class: 'required-mark',

package/index.js

@@ -1,5 +1,7 @@
-import { date } from 'quasar';
+
+import { date as quasarDate } from 'quasar';
 import config from '@/config';
+import useAppStore from '@/stores/app';
 import MsgDialog from './components/Dialog/index';
 
 import EIcon from './components/Basic/EIcon.vue';
@@ -20,12 +22,29 @@ import routers from './router';
 
 // global filters
 const filters = {
-  serverImage: url => (url ? `${config.imageUrlBase}${url}` : ''),
-  serverVideo: url => (url ? `${config.videoUrlBase}${url}` : ''),
-  serverThumb: url => (url ? `${config.thumbUrlBase}${url}` : ''),
-  serverDocument: url => (url ? `${config.documentUrlBase}${url}` : ''),
+  serverImage: (url) => {
+    if (typeof url === 'string' && url.startsWith('@')) return url.substring(1);
+
+    return url ? `${config.imageUrlBase}${url}` : '';
+  },
+  serverVideo: (url)  => {
+    if (typeof url === 'string' && url.startsWith('@')) return url.substring(1);
+
+    return url ? `${config.videoUrlBase}${url}` : '';
+  },
+  serverThumb: (url)  => {
+    if (typeof url === 'string' && url.startsWith('@')) return url.substring(1);
+
+    return url ? `${config.thumbUrlBase}${url}` : '';
+  },
+  serverDocument: (url)  => {
+    if (typeof url === 'string' && url.startsWith('@')) return url.substring(1);
+
+    return url ? `${config.documentUrlBase}${url}` : '';
+  },
   serverPath: (url) => {
     if (!url) return '';
+    if (typeof url === 'string' && url.startsWith('@')) return url.substring(1);
 
     const dotIndex = url.lastIndexOf('.');
     const ext = url.substring(dotIndex, url.length).toLowerCase();
@@ -100,117 +119,143 @@ const filters = {
     return filters.padding((date.getDate()));
   },
   ago: (d) => {
-    let date1 = new Date();
-    let date2 = new Date(d);
+    const date1 = new Date();
+    const date2 = new Date(d);
 
-    let diff = date.getDateDiff(date1, date2, 'seconds');
+    let diff = quasarDate.getDateDiff(date1, date2, 'seconds');
     if (diff < 1) {
-      return diff + this.$t('justNow');
-    } else if (diff < 60) {
-      return diff + this.$t('secondsAgo');
+      return diff + Vue.prototype.$t('justNow');
+    } if (diff < 60) {
+      return diff + Vue.prototype.$t('secondsAgo');
     }
 
-    diff = date.getDateDiff(date1, date2, 'minutes');
+    diff = quasarDate.getDateDiff(date1, date2, 'minutes');
     if (diff < 60) {
-      return diff + this.$t('minutesAgo');
+      return diff + Vue.prototype.$t('minutesAgo');
     }
 
     if (diff < 24) {
-      return diff + this.$t('hoursAgo');
+      return diff + Vue.prototype.$t('hoursAgo');
     }
 
-    diff = date.getDateDiff(date1, date2, 'days');
+    diff = quasarDate.getDateDiff(date1, date2, 'days');
     if (diff < 31) {
-      return diff + this.$t('daysAgo');
+      return diff + Vue.prototype.$t('daysAgo');
     }
 
-    diff = date.getDateDiff(date1, date2, 'months');
+    diff = quasarDate.getDateDiff(date1, date2, 'months');
     if (diff < 13) {
-      return diff + this.$t('monthsAgo');
+      return diff + Vue.prototype.$t('monthsAgo');
     }
 
-    diff = date.getDateDiff(date1, date2, 'years');
-    return diff + this.$t('yearsAgo');
+    diff = quasarDate.getDateDiff(date1, date2, 'years');
+    return diff + Vue.prototype.$t('yearsAgo');
   },
 };
 
 export default (app, root) => {
   root.use(MsgDialog);
 
+  const appStore = useAppStore();
+
   return {
     config: {
       backendDependencies: ["core-modules"],
       dictFields: [
         {
-          Type: "Category",
-          Label: "字典数据信息",
-        },
-        {
-          Name: "Index",
-          Label: "排序号",
-          Type: "Number",
+          Type: 'Category',
+          Label: '字典数据信息',
         },
         {
-          Name: "Name",
-          Label: "数据名称",
-          Type: "String",
-        },
-        {
-          Name: "Label",
-          Label: "显示名称",
-          Type: "String",
+          Name: 'Index',
+          Label: '排序号',
+          Type: 'Number',
         },
         {
-          Name: "Description",
-          Label: "说明",
-          Type: "Text",
+          Name: 'Name',
+          Label: '数据名称',
+          Type: 'String',
         },
+        // {
+        //   Name: 'Label',
+        //   Label: '显示名称',
+        //   Type: 'String',
+        // },
+        // {
+        //   Name: 'Description',
+        //   Label: '说明',
+        //   Type: 'Text',
+        // },
         {
-          Name: "Type",
-          Label: "类型",
-          Type: "Select",
-          Options: [
-            {
-              Label: "普通类型",
-              Value: "String",
-            },
+          Name: 'Labels',
+          Type: 'Tabs',
+          Label: '显示内容',
+          DataType: 'Array',
+          Default: [
             {
-              Label: "文件",
-              Value: "File",
+              Locale: appStore.locale || app.config.defaultLocale,
             },
           ],
+          Options: {
+            Dense: true,
+            LabelField: 'Name',
+            ValueField: 'Locale',
+            List: [
+              {
+                Name: 'Locale',
+                Label: '语言',
+                Type: 'String',
+                ReadOnly: true,
+              },
+              {
+                Name: 'Label',
+                Label: '显示名称',
+                Type: 'String',
+              },
+              {
+                Name: 'Description',
+                Label: '说明',
+                Type: 'Text',
+              },
+            ],
+          },
         },
         {
-          Name: "Value",
-          Label: "值",
-          Type: "String",
+          Name: 'Type',
+          Label: '类型',
+          Type: 'Select',
+          Options: [{
+            Label: '普通类型',
+            Value: 'String',
+          }, {
+            Label: '文件',
+            Value: 'File',
+          }],
         },
         {
-          Name: "Image",
-          Label: "图片/图标/文件",
-          Type: "File",
-          MaxValue: "100m",
-          Options: {
-            Dense: false,
-            AsLink: false,
-            Ext: "jpg,png,pdf,doc,docx,zip",
-          },
-          Tips: [
-            {
-              Text: "文件不可超过100M。格式支持：PNG、JPG、PDF、DOC、DOCX、ZIP。",
-            },
-          ],
+          Name: 'Value',
+          Label: '值',
+          Type: 'String',
         },
         {
-          Type: "Category",
-          Label: "高级设置",
+          Name: 'Image',
+          Label: '图片/图标/文件',
+          Type: 'File',
+          MaxValue: '100m',
+          Options: { Dense: false, AsLink: false, Ext: 'jpg,png,pdf,doc,docx,zip' },
+          Tips: [{
+            Text: '文件不可超过100M。格式支持：PNG、JPG、PDF、DOC、DOCX、ZIP。',
+          }],
         },
         {
-          Name: "Info",
-          Label: "附加信息",
-          Type: "Text",
+          Type: 'Category',
+          Label: '高级设置',
         },
-      ],
+        {
+          Name: 'Info',
+          Label: '附加信息',
+          Type: 'Text',
+        }],
       menuFields: [
         {
           Type: "Category",
@@ -275,29 +320,29 @@ export default (app, root) => {
       LeveledMenus,
       BreadCrumbs,
       ThemeSwitch,
-      ...FieldComponents.components,
       Mourning,
+      ...FieldComponents.components,
     },
     fieldComponents: FieldComponents.fieldComponents,
 
     validators: {
       validatorNotEmpty: (d) =>
-        d !== undefined && d.length > 0 && d.trim().length > 0,
+        d && d.length > 0 && d.trim().length > 0,
       validatorMobilePhone: (d) =>
-        /^(0|86|17951)?(13[0-9]|14[0-9]|15[0-9]|16[0-9]|17[0-9]|18[0-9]|19[0-9])[0-9]{8}$/.test(
+        !d || /^(0|86|17951)?(13[0-9]|14[0-9]|15[0-9]|16[0-9]|17[0-9]|18[0-9]|19[0-9])[0-9]{8}$/.test(
           d
         ),
       validatorEmail: (d) =>
-        /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
+        !d || /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
           d
         ),
       validatorPhoneOrEmail: (d) =>
-        d !== undefined &&
+        d !== void 0 &&
         d.length > 0 &&
-        (this.validatorPhone(d) || this.validatorEmail(d)),
+        (this.validatorMobilePhone(d) || this.validatorEmail(d)),
       // validatorMinLength: (d, len = 0) => d !== undefined && d.length >= len,
       validatorChinaIDNumber: (d) =>
-        /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test(
+        !d || /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/.test(
           d
         ),
       // validatorSame: (d, to) => d === to,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "free-fe-core-modules",
-  "version": "0.0.5",
+  "version": "0.0.6",
   "main": "index.js",
   "repository": "git@gitlab.com:eis-base/modules/free-fe-core-modules.git",
   "author": "zhiquan",

package/view/dict/index.vue

@@ -16,7 +16,7 @@
           style="border-bottom: solid 1px grey;"
         >
           <div>
-            {{ prop.node.Label }}
+            {{ dictLabel(prop.node) }}
             <span
               v-if="prop.node.level === 1 && prop.node.Name"
               class="dictionary-data-name"
@@ -78,11 +78,29 @@
         </div>
       </template>
     </q-tree>
+
+    <div class="row items-center justify-center q-my-md" v-if="canImport">
+      <q-btn flat @click="exportTranslates" class="btn-primary q-mr-md">导出翻译</q-btn>
+      <q-btn flat @click="importTranslates" class="btn-primary">导入翻译</q-btn>
+
+      <div class="row full-width q-mt-md">
+        <q-input v-if="showImportTextArea"
+          class="full-width"
+          type="textarea"
+          autogrow
+          v-model="importText"
+          placeholder="请输入要导入的内容(tab键分割)，如：
+    xxx类型 类型一  en-us Type One
+    xxx类型 类型二  en-us Type Two"></q-input>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
 import { defineComponent } from 'vue';
+import { copyToClipboard } from 'quasar';
+import { requests } from '@/boot/axios';
 import { useObjectData, objectDataProps } from '../../composible/useObjectData';
 
 export default defineComponent({
@@ -98,6 +116,9 @@ export default defineComponent({
       selectedDictNode: {},
       editingDict: {},
       dictFields: [],
+      canImport: false,
+      importText: '',
+      showImportTextArea: false,
     };
   },
   setup(props, ctx) {
@@ -124,9 +145,26 @@ export default defineComponent({
       }
     },
   },
+  beforeCreate() {
+    requests.canI('dict/import').then((r) => {
+      if (r) {
+        this.canImport = true;
+      }
+    });
+  },
   created() {
     this.dictFields = this.getModule('core-modules').config.dictFields;
   },
+  computed: {
+    dictLabel() {
+      return (d) => {
+        if (!d || !d.Labels) return '';
+
+        const lb = d.Labels.find((l) => l.Locale === this.$i18n.locale );
+        return lb && lb.Label;
+      }
+    }
+  },
   methods: {
     loadSubDicts({ key, done, node /* , fail */ }) {
       this.GetData(key, node.level)
@@ -153,6 +191,27 @@ export default defineComponent({
       }
     },
     editNode(n) {
+      if (!n) return;
+
+      n.Labels = n.Labels || [];
+      // check labels according to the locales
+      const locales = this.ctx.config.locales || [];
+      for(let i = 0; i < locales.length; i += 1) {
+        const locale = locales[i];
+        const existsLabel = n.Labels.find((l) => l.Locale === locale.locale);
+
+        if (!existsLabel) {
+          n.Labels.push({
+            Label: '',
+            Locale: locale.locale,
+            Description: '',
+            Name: locale.name,
+          });
+        } else {
+          existsLabel.Name = locale.name;
+        }
+      }
+
       if (this.selectedDictNode && this.selectedDictNode.id === n.id) {
         this.selectedDictNode = {};
         this.editingDict = {};
@@ -276,6 +335,31 @@ export default defineComponent({
         this.onCancelClick();
       }
     },
+    importTranslates() {
+      if (!this.showImportTextArea) {
+        this.showImportTextArea = true;
+        this.importText = '';
+      } else {
+        // do the i
+        this.postRequest('/dict/import/trans', {c: this.importText}).then((d) => {
+          const data = d && d.data;
+          if (d && d.msg === 'OK') {
+            this.$q.notify('导入成功！');
+          }
+        });
+      }
+    },
+    exportTranslates() {
+      this.showImportTextArea = false;
+      this.getRequest('/dict/export/trans').then((d) => {
+        const data = (d && d.data) || {};
+
+        if (d.data.c) {
+          copyToClipboard(d.data.c);
+          this.$q.notify('已拷贝到剪切板，可直接粘贴至excel等工具！');
+        }
+      });
+    },
   },
 });
 </script>

package/view/mourning/mourning.vue

@@ -8,6 +8,9 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'mourningNode',
+  setup() {
+    return {};
+  },
   mounted() {
     const mourningStore = useMourningStore();
 
@@ -18,8 +21,9 @@ export default defineComponent({
       }
       mourningStore.mourning = inMourning;
 
-      let classes = this.$root.$el.className.split(' ').filter((c) => !!c);
-
+      let bodyElem = document.getElementsByTagName('html')[0];
+      let classes = bodyElem.className.split(' ').filter((c) => !!c);
+    
       if (inMourning) {
         classes.push('mourning-site');
       } else {
@@ -27,19 +31,20 @@ export default defineComponent({
         classes = classes.filter((c) => c.trim() !== 'mourning-site');
       }
 
-      this.$root.$el.className = classes.join(' ');
+      bodyElem.className = classes.join(' ');
     });
   },
 });
 </script>
 
-<style lang="sass">
-.mourning-site
-  -webkit-filter: grayscale(100%)
-  -moz-filter: grayscale(100%)
-  -ms-filter: grayscale(100%)
-  -o-filter: grayscale(100%)
-  filter: grayscale(100%)
-  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)
-  filter: gray
+<style lang="scss">
+.mourning-site {
+  -webkit-filter: grayscale(100%);
+  -moz-filter: grayscale(100%);
+  -ms-filter: grayscale(100%);
+  -o-filter: grayscale(100%);
+  filter: grayscale(100%);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
+  filter: gray;
+}
 </style>