easybill-ui 1.1.6 → 1.1.8

package/components/ConstantStatus/index.ts

@@ -1,5 +1,5 @@
 import { withInstall } from "../../utils"
 import Instance from "./src"
-export const ConstantStatus = withInstall(Instance)
+export const ConstantStatus = withInstall("ConstantStatus", Instance)
 export default ConstantStatus
 export * from "./src/types"

package/components/CurdForm/index.ts

@@ -1,8 +1,8 @@
 import { withInstall, type SFCWithInstall } from "../../utils"
+import Instance from "./src/CurdForm.vue"
 import FormItem from "./src/CurdFormItem.vue"
-import Instance from "./src/index"
-export const CurdForm: SFCWithInstall<typeof Instance> = withInstall(Instance)
-export const CurdFormItem: SFCWithInstall<typeof FormItem> = withInstall(FormItem)
+export const CurdForm: SFCWithInstall<typeof Instance> = withInstall("CurdForm", Instance)
+export const CurdFormItem: SFCWithInstall<typeof FormItem> = withInstall("CurdFormItem", FormItem)
 export default CurdForm as SFCWithInstall<typeof Instance>
 export * from "./src/directive"
 export * from "./src/hooks"

package/components/CurdForm/src/CurdForm.vue

@@ -50,7 +50,7 @@ const props = defineProps({
   },
 })
 
-const emit = defineEmits(['update:modelValue', 'change'])
+const emit = defineEmits(["update:modelValue", "change"])
 
 const schemaFormRef = ref<InstanceType<typeof ElForm> | undefined>()
 const sFormSchema = ref(props.formSchema)
@@ -156,7 +156,7 @@ const onChange = (formModel: Fields, formItem: FormItemType) => {
   emit("change", formModel, formItem)
 }
 const getFormItemStyle = (formItem: FormItemType) => {
-  if (!formItem.span) return ""
+  if (!formItem.span) return "el-form-item-full"
   return "el-form-item-" + formItem.span
 }
 const getFormItemProps = (formItem: FormItemType) => {
@@ -173,7 +173,7 @@ const getFormStyle = () => {
   const gutter = props.formSchema.gutter
   if (gutter) {
     const guPx = +parseFloat(String(gutter))
-    return { marginLeft: -guPx + "px", marginRight: -guPx + "px" }
+    return { "--curd-form-gutter": guPx + "px" }
   }
   return {}
 }

package/components/CurdForm/src/components/schema-form-checkbox.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="schema-form-radio">
     <div v-if="formItem.loading" class="loading" style="color: #999; font-size: 12px">
-      <el-icon class="is-loading"><Loading /></el-icon> 加载中...
+      <el-icon class="is-loading"><Loading /></el-icon> {{ t("el.form.loading") }}
     </div>
     <el-checkbox-group v-if="!formItem.loading && formItem.options && formItem.options.length" v-model="model" :class="[props?.showType]" style="width: 100%" v-bind="props" v-on="eventObject">
       <template v-for="option in formItem.options" :key="option.value">
@@ -12,7 +12,7 @@
     <div v-if="!formItem.loading && !formItem.options?.length" class="empty">
       <component :is="empty" v-if="empty" :form-model="formModel" :form-item="formItem" :props="props" />
       <template v-else>
-        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || "暂无数据" }}</span>
+        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || t("el.form.nodata") }}</span>
       </template>
     </div>
   </div>
@@ -21,6 +21,7 @@
 import { Loading, Warning } from "@element-plus/icons-vue"
 import { ElCheckbox, ElCheckboxButton, ElCheckboxGroup, ElIcon } from "element-plus"
 import { computed, defineComponent, type PropType, toRaw } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import { FormItemProps } from "../types"
 export default defineComponent({
   name: "SchemaFormCheckbox",
@@ -41,10 +42,12 @@ export default defineComponent({
     if (!(model.value instanceof Array)) {
       model.value = []
     }
+    const { t } = useLocale()
 
     return {
       model,
       empty: toRaw(props.props.empty) || "",
+      t,
     }
   },
 })

package/components/CurdForm/src/components/schema-form-date-picker.vue

@@ -1,9 +1,10 @@
 <template>
-  <el-date-picker v-model="model" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) as string || '请选择' + formItem.label" v-on="eventObject"> </el-date-picker>
+  <el-date-picker v-model="model" type="date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" :placeholder="t('el.form.pleaseSelect', [formItem.label || ''])" v-bind="props" v-on="eventObject"> </el-date-picker>
 </template>
 <script lang="ts">
 import { ElDatePicker, type ModelValueType } from "element-plus"
 import { computed, defineComponent, type PropType } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import { FormItemProps } from "../types"
 export default defineComponent({
   name: "SchemaFormDatePicker",
@@ -21,9 +22,11 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val),
     })
+    const { t } = useLocale()
 
     return {
       model,
+      t,
     }
   },
 })

package/components/CurdForm/src/components/schema-form-input.vue

@@ -1,28 +1,20 @@
 <template>
-  <el-input v-model="model" v-trim :disabled="formItem.disabled || false" v-bind="props" :placeholder="(props.placeholder && String(props.placeholder)) as string || '请输入' + (props.label || formItem.label || '')" autocomplete="new-password" v-on="eventObject" />
+  <el-input v-model="model" v-trim :disabled="formItem.disabled || false" :placeholder="t('el.form.pleaseInput', [formItem.label || ''])" v-bind="props.props" autocomplete="new-password" v-on="eventObject" />
 </template>
-<script lang="ts">
+<script lang="ts" setup>
 import { ElInput } from "element-plus"
-import { computed, defineComponent } from "vue"
+import { computed } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import { directives } from "../directive"
 import { FormItemProps } from "../types"
-export default defineComponent({
-  name: "SchemaFormInput",
-  components: { ElInput },
-  directives: {
-    ...directives,
-  },
-  props: FormItemProps,
-  emits: ["update:modelValue"],
-  setup(props, { emit }) {
-    const model = computed({
-      get: () => props.modelValue,
-      set: (val) => emit("update:modelValue", val),
-    })
-
-    return {
-      model,
-    }
-  },
+const vTrim = directives.trim
+const props = defineProps({
+  ...FormItemProps,
 })
+const emit = defineEmits(["update:modelValue"])
+const model = computed({
+  get: () => props.modelValue,
+  set: (val) => emit("update:modelValue", val),
+})
+const { t } = useLocale()
 </script>

package/components/CurdForm/src/components/schema-form-radio.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="schema-form-radio">
     <div v-if="formItem.loading" class="loading" style="color: #999; font-size: 12px">
-      <el-icon class="is-loading"><Loading /></el-icon> 加载中...
+      <el-icon class="is-loading"><Loading /></el-icon> {{ t("el.form.loading") }}
     </div>
     <el-radio-group v-if="!formItem.loading && formItem.options && formItem.options.length" v-model="model" :class="[props?.showType]" v-bind="props" v-on="eventObject">
       <template v-for="option in formItem.options" :key="option.value">
@@ -20,7 +20,7 @@
     <div v-if="!formItem.loading && !formItem.options?.length" class="empty">
       <component :is="empty" v-if="empty" :form-model="formModel" :form-item="formItem" :props="props" />
       <template v-else>
-        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || "暂无数据" }}</span>
+        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || t("el.form.nodata") }}</span>
       </template>
     </div>
   </div>
@@ -29,6 +29,7 @@
 import { Loading, Warning } from "@element-plus/icons-vue"
 import { ElIcon, ElRadio, ElRadioButton, ElRadioGroup } from "element-plus"
 import { computed, defineComponent, toRaw } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import FormTooltip from "../FormTooltip.vue"
 import { FormItemProps } from "../types"
 export default defineComponent({
@@ -47,9 +48,11 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val),
     })
+    const { t } = useLocale()
     return {
       model,
       empty: toRaw(props.props.empty) || "",
+      t,
     }
   },
 })

package/components/CurdForm/src/components/schema-form-select.vue

@@ -1,7 +1,7 @@
 <template>
-  <el-select v-model="model" style="width: 100%" :loading="formItem.loading || loading" :placeholder="'请选择' + formItem.label" v-bind="props" v-on="eventObject">
-    <el-option v-if="props.all && !props.multiple" value="" label="全部"></el-option>
-    <el-checkbox v-if="props.all && props.multiple" v-model="checked" label="全选" class="schema-form-select-check" />
+  <el-select v-model="model" style="width: 100%" :loading="formItem.loading || loading" :placeholder="t('el.form.pleaseSelect', [formItem.label || ''])" v-bind="props" v-on="eventObject">
+    <el-option v-if="props.all && !props.multiple" value="" :label="t('el.form.all')"></el-option>
+    <el-checkbox v-if="props.all && props.multiple" v-model="checked" :label="t('el.form.allSelect')" class="schema-form-select-check" />
     <template v-for="option in list" :key="option.value">
       <el-option :value="option.value" :label="option.label" :disabled="option.disabled">
         <div v-if="option.html" v-html="option.html"></div>
@@ -13,6 +13,7 @@
 <script lang="ts">
 import { ElCheckbox, ElOption, ElSelect } from "element-plus"
 import { computed, defineComponent, onMounted, ref, watch } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import type { CurdFormOptionItem } from "../types"
 import { FormItemProps } from "../types"
 export default defineComponent({
@@ -31,6 +32,7 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val),
     })
+    const { t } = useLocale()
     const checked = computed({
       get() {
         return Array.isArray(model.value) && model.value.length && props.formItem?.options?.every((item) => Array.isArray(model.value) && model.value?.includes(item.value))
@@ -82,6 +84,7 @@ export default defineComponent({
       selectProps,
       list,
       loading,
+      t,
     }
   },
 })

package/components/CurdForm/src/components/schema-form-time-picker.vue

@@ -1,9 +1,10 @@
 <template>
-  <el-time-picker v-model="model" v-bind="props" :placeholder="(formItem.props && props.placeholder && String(props.placeholder)) as string || '请选择' + formItem.label" v-on="eventObject"> </el-time-picker>
+  <el-time-picker v-model="model" :placeholder="t('el.form.pleaseSelect', [formItem.label || ''])" v-bind="props" v-on="eventObject"> </el-time-picker>
 </template>
 <script lang="ts">
 import { ElTimePicker, type ModelValueType } from "element-plus"
 import { computed, defineComponent, type PropType } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import { FormItemProps } from "../types"
 export default defineComponent({
   name: "SchemaFormTimePicker",
@@ -21,9 +22,11 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val),
     })
+    const { t } = useLocale()
 
     return {
       model,
+      t,
     }
   },
 })

package/components/CurdForm/src/components/schema-form-tree-select.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="schema-form-radio">
     <div v-if="formItem.loading" class="loading" style="color: #999; font-size: 12px">
-      <el-icon class="is-loading"><Loading /></el-icon> 加载中...
+      <el-icon class="is-loading"><Loading /></el-icon> {{ t("el.form.loading") }}
     </div>
     <el-tree-select v-if="!formItem.loading && formItem.options && formItem.options.length" v-model="model" :class="[props?.showType]" style="width: 100%" :data="formItem.options" v-bind="props" v-on="eventObject"> </el-tree-select>
     <div v-if="!formItem.loading && !formItem.options?.length" class="empty">
       <component :is="empty" v-if="empty" :form-model="formModel" :form-item="formItem" :props="props" />
       <template v-else>
-        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || "暂无数据" }}</span>
+        <el-icon><Warning /></el-icon> <span>{{ props.noDataText || t("el.form.nodata") }}</span>
       </template>
     </div>
   </div>
@@ -16,6 +16,7 @@
 import { Loading, Warning } from "@element-plus/icons-vue"
 import { ElIcon, ElTreeSelect } from "element-plus"
 import { computed, defineComponent, toRaw } from "vue"
+import { useLocale } from "../../../../utils/hooks/useLocal"
 import { FormItemProps } from "../types"
 export default defineComponent({
   name: "SchemaFormTreeSelect",
@@ -33,10 +34,12 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (val) => emit("update:modelValue", val),
     })
+    const { t } = useLocale()
 
     return {
       model,
       empty: toRaw(props.props.empty) || "",
+      t,
     }
   },
 })

package/components/CurdTable/index.ts

@@ -1,5 +1,5 @@
 import { withInstall, type SFCWithInstall } from "../../utils"
-import Instance from "./src/index"
-export const CurdTable: SFCWithInstall<typeof Instance> = withInstall(Instance)
+import Instance from "./src/CurdTable.vue"
+export const CurdTable: SFCWithInstall<typeof Instance> = withInstall("CurdTable", Instance)
 export default CurdTable as SFCWithInstall<typeof Instance>
 export * from "./src/types"

package/components/CurdTable/src/CurdTable.vue

@@ -3,7 +3,7 @@
     <STableFilter v-if="selectParams.length && filterVisible" ref="sTableFilter" :list-query="search" @search="onSearch" />
     <div v-if="!option.hideMenu" class="table-control">
       <div class="btn-control">
-        <el-button v-if="!option.hideMenuAdd && props.fetchCreate" type="primary" :icon="Plus" @click="create()"> 添加</el-button>
+        <el-button v-if="!option.hideMenuAdd && props.fetchCreate" type="primary" :icon="Plus" @click="create()">{{ t("el.table.create") }}</el-button>
         <slot name="menuLeft"></slot>
       </div>
       <div class="min-control">
@@ -28,13 +28,13 @@
             </template>
           </STableItem>
         </template>
-        <el-table-column v-if="!option.hideOperation" label="操作" fixed="right" :width="option.operationWidth || '200'" align="left">
+        <el-table-column v-if="!option.hideOperation" :label="t('el.table.operation')" fixed="right" :width="option.operationWidth || '200'" align="left">
           <template #default="scope">
             <slot name="operation" v-bind="scope"></slot>
             <template v-if="!$slots.operationBtn">
-              <el-button v-if="!option.hideOperationEdit && props.fetchEdit" type="primary" link :icon="Edit" @click.stop="create(scope.row)">编辑 </el-button>
-              <el-button v-if="!option.hideOperationDetail" type="primary" link :icon="Document" @click.stop="detail(scope.row)">详情 </el-button>
-              <el-button v-if="!option.hideOperationDelete && props.fetchRemove" type="danger" link :icon="Delete" @click.stop="startremove(scope)">删除 </el-button>
+              <el-button v-if="!option.hideOperationEdit && props.fetchEdit" type="primary" link :icon="Edit" @click.stop="create(scope.row)">{{ t("el.table.edit") }}</el-button>
+              <el-button v-if="!option.hideOperationDetail" type="primary" link :icon="Document" @click.stop="detail(scope.row)">{{ t("el.table.detail") }}</el-button>
+              <el-button v-if="!option.hideOperationDelete && props.fetchRemove" type="danger" link :icon="Delete" @click.stop="startremove(scope)">{{ t("el.table.delete") }}</el-button>
             </template>
             <template v-else>
               <el-dropdown trigger="click" popper-class="curd-table-dropdown-menu">
@@ -93,6 +93,7 @@ import { ArrowDown, Delete, Document, Edit, Plus } from "@element-plus/icons-vue
 import { ElLoading, ElMessage, ElMessageBox, ElTable } from "element-plus"
 import { computed, getCurrentInstance, onActivated, onMounted, type PropType, provide, reactive, ref, type Ref, watch } from "vue"
 import { useGlobalConfig } from "../../../utils/hooks/useGlobalConfig"
+import { useLocale } from "../../../utils/hooks/useLocal"
 import type { Fields, FormItem, FormSchema } from "../../CurdForm"
 import FormDialog from "../../FormDialog"
 import type { FilterItem, ListQuery } from "../../TableFilter"
@@ -157,9 +158,10 @@ const props = defineProps({
     },
   },
 })
+const { t } = useLocale()
 const defaultOption = {
   operationWidth: 200,
-  operationBtnTitle: "更多",
+  operationBtnTitle: t("el.table.more"),
   hideMenu: false, // 是否隐藏右侧工具菜单
   hideMenuAdd: false, // 是否隐藏菜单中添加按钮
   hideMenuRight: false, // 是否隐藏菜单右侧
@@ -346,9 +348,9 @@ const onMenuOption = (optionKey: MenuEventKey, val: string) => {
       const data = list.value.map((a) => tableColumns.value.filter((b) => !b.hidden && !b.neverShow).map((b, i) => getTableValue(a[b.prop], b, a, i)))
       const header = tableColumns.value.filter((b) => !b.hidden && !b.neverShow).map((a) => a.label)
       const tabledata = [header, ...data]
-      const filename = "导出数据"
+      const filename = "data"
       exportExcel(tabledata, "data", (option.excelTitle || filename) + ".xls")
-      ElMessage.success("导出成功!")
+      ElMessage.success(t("el.table.exportSuccess"))
       break
     }
   }
@@ -401,7 +403,7 @@ const create = (row?: Record<string, unknown>) => {
   formSchema.formItem.sort((a, b) => (b.sortIndex || 0) - (a.sortIndex || 0))
   const eoptions = row ? option.editOptions : option.createOptions
   FormDialog.show({
-    title: row ? "编辑" : "添加",
+    title: row ? t("el.table.edit") : t("el.table.create"),
     formSchema: formSchema,
     fields: row as Fields,
     width: formAttrs?.width || 600,
@@ -414,16 +416,14 @@ const create = (row?: Record<string, unknown>) => {
 }
 const instance = getCurrentInstance()
 const startremove = (scope: { row: unknown; $index: number }) => {
-  ElMessageBox.confirm("确认删除当前数据吗", "提示", {
+  ElMessageBox.confirm(t("el.table.deleteConfirm"), t("el.table.tip"), {
     type: "warning",
-    cancelButtonText: "取消",
-    confirmButtonText: "确定",
   }).then(async () => {
     const loading = ElLoading.service({ fullscreen: true })
     await (props.fetchRemove && props.fetchRemove(scope.row, scope.$index)).finally(() => {
       loading.close()
     })
-    ElMessage({ type: "success", message: "删除成功" })
+    ElMessage({ type: "success", message: t("el.table.deleteSuccess") })
   })
 }
 

package/components/CurdTable/src/STableColumnControl.vue

@@ -1,13 +1,13 @@
 <template>
-  <el-drawer v-model="visible" title="列设置" size="40%" append-to-body>
+  <el-drawer v-model="visible" :title="t('el.table.columnSet')" size="40%" append-to-body>
     <el-table :data="columnDatas">
-      <el-table-column property="label" label="列名称"></el-table-column>
-      <el-table-column property="hidden" label="显示" width="60">
+      <el-table-column property="label" :label="t('el.table.columnName')"></el-table-column>
+      <el-table-column property="hidden" :label="t('el.table.show')" width="60">
         <template #default="scope">
           <el-switch v-model="scope.row.hidden" :active-value="false" :inactive-value="true" size="small" @change="onChangeHidden()"></el-switch>
         </template>
       </el-table-column>
-      <el-table-column property="fixed" label="固定显示" width="160" align="center">
+      <el-table-column property="fixed" :label="t('el.table.fixShow')" width="160" align="center">
         <template #default="scope">
           <el-button-group>
             <el-tooltip v-for="item in fixedMap" :key="item.value" :content="item.label">
@@ -23,15 +23,17 @@
 </template>
 <script lang="ts" setup>
 import { CaretLeft, CaretRight, VideoPause } from "@element-plus/icons-vue"
-import { computed, inject, type Ref, ref, shallowRef, triggerRef, watch } from "vue"
+import { computed, inject, ref, shallowRef, triggerRef, watch, type PropType, type Ref } from "vue"
+import { useLocale } from "../../../utils/hooks/useLocal"
 import type { ColumnItem } from "./types"
 const props = defineProps({
   visible: {
-    type: Boolean,
+    type: Boolean as PropType<boolean>,
     default: false,
   },
 })
 const emits = defineEmits(["update:visible", "change"])
+const { t } = useLocale()
 const columns = inject<Ref<Array<ColumnItem>>>("columns") || ref([])
 const visible = computed({
   get() {
@@ -66,9 +68,9 @@ const columnDatas = computed(() => {
   return result
 })
 const fixedMap = shallowRef([
-  { value: "left", label: "左固定", icon: CaretLeft },
-  { value: "", label: "不固定", icon: VideoPause },
-  { value: "right", label: "右固定", icon: CaretRight },
+  { value: "left", label: t("el.table.fixLeft"), icon: CaretLeft },
+  { value: "", label: t("el.table.fixNone"), icon: VideoPause },
+  { value: "right", label: t("el.table.fixRight"), icon: CaretRight },
 ])
 const selectFixed = (row: Record<string, unknown>, val: string) => {
   if (val) {

package/components/CurdTable/src/STableDetail.vue

@@ -1,10 +1,11 @@
 <template>
-  <el-drawer v-model="visible" title="详情" size="40%">
-    <DetailInfo :data="list" title="详情" label-width="110px" show-type="table" />
+  <el-drawer v-model="visible" :title="t('el.table.detail')" size="40%">
+    <DetailInfo :data="list" :title="t('el.table.detail')" label-width="110px" show-type="table" />
   </el-drawer>
 </template>
 <script lang="ts" setup>
 import { ref, type Ref } from "vue"
+import { useLocale } from "../../../utils/hooks/useLocal"
 import DetailInfo, { type DetailDataItem } from "../../DetailInfo"
 import type { ColumnItem } from "./types"
 interface OpenOption {
@@ -12,6 +13,7 @@ interface OpenOption {
   data: Record<string, unknown>
 }
 
+const { t } = useLocale()
 const visible = ref(false)
 const list: Ref<Array<DetailDataItem>> = ref([])
 const getValue = (data: DetailDataItem, column: ColumnItem, index: number) => {

package/components/CurdTable/src/STableMenu.vue

@@ -24,6 +24,7 @@
 import { Download, Operation, Refresh, ScaleToOriginal, Search } from "@element-plus/icons-vue"
 import { computed, ref } from "vue"
 import { useGlobalConfig } from "../../../utils/hooks/useGlobalConfig"
+import { useLocale } from "../../../utils/hooks/useLocal"
 import STableColumnControl from "./STableColumnControl.vue"
 const emits = defineEmits(["operation"])
 const props = defineProps({
@@ -32,24 +33,25 @@ const props = defineProps({
     default: true,
   },
 })
+const { t } = useLocale()
 const globalConfig = useGlobalConfig()
 // 控制按钮逻辑
 const controlButtons = computed(() => [
-  { label: "刷新", value: "refresh", icon: Refresh },
-  { label: props.filterVisible ? "收起查询" : "展开查询", value: "searchToggle", icon: Search },
+  { label: t("el.table.refresh"), value: "refresh", icon: Refresh },
+  { label: props.filterVisible ? t("el.table.collapseQuery") : t("el.table.expandQuery"), value: "searchToggle", icon: Search },
   {
-    label: "密度",
+    label: t("el.table.density"),
     icon: ScaleToOriginal,
     value: "size",
     options: [
-      { label: "默认", value: "default" },
-      { label: "宽松", value: "medium" },
-      { label: "紧凑", value: "small" },
+      { label: t("el.table.default"), value: "default" },
+      { label: t("el.table.medium"), value: "medium" },
+      { label: t("el.table.small"), value: "small" },
     ],
   },
-  { label: "导出数据", value: "export", icon: Download },
+  { label: t("el.table.exportData"), value: "export", icon: Download },
   // { label: "打印", value: "print", icon: "Printer" },
-  { label: "列设置", value: "operation", icon: Operation },
+  { label: t("el.table.columnSet"), value: "operation", icon: Operation },
 ])
 const visible = ref(false)
 const onClick = (item: ButtonItem) => {

package/components/DetailInfo/index.ts

@@ -1,5 +1,5 @@
 import { withInstall } from "../../utils"
 import Instance from "./src/DetailInfo.vue"
-export const DetailInfo = withInstall(Instance)
+export const DetailInfo = withInstall("DetailInfo", Instance)
 export default DetailInfo
 export * from "./src/types"

package/components/FormDialog/src/FormDialog.vue

@@ -10,10 +10,10 @@
     </div>
     <template #footer>
       <span v-if="handleOk" class="dialog-footer">
-        <el-button v-if="cancelBtnText" :disabled="confirmLoading" type="default" @click="onCancel()">{{ cancelBtnText }}</el-button>
-        <el-button v-if="stepSchemaList.length > 1 && step > 0" :disabled="confirmLoading" type="primary" plain @click="prev">上一步</el-button>
-        <el-button v-if="stepSchemaList.length > 1 && step < stepSchemaList.length - 1" :disabled="confirmLoading" type="primary" plain @click="next">下一步</el-button>
-        <el-button v-if="step >= stepSchemaList.length - 1" :disabled="confirmLoading" type="primary" :loading="confirmLoading" @click="onOk">{{ confirmBtnText }}</el-button>
+        <el-button v-if="cancelBtnTextLabel" :disabled="confirmLoading" type="default" @click="onCancel()">{{ cancelBtnTextLabel }}</el-button>
+        <el-button v-if="stepSchemaList.length > 1 && step > 0" :disabled="confirmLoading" type="primary" plain @click="prev">{{ t("el.formDialog.preStep") }}</el-button>
+        <el-button v-if="stepSchemaList.length > 1 && step < stepSchemaList.length - 1" :disabled="confirmLoading" type="primary" plain @click="next">{{ t("el.formDialog.nextStep") }}</el-button>
+        <el-button v-if="step >= stepSchemaList.length - 1" :disabled="confirmLoading" type="primary" :loading="confirmLoading" @click="onOk">{{ confirmBtnTextLabel }}</el-button>
       </span>
     </template>
   </el-dialog>
@@ -21,7 +21,8 @@
 
 <script lang="ts">
 import { ElButton, ElDialog, ElStep, ElSteps } from "element-plus"
-import { defineComponent, type PropType, reactive, ref, type Ref, shallowRef, toRefs } from "vue"
+import { computed, defineComponent, type PropType, reactive, ref, type Ref, shallowRef, toRefs } from "vue"
+import { useLocale } from "../../../utils/hooks/useLocal"
 import { CurdForm, type Fields, type FormSchema } from "../../CurdForm"
 export default defineComponent({
   name: "FormDialog",
@@ -74,11 +75,11 @@ export default defineComponent({
     },
     confirmBtnText: {
       type: String,
-      default: "确 定",
+      default: "",
     },
     cancelBtnText: {
       type: String,
-      default: "取消",
+      default: "",
     },
   },
   setup(props) {
@@ -89,6 +90,8 @@ export default defineComponent({
       visible: true,
       confirmLoading: false,
     })
+    const { t, locale } = useLocale()
+    console.log("locale", locale)
     const stepSchemaList = props.stepSchema?.length ? shallowRef(props.stepSchema) : shallowRef([{ name: "step1", description: "", formSchema: props.formSchema }])
     const prev = () => {
       if (state.step > 0) {
@@ -154,6 +157,8 @@ export default defineComponent({
     if (props.setForm) {
       props.setForm(form)
     }
+    const confirmBtnTextLabel = computed(() => props.confirmBtnText || t("el.formDialog.confirm"))
+    const cancelBtnTextLabel = computed(() => props.cancelBtnText || t("el.formDialog.cancel"))
 
     return {
       ...toRefs(state),
@@ -165,7 +170,10 @@ export default defineComponent({
       form,
       prev,
       next,
+      t,
       extendContexts,
+      confirmBtnTextLabel,
+      cancelBtnTextLabel,
     }
   },
 })

package/components/TableFilter/index.ts

@@ -1,6 +1,6 @@
 import { withInstall, type SFCWithInstall } from "../../utils"
 import Instance from "./src/TableFilter.vue"
-export const TableFilter: SFCWithInstall<typeof Instance> = withInstall(Instance)
+export const TableFilter: SFCWithInstall<typeof Instance> = withInstall("TableFilter", Instance)
 export * from "./types"
 
 export default TableFilter as SFCWithInstall<typeof Instance>

package/locale/index.ts

@@ -0,0 +1,11 @@
+export { default as en } from "./lang/en"
+export { default as zhCn } from "./lang/zh-cn"
+
+export type TranslatePair = {
+  [key: string]: string | string[] | TranslatePair
+}
+
+export type Language = {
+  name: string
+  el: TranslatePair
+}

package/locale/lang/en.ts

@@ -0,0 +1,46 @@
+export default {
+  name: "en",
+  el: {
+    table: {
+      operation: "Operation",
+      detail: "Details",
+      edit: "Edit",
+      delete: "Delete",
+      create: "Add",
+      more: "More",
+      columnSet: "Column Settings",
+      columnName: "Column Name",
+      show: "Show",
+      fixShow: "Fixed Show",
+      fixLeft: "Fixed Left",
+      fixRight: "Fixed Right",
+      fixNone: "Not Fixed",
+      exportSuccess: "Export Success",
+      deleteConfirm: "Confirm to delete current data?",
+      tip: "Tip",
+      deleteSuccess: "Delete Success",
+      refresh: "Refresh",
+      collapseQuery: "Collapse Query",
+      expandQuery: "Expand Query",
+      density: "Density",
+      exportData: "Export Data",
+      default: "Default",
+      medium: "Loose",
+      small: "Compact",
+    },
+    form: {
+      pleaseSelect: "Please select {0}",
+      pleaseInput: "Please input {0}",
+      all: "All",
+      allSelect: "Select All",
+      nodata: "No Data",
+      loading: "Loading...",
+    },
+    formDialog: {
+      preStep: "Previous Step",
+      nextStep: "Next Step",
+      confirm: "Confirm",
+      cancel: "Cancel",
+    },
+  },
+}

package/locale/lang/zh-cn.ts

@@ -0,0 +1,46 @@
+export default {
+  name: "中文",
+  el: {
+    table: {
+      operation: "操作",
+      detail: "详情",
+      edit: "编辑",
+      delete: "删除",
+      create: "添加",
+      more: "更多",
+      columnSet: "列设置",
+      columnName: "列名称",
+      show: "显示",
+      fixShow: "固定显示",
+      fixLeft: "左固定",
+      fixRight: "右固定",
+      fixNone: "不固定",
+      exportSuccess: "导出成功",
+      deleteConfirm: "确认删除当前数据吗",
+      tip: "提示",
+      deleteSuccess: "删除成功",
+      refresh: "刷新",
+      collapseQuery: "收起查询",
+      expandQuery: "展开查询",
+      density: "密度",
+      exportData: "导出数据",
+      default: "默认",
+      medium: "宽松",
+      small: "紧凑",
+    },
+    form: {
+      pleaseSelect: "请选择{0}",
+      pleaseInput: "请输入{0}",
+      all: "全部",
+      allSelect: "全选",
+      nodata: "暂无数据",
+      loading: "加载中...",
+    },
+    formDialog: {
+      preStep: "上一步",
+      nextStep: "下一步",
+      confirm: "确定",
+      cancel: "取消",
+    },
+  },
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easybill-ui",
-  "version": "1.1.6",
+  "version": "1.1.8",
   "description": "A component library for easybill",
   "author": "tuchongyang <779311998@qq.com>",
   "private": false,
@@ -14,5 +14,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b1f7fbc78b05fa6437a53b8b798e9a94bfff89ae"
+  "gitHead": "d3a1a4c6ef851a9f453be05fb660fd39adf02a07"
 }

package/theme-chalk/curd-form.css

@@ -1 +1 @@
-.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .el-form-item-1{flex:0 0 calc(4.1666666667% * 1);box-sizing:border-box}.curd-form .el-form-item-2{flex:0 0 calc(4.1666666667% * 2);box-sizing:border-box}.curd-form .el-form-item-3{flex:0 0 calc(4.1666666667% * 3);box-sizing:border-box}.curd-form .el-form-item-4{flex:0 0 calc(4.1666666667% * 4);box-sizing:border-box}.curd-form .el-form-item-5{flex:0 0 calc(4.1666666667% * 5);box-sizing:border-box}.curd-form .el-form-item-6{flex:0 0 calc(4.1666666667% * 6);box-sizing:border-box}.curd-form .el-form-item-7{flex:0 0 calc(4.1666666667% * 7);box-sizing:border-box}.curd-form .el-form-item-8{flex:0 0 calc(4.1666666667% * 8);box-sizing:border-box}.curd-form .el-form-item-9{flex:0 0 calc(4.1666666667% * 9);box-sizing:border-box}.curd-form .el-form-item-10{flex:0 0 calc(4.1666666667% * 10);box-sizing:border-box}.curd-form .el-form-item-11{flex:0 0 calc(4.1666666667% * 11);box-sizing:border-box}.curd-form .el-form-item-12{flex:0 0 calc(4.1666666667% * 12);box-sizing:border-box}.curd-form .el-form-item-13{flex:0 0 calc(4.1666666667% * 13);box-sizing:border-box}.curd-form .el-form-item-14{flex:0 0 calc(4.1666666667% * 14);box-sizing:border-box}.curd-form .el-form-item-15{flex:0 0 calc(4.1666666667% * 15);box-sizing:border-box}.curd-form .el-form-item-16{flex:0 0 calc(4.1666666667% * 16);box-sizing:border-box}.curd-form .el-form-item-17{flex:0 0 calc(4.1666666667% * 17);box-sizing:border-box}.curd-form .el-form-item-18{flex:0 0 calc(4.1666666667% * 18);box-sizing:border-box}.curd-form .el-form-item-19{flex:0 0 calc(4.1666666667% * 19);box-sizing:border-box}.curd-form .el-form-item-20{flex:0 0 calc(4.1666666667% * 20);box-sizing:border-box}.curd-form .el-form-item-21{flex:0 0 calc(4.1666666667% * 21);box-sizing:border-box}.curd-form .el-form-item-22{flex:0 0 calc(4.1666666667% * 22);box-sizing:border-box}.curd-form .el-form-item-23{flex:0 0 calc(4.1666666667% * 23);box-sizing:border-box}.curd-form .el-form-item-24{flex:0 0 calc(4.1666666667% * 24);box-sizing:border-box}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}
+.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start;margin-left:calc(0 - var(--curd-form-gutter)/ 2);margin-right:calc(0 - var(--curd-form-gutter)/ 2)}.curd-form .el-form-item{padding:0 calc(var(--curd-form-gutter)/ 2);box-sizing:border-box}.curd-form .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form.el-form--inline .el-form-item{flex:0 0 auto}.curd-form .el-form-item-full{flex:0 0 100%}.curd-form .el-form-item-1,.curd-form.el-form--inline .el-form-item-1{flex:0 0 calc(4.1666666667% * 1)}.curd-form .el-form-item-2,.curd-form.el-form--inline .el-form-item-2{flex:0 0 calc(4.1666666667% * 2)}.curd-form .el-form-item-3,.curd-form.el-form--inline .el-form-item-3{flex:0 0 calc(4.1666666667% * 3)}.curd-form .el-form-item-4,.curd-form.el-form--inline .el-form-item-4{flex:0 0 calc(4.1666666667% * 4)}.curd-form .el-form-item-5,.curd-form.el-form--inline .el-form-item-5{flex:0 0 calc(4.1666666667% * 5)}.curd-form .el-form-item-6,.curd-form.el-form--inline .el-form-item-6{flex:0 0 calc(4.1666666667% * 6)}.curd-form .el-form-item-7,.curd-form.el-form--inline .el-form-item-7{flex:0 0 calc(4.1666666667% * 7)}.curd-form .el-form-item-8,.curd-form.el-form--inline .el-form-item-8{flex:0 0 calc(4.1666666667% * 8)}.curd-form .el-form-item-9,.curd-form.el-form--inline .el-form-item-9{flex:0 0 calc(4.1666666667% * 9)}.curd-form .el-form-item-10,.curd-form.el-form--inline .el-form-item-10{flex:0 0 calc(4.1666666667% * 10)}.curd-form .el-form-item-11,.curd-form.el-form--inline .el-form-item-11{flex:0 0 calc(4.1666666667% * 11)}.curd-form .el-form-item-12,.curd-form.el-form--inline .el-form-item-12{flex:0 0 calc(4.1666666667% * 12)}.curd-form .el-form-item-13,.curd-form.el-form--inline .el-form-item-13{flex:0 0 calc(4.1666666667% * 13)}.curd-form .el-form-item-14,.curd-form.el-form--inline .el-form-item-14{flex:0 0 calc(4.1666666667% * 14)}.curd-form .el-form-item-15,.curd-form.el-form--inline .el-form-item-15{flex:0 0 calc(4.1666666667% * 15)}.curd-form .el-form-item-16,.curd-form.el-form--inline .el-form-item-16{flex:0 0 calc(4.1666666667% * 16)}.curd-form .el-form-item-17,.curd-form.el-form--inline .el-form-item-17{flex:0 0 calc(4.1666666667% * 17)}.curd-form .el-form-item-18,.curd-form.el-form--inline .el-form-item-18{flex:0 0 calc(4.1666666667% * 18)}.curd-form .el-form-item-19,.curd-form.el-form--inline .el-form-item-19{flex:0 0 calc(4.1666666667% * 19)}.curd-form .el-form-item-20,.curd-form.el-form--inline .el-form-item-20{flex:0 0 calc(4.1666666667% * 20)}.curd-form .el-form-item-21,.curd-form.el-form--inline .el-form-item-21{flex:0 0 calc(4.1666666667% * 21)}.curd-form .el-form-item-22,.curd-form.el-form--inline .el-form-item-22{flex:0 0 calc(4.1666666667% * 22)}.curd-form .el-form-item-23,.curd-form.el-form--inline .el-form-item-23{flex:0 0 calc(4.1666666667% * 23)}.curd-form .el-form-item-24,.curd-form.el-form--inline .el-form-item-24{flex:0 0 calc(4.1666666667% * 24)}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}

package/theme-chalk/index.css

@@ -1 +1 @@
-.constant-status{--el-tag-border-opacity:1;--el-tag-bg-opacity:1;--el-tag-font-size:var(--el-font-size-base)}.constant-status .el-tag__content{display:flex;align-items:center;line-height:1}.constant-status .el-icon,.constant-status .name{vertical-align:top;line-height:1}.constant-status .dot{width:5px;height:5px;display:inline-block;vertical-align:middle;border-radius:50%;background:var(--el-tag-text-color);margin-right:5px}.constant-status.no-border{padding:0}.constant-status.dot-status{padding:0}.constant-status.dot-status .name{color:var(--el-text-color-primary)}.constant-status.el-tag--default{padding:0;--el-tag-bg-color:transparent;--el-tag-border-color:transparent;--el-tag-hover-color:var(--el-text-color-primary);--el-tag-text-color:var(--el-text-color-primary)}.constant-status.el-tag--blue{--el-tag-bg-color:rgba(236, 245, 255, var(--el-tag-bg-color));--el-tag-border-color:rgba(217, 236, 255, var(--el-tag-border-color));--el-tag-hover-color:rgba(111, 122, 175, 1);--el-tag-text-color:rgba(111, 122, 175, 1)}.constant-status.el-tag--blue.el-tag--dark{--el-tag-bg-color:rgba(111, 122, 175, 1);--el-tag-border-color:rgba(111, 122, 175, 1);--el-tag-hover-color:rgba(111, 122, 175, 0.8);--el-tag-text-color:#fff}.constant-status.el-tag--blue.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--yellow{--el-tag-bg-color:rgba(255, 251, 230, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(255, 229, 143, var(--el-tag-borer-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:rgba(212, 136, 6, 1)}.constant-status.el-tag--yellow.el-tag--dark{--el-tag-bg-color:rgba(212, 136, 6, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(212, 136, 6, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:#fff}.constant-status.el-tag--yellow.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blue-dark{--el-tag-bg-color:rgba(240, 245, 255, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(173, 198, 255, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:rgba(29, 57, 196, 1)}.constant-status.el-tag--blue-dark.el-tag--dark{--el-tag-bg-color:rgba(29, 57, 196, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(29, 57, 196, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blue-dark.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--red-purple{--el-tag-bg-color:rgba(251, 243, 248, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(227, 206, 219, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:rgba(191, 117, 163, 1)}.constant-status.el-tag--red-purple.el-tag--dark{--el-tag-bg-color:rgba(191, 117, 163, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(191, 117, 163, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:#fff}.constant-status.el-tag--red-purple.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blueness{--el-tag-bg-color:rgba(243, 250, 251, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(194, 213, 221, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:rgba(99, 150, 177, 1)}.constant-status.el-tag--blueness.el-tag--dark{--el-tag-bg-color:rgba(99, 150, 177, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(99, 150, 177, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blueness.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.no-border{border:0!important;background:0 0}.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start}.curd-form:not(.el-form--inline) .el-form-item{flex:0 0 100%;box-sizing:border-box}.curd-form:not(.el-form--inline) .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form .el-form-item-1{flex:0 0 calc(4.1666666667% * 1);box-sizing:border-box}.curd-form .el-form-item-2{flex:0 0 calc(4.1666666667% * 2);box-sizing:border-box}.curd-form .el-form-item-3{flex:0 0 calc(4.1666666667% * 3);box-sizing:border-box}.curd-form .el-form-item-4{flex:0 0 calc(4.1666666667% * 4);box-sizing:border-box}.curd-form .el-form-item-5{flex:0 0 calc(4.1666666667% * 5);box-sizing:border-box}.curd-form .el-form-item-6{flex:0 0 calc(4.1666666667% * 6);box-sizing:border-box}.curd-form .el-form-item-7{flex:0 0 calc(4.1666666667% * 7);box-sizing:border-box}.curd-form .el-form-item-8{flex:0 0 calc(4.1666666667% * 8);box-sizing:border-box}.curd-form .el-form-item-9{flex:0 0 calc(4.1666666667% * 9);box-sizing:border-box}.curd-form .el-form-item-10{flex:0 0 calc(4.1666666667% * 10);box-sizing:border-box}.curd-form .el-form-item-11{flex:0 0 calc(4.1666666667% * 11);box-sizing:border-box}.curd-form .el-form-item-12{flex:0 0 calc(4.1666666667% * 12);box-sizing:border-box}.curd-form .el-form-item-13{flex:0 0 calc(4.1666666667% * 13);box-sizing:border-box}.curd-form .el-form-item-14{flex:0 0 calc(4.1666666667% * 14);box-sizing:border-box}.curd-form .el-form-item-15{flex:0 0 calc(4.1666666667% * 15);box-sizing:border-box}.curd-form .el-form-item-16{flex:0 0 calc(4.1666666667% * 16);box-sizing:border-box}.curd-form .el-form-item-17{flex:0 0 calc(4.1666666667% * 17);box-sizing:border-box}.curd-form .el-form-item-18{flex:0 0 calc(4.1666666667% * 18);box-sizing:border-box}.curd-form .el-form-item-19{flex:0 0 calc(4.1666666667% * 19);box-sizing:border-box}.curd-form .el-form-item-20{flex:0 0 calc(4.1666666667% * 20);box-sizing:border-box}.curd-form .el-form-item-21{flex:0 0 calc(4.1666666667% * 21);box-sizing:border-box}.curd-form .el-form-item-22{flex:0 0 calc(4.1666666667% * 22);box-sizing:border-box}.curd-form .el-form-item-23{flex:0 0 calc(4.1666666667% * 23);box-sizing:border-box}.curd-form .el-form-item-24{flex:0 0 calc(4.1666666667% * 24);box-sizing:border-box}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}.table-container .table-pager{margin:15px 0;display:flex;justify-content:space-between;align-items:center}.table-container .table-pager .pagination{justify-content:end;font-weight:400}.table-container .table-control{display:flex;justify-content:space-between;padding-bottom:10px;align-items:flex-end}.table-container .table-control .min-control>.el-button{margin-right:10px}.table-container .s-table-filter .el-form--inline .el-form-item{margin-right:15px}.table-container .el-button+.dropdown-item{margin-left:10px}.table-container .copy{cursor:pointer;margin-right:3px}.table-container .header-td{display:inline-flex;align-items:center;word-break:break-word}.table-container .header-td.center{justify-content:center}.table-container .header-td.right{justify-content:flex-end}.table-container .filter-dropdown-toggle{display:inline-block;line-height:1;cursor:pointer;position:relative;margin-left:3px}.table-container .filter-dropdown-toggle.active{color:var(--el-color-primary)}.table-container .table-menu{display:inline-block;vertical-align:middle;position:relative}.table-container .table-menu .table-menu-item{color:var(--el-button-text-color);font-size:14px;border-radius:4px;border:1px solid var(--el-button-border-color);padding:0;height:28px;width:28px;vertical-align:top;vertical-align:middle}.table-container .table-menu .table-menu-item:not(.is-disabled):active,.table-container .table-menu .table-menu-item:not(.is-disabled):focus{border-color:var(--el-button-border-color)}.table-container .table-menu .table-menu-item+.table-menu-item{margin-left:3px}.table-container .table-menu .table-menu-item:hover{background-color:var(--el-fill-color-light);border-color:var(--el-button-border-color)}.table-container .table-menu .current-size{color:var(--el-color-primary)}.table-container .simple-page{padding:20px 0;text-align:right}.table-container .simple-page>span{margin:0 10px}.curd-table-dropdown-menu .el-dropdown-menu__item{padding:0}.curd-table-dropdown-menu .el-dropdown-menu__item:hover{background-color:var(--el-fill-color-light)}.curd-table-dropdown-menu .el-dropdown-menu__item .el-button{display:block;padding:5px 16px;flex:1;text-align:left;font-size:12px}.table-main-filter-dropdown{padding:0}.table-main-filter-dropdown .search{position:relative;margin-bottom:5px}.table-main-filter-dropdown .search input{outline:0;border:0;width:100%;padding:5px 10px;background:#f4f4f4}.table-main-filter-dropdown .search .icon-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.table-main-filter-dropdown .search .icon-close1{position:absolute;right:30px;top:50%;transform:translateY(-50%);cursor:pointer;opacity:.7}.table-main-filter-dropdown .search .icon-close1:hover{opacity:1;color:#444}.table-main-filter-dropdown .select li{line-height:30px;padding:0 20px;list-style:none;cursor:pointer}.table-main-filter-dropdown .select li:hover{background:#f4f4f4}.table-main-filter-dropdown .select li.active{color:var(--el-color-primary)}.filter-type-popper{width:auto!important;min-width:0!important;padding:0!important;box-shadow:none!important}.table-filter{display:flex;flex-direction:column;position:relative}.table-filter .filter-search-box{min-height:32px;border-width:1px;border-style:solid;border-color:var(--el-border-color);display:flex;min-width:460px;align-items:center;justify-items:center;justify-content:space-between;overflow:hidden;border-radius:var(--el-border-radius-base);transition:all .3s}.table-filter .filter-search-box.is-focus{border-color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action{height:32px;line-height:32px;align-self:flex-end;display:flex}.table-filter .filter-search-box .filter-action div{cursor:pointer}.table-filter .filter-search-box .filter-action .empty{color:var(--el-color-info);margin-right:15px;padding-left:10px}.table-filter .filter-search-box .filter-action .empty:hover{color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action .search{padding:0 20px;text-align:center;position:relative;display:flex;align-items:center}.table-filter .filter-search-box .filter-action .search:before{content:"";display:block;width:1px;height:20px;background:var(--el-border-color);position:absolute;left:0;top:50%;transform:translateY(-50%)}.table-filter .filter-search-box .filter-action .search:hover{color:var(--el-color-primary)}.table-filter .filter-external .el-form-item{margin-bottom:10px}.table-filter .filter-tags{height:100%;flex-wrap:wrap;display:flex;flex:1;align-items:flex-start;justify-items:center}.table-filter .filter-tags .tag-title{font-size:12px;color:var(--el-text-color-placeholder);height:24px;line-height:24px;margin:0 15px 5px 0}.table-filter .filter-tags .dropdown-toggle{white-space:nowrap;display:flex;align-items:center;justify-items:center;font-size:12px}.table-filter .filter-tags .tag-list{flex:1;display:flex;flex-wrap:wrap}.table-filter .filter-tags .tag-item{height:24px;line-height:24px;white-space:nowrap;display:flex;align-items:center;justify-items:center;padding:0 10px;color:var(--el-color-info-dark-2);background:var(--el-color-info-light-9);font-size:12px;border-radius:var(--el-border-radius-base);margin-right:5px;margin-bottom:10px;cursor:pointer}.table-filter .filter-tags .tag-item .action{color:var(--el-color-info-light-5);text-align:center;width:14px;height:14px;line-height:14px;border-radius:50%;margin-left:10px;font-size:14px;cursor:pointer}.table-filter .filter-tags .tag-item .action:hover{color:var(--el-color-primary)}.table-filter .tag-clear{margin-bottom:2px;margin-left:10px}.table-filter .filter-item .el-form-item{margin:0}.table-filter .filter-item .el-form-item__label{display:none}.table-filter .filter-item .el-input{--el-input-border:none;--el-input-border-color:transparent;--el-input-focus-border-color:transparent;--el-input-hover-border-color:transparent}.table-filter .filter-item .el-select{--el-select-border-color-hover:transparent;--el-select-input-focus-border-color:transparent}.table-filter .filter-item .el-select__wrapper{box-shadow:none}.table-filter-type{box-shadow:var(--el-box-shadow-light);background:var(--el-bg-color);z-index:3060;min-width:150px;max-height:300px;overflow:hidden;--el-font-size-base:12px}.table-filter-type .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-type .base-select .remote-input{width:100%}.table-filter-type .base-select .remote-input .el-input{--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-type .base-select .el-empty__image svg{height:50px}.table-filter-type .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-type .base-select .select-spinner ul{margin:0;padding:0}.table-filter-type .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;font-size:var(--el-font-size-base)}.table-filter-type .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-type .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-toggle{padding:0 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-width:120px;font-size:12px}.table-filter-toggle .current-filter-label{margin-right:20px}.table-filter-List{box-shadow:0 2px 8px 0 rgba(0,0,0,.2);background:var(--el-bg-color);z-index:3060;border-radius:2px;max-height:300px;overflow-y:auto;font-size:12px}.table-filter-List ul{width:100%;margin:0;padding:0}.table-filter-List ul li{width:100%;list-style:none;padding:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;cursor:pointer}.table-filter-List ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-List ul li.active{color:var(--el-color-primary);font-weight:600}.table-filter-tag-popper{max-height:400px;overflow:auto;padding:0!important;width:250px!important}.table-filter-tag-popper .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-tag-popper .base-select .remote-input{width:100%}.table-filter-tag-popper .base-select .remote-input :deep(.el-input){--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-tag-popper .base-select :deep(.el-empty__imagesvg){height:50px}.table-filter-tag-popper .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-tag-popper .base-select .select-spinner ul{margin:0;padding:0}.table-filter-tag-popper .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--el-font-size-base);box-sizing:border-box}.table-filter-tag-popper .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-tag-popper .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.detail-info{flex:1}.detail-info .detail-info-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.detail-info .title{border-left:3px solid var(--el-color-primary);padding-left:10px;line-height:1.2}.detail-info+.detail-info{margin-top:30px}.detail-info.card{background:var(--el-bg-color);border-radius:0;opacity:1;border:1px solid var(--el-border-color)}.detail-info.card[shadow]{box-shadow:var(--el-box-shadow-lighter)}.detail-info.card .detail-info-header{height:50px;border-bottom:1px solid var(--el-border-color);margin:0;padding:0 20px}.detail-info.card .detail-info-header .title{border-left:0;padding:0}.detail-info.card .detail-info-body{padding:10px 20px 20px 20px;margin:0}.detail-info .detail-info-body{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box}.detail-info .detail-info-body .table-detail-col{box-sizing:border-box}.detail-info .detail-info-body .item-col{line-height:20px;height:100%;box-sizing:border-box;display:flex}.detail-info .detail-info-body .item-col .label{padding:4px 0;color:var(--el-text-color-secondary);box-sizing:border-box;vertical-align:middle;float:left;display:flex;align-items:center}.detail-info .detail-info-body .item-col .det{flex:1;padding:4px 10px;box-sizing:border-box;min-height:20px;height:100%;word-break:break-all;overflow:hidden}.detail-info .detail-info-body.table{border-top:1px solid var(--el-border-color);border-left:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .table-detail-col{padding:0!important;border-bottom:1px solid var(--el-border-color);border-right:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .item-col{background:var(--el-fill-color-light);border:1px solid var(--el-bg-color)}.detail-info .detail-info-body.table .item-col .label{padding-left:10px;padding-right:10px;width:100px}.detail-info .detail-info-body.table .item-col .det{border-left:1px solid var(--el-border-color);background-color:var(--el-bg-color)}
+.constant-status{--el-tag-border-opacity:1;--el-tag-bg-opacity:1;--el-tag-font-size:var(--el-font-size-base)}.constant-status .el-tag__content{display:flex;align-items:center;line-height:1}.constant-status .el-icon,.constant-status .name{vertical-align:top;line-height:1}.constant-status .dot{width:5px;height:5px;display:inline-block;vertical-align:middle;border-radius:50%;background:var(--el-tag-text-color);margin-right:5px}.constant-status.no-border{padding:0}.constant-status.dot-status{padding:0}.constant-status.dot-status .name{color:var(--el-text-color-primary)}.constant-status.el-tag--default{padding:0;--el-tag-bg-color:transparent;--el-tag-border-color:transparent;--el-tag-hover-color:var(--el-text-color-primary);--el-tag-text-color:var(--el-text-color-primary)}.constant-status.el-tag--blue{--el-tag-bg-color:rgba(236, 245, 255, var(--el-tag-bg-color));--el-tag-border-color:rgba(217, 236, 255, var(--el-tag-border-color));--el-tag-hover-color:rgba(111, 122, 175, 1);--el-tag-text-color:rgba(111, 122, 175, 1)}.constant-status.el-tag--blue.el-tag--dark{--el-tag-bg-color:rgba(111, 122, 175, 1);--el-tag-border-color:rgba(111, 122, 175, 1);--el-tag-hover-color:rgba(111, 122, 175, 0.8);--el-tag-text-color:#fff}.constant-status.el-tag--blue.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--yellow{--el-tag-bg-color:rgba(255, 251, 230, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(255, 229, 143, var(--el-tag-borer-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:rgba(212, 136, 6, 1)}.constant-status.el-tag--yellow.el-tag--dark{--el-tag-bg-color:rgba(212, 136, 6, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(212, 136, 6, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(212, 136, 6, 1);--el-tag-text-color:#fff}.constant-status.el-tag--yellow.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blue-dark{--el-tag-bg-color:rgba(240, 245, 255, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(173, 198, 255, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:rgba(29, 57, 196, 1)}.constant-status.el-tag--blue-dark.el-tag--dark{--el-tag-bg-color:rgba(29, 57, 196, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(29, 57, 196, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(29, 57, 196, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blue-dark.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--red-purple{--el-tag-bg-color:rgba(251, 243, 248, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(227, 206, 219, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:rgba(191, 117, 163, 1)}.constant-status.el-tag--red-purple.el-tag--dark{--el-tag-bg-color:rgba(191, 117, 163, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(191, 117, 163, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(191, 117, 163, 1);--el-tag-text-color:#fff}.constant-status.el-tag--red-purple.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.el-tag--blueness{--el-tag-bg-color:rgba(243, 250, 251, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(194, 213, 221, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:rgba(99, 150, 177, 1)}.constant-status.el-tag--blueness.el-tag--dark{--el-tag-bg-color:rgba(99, 150, 177, var(--el-tag-bg-opacity));--el-tag-border-color:rgba(99, 150, 177, var(--el-tag-border-opacity));--el-tag-hover-color:rgba(99, 150, 177, 1);--el-tag-text-color:#fff}.constant-status.el-tag--blueness.el-tag--plain{--el-tag-bg-color:var(--el-fill-color-blank)}.constant-status.no-border{border:0!important;background:0 0}.curd-form{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box;min-width:0;align-items:flex-start;margin-left:calc(0 - var(--curd-form-gutter)/ 2);margin-right:calc(0 - var(--curd-form-gutter)/ 2)}.curd-form .el-form-item{padding:0 calc(var(--curd-form-gutter)/ 2);box-sizing:border-box}.curd-form .el-form-item .el-form-item__label:before{margin-left:-10px}.curd-form.el-form--inline .el-form-item{flex:0 0 auto}.curd-form .el-form-item-full{flex:0 0 100%}.curd-form .el-form-item-1,.curd-form.el-form--inline .el-form-item-1{flex:0 0 calc(4.1666666667% * 1)}.curd-form .el-form-item-2,.curd-form.el-form--inline .el-form-item-2{flex:0 0 calc(4.1666666667% * 2)}.curd-form .el-form-item-3,.curd-form.el-form--inline .el-form-item-3{flex:0 0 calc(4.1666666667% * 3)}.curd-form .el-form-item-4,.curd-form.el-form--inline .el-form-item-4{flex:0 0 calc(4.1666666667% * 4)}.curd-form .el-form-item-5,.curd-form.el-form--inline .el-form-item-5{flex:0 0 calc(4.1666666667% * 5)}.curd-form .el-form-item-6,.curd-form.el-form--inline .el-form-item-6{flex:0 0 calc(4.1666666667% * 6)}.curd-form .el-form-item-7,.curd-form.el-form--inline .el-form-item-7{flex:0 0 calc(4.1666666667% * 7)}.curd-form .el-form-item-8,.curd-form.el-form--inline .el-form-item-8{flex:0 0 calc(4.1666666667% * 8)}.curd-form .el-form-item-9,.curd-form.el-form--inline .el-form-item-9{flex:0 0 calc(4.1666666667% * 9)}.curd-form .el-form-item-10,.curd-form.el-form--inline .el-form-item-10{flex:0 0 calc(4.1666666667% * 10)}.curd-form .el-form-item-11,.curd-form.el-form--inline .el-form-item-11{flex:0 0 calc(4.1666666667% * 11)}.curd-form .el-form-item-12,.curd-form.el-form--inline .el-form-item-12{flex:0 0 calc(4.1666666667% * 12)}.curd-form .el-form-item-13,.curd-form.el-form--inline .el-form-item-13{flex:0 0 calc(4.1666666667% * 13)}.curd-form .el-form-item-14,.curd-form.el-form--inline .el-form-item-14{flex:0 0 calc(4.1666666667% * 14)}.curd-form .el-form-item-15,.curd-form.el-form--inline .el-form-item-15{flex:0 0 calc(4.1666666667% * 15)}.curd-form .el-form-item-16,.curd-form.el-form--inline .el-form-item-16{flex:0 0 calc(4.1666666667% * 16)}.curd-form .el-form-item-17,.curd-form.el-form--inline .el-form-item-17{flex:0 0 calc(4.1666666667% * 17)}.curd-form .el-form-item-18,.curd-form.el-form--inline .el-form-item-18{flex:0 0 calc(4.1666666667% * 18)}.curd-form .el-form-item-19,.curd-form.el-form--inline .el-form-item-19{flex:0 0 calc(4.1666666667% * 19)}.curd-form .el-form-item-20,.curd-form.el-form--inline .el-form-item-20{flex:0 0 calc(4.1666666667% * 20)}.curd-form .el-form-item-21,.curd-form.el-form--inline .el-form-item-21{flex:0 0 calc(4.1666666667% * 21)}.curd-form .el-form-item-22,.curd-form.el-form--inline .el-form-item-22{flex:0 0 calc(4.1666666667% * 22)}.curd-form .el-form-item-23,.curd-form.el-form--inline .el-form-item-23{flex:0 0 calc(4.1666666667% * 23)}.curd-form .el-form-item-24,.curd-form.el-form--inline .el-form-item-24{flex:0 0 calc(4.1666666667% * 24)}.curd-form .form-item{width:100%;display:flex;min-width:0}.curd-form .form-item .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle;color:var(--el-text-color-secondary)}.curd-form .form-item .tooltip:hover{color:var(--color-primary)}.curd-form .form-item .empty{color:var(--el-text-color-secondary)}.curd-form .schema-form-radio .el-radio-group{vertical-align:top}.curd-form .el-checkbox-group.single .el-checkbox-button+.el-checkbox-button{margin-left:10px}.curd-form .el-checkbox-group.single .el-checkbox-button .el-checkbox-button__inner{border:var(--el-border);border-radius:var(--el-border-radius-base);padding-left:20px;padding-right:20px}.curd-form .el-checkbox-group.single .el-checkbox-button.is-checked .el-checkbox-button__inner{border-color:var(--el-checkbox-button-checked-border-color)}.curd-form .tooltip{color:var(--el-button-text-color);margin-left:10px;vertical-align:middle}.schema-form-select-check{height:25px;margin-left:20px;margin-top:10px;display:block}.schema-form-select-check :deep(.el-checkbox__input){vertical-align:middle}.table-container .table-pager{margin:15px 0;display:flex;justify-content:space-between;align-items:center}.table-container .table-pager .pagination{justify-content:end;font-weight:400}.table-container .table-control{display:flex;justify-content:space-between;padding-bottom:10px;align-items:flex-end}.table-container .table-control .min-control>.el-button{margin-right:10px}.table-container .s-table-filter .el-form--inline .el-form-item{margin-right:15px}.table-container .el-button+.dropdown-item{margin-left:10px}.table-container .copy{cursor:pointer;margin-right:3px}.table-container .header-td{display:inline-flex;align-items:center;word-break:break-word}.table-container .header-td.center{justify-content:center}.table-container .header-td.right{justify-content:flex-end}.table-container .filter-dropdown-toggle{display:inline-block;line-height:1;cursor:pointer;position:relative;margin-left:3px}.table-container .filter-dropdown-toggle.active{color:var(--el-color-primary)}.table-container .table-menu{display:inline-block;vertical-align:middle;position:relative}.table-container .table-menu .table-menu-item{color:var(--el-button-text-color);font-size:14px;border-radius:4px;border:1px solid var(--el-button-border-color);padding:0;height:28px;width:28px;vertical-align:top;vertical-align:middle}.table-container .table-menu .table-menu-item:not(.is-disabled):active,.table-container .table-menu .table-menu-item:not(.is-disabled):focus{border-color:var(--el-button-border-color)}.table-container .table-menu .table-menu-item+.table-menu-item{margin-left:3px}.table-container .table-menu .table-menu-item:hover{background-color:var(--el-fill-color-light);border-color:var(--el-button-border-color)}.table-container .table-menu .current-size{color:var(--el-color-primary)}.table-container .simple-page{padding:20px 0;text-align:right}.table-container .simple-page>span{margin:0 10px}.curd-table-dropdown-menu .el-dropdown-menu__item{padding:0}.curd-table-dropdown-menu .el-dropdown-menu__item:hover{background-color:var(--el-fill-color-light)}.curd-table-dropdown-menu .el-dropdown-menu__item .el-button{display:block;padding:5px 16px;flex:1;text-align:left;font-size:12px}.table-main-filter-dropdown{padding:0}.table-main-filter-dropdown .search{position:relative;margin-bottom:5px}.table-main-filter-dropdown .search input{outline:0;border:0;width:100%;padding:5px 10px;background:#f4f4f4}.table-main-filter-dropdown .search .icon-suffix{position:absolute;right:10px;top:50%;transform:translateY(-50%)}.table-main-filter-dropdown .search .icon-close1{position:absolute;right:30px;top:50%;transform:translateY(-50%);cursor:pointer;opacity:.7}.table-main-filter-dropdown .search .icon-close1:hover{opacity:1;color:#444}.table-main-filter-dropdown .select li{line-height:30px;padding:0 20px;list-style:none;cursor:pointer}.table-main-filter-dropdown .select li:hover{background:#f4f4f4}.table-main-filter-dropdown .select li.active{color:var(--el-color-primary)}.filter-type-popper{width:auto!important;min-width:0!important;padding:0!important;box-shadow:none!important}.table-filter{display:flex;flex-direction:column;position:relative}.table-filter .filter-search-box{min-height:32px;border-width:1px;border-style:solid;border-color:var(--el-border-color);display:flex;min-width:460px;align-items:center;justify-items:center;justify-content:space-between;overflow:hidden;border-radius:var(--el-border-radius-base);transition:all .3s}.table-filter .filter-search-box.is-focus{border-color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action{height:32px;line-height:32px;align-self:flex-end;display:flex}.table-filter .filter-search-box .filter-action div{cursor:pointer}.table-filter .filter-search-box .filter-action .empty{color:var(--el-color-info);margin-right:15px;padding-left:10px}.table-filter .filter-search-box .filter-action .empty:hover{color:var(--el-color-primary)}.table-filter .filter-search-box .filter-action .search{padding:0 20px;text-align:center;position:relative;display:flex;align-items:center}.table-filter .filter-search-box .filter-action .search:before{content:"";display:block;width:1px;height:20px;background:var(--el-border-color);position:absolute;left:0;top:50%;transform:translateY(-50%)}.table-filter .filter-search-box .filter-action .search:hover{color:var(--el-color-primary)}.table-filter .filter-external .el-form-item{margin-bottom:10px}.table-filter .filter-tags{height:100%;flex-wrap:wrap;display:flex;flex:1;align-items:flex-start;justify-items:center}.table-filter .filter-tags .tag-title{font-size:12px;color:var(--el-text-color-placeholder);height:24px;line-height:24px;margin:0 15px 5px 0}.table-filter .filter-tags .dropdown-toggle{white-space:nowrap;display:flex;align-items:center;justify-items:center;font-size:12px}.table-filter .filter-tags .tag-list{flex:1;display:flex;flex-wrap:wrap}.table-filter .filter-tags .tag-item{height:24px;line-height:24px;white-space:nowrap;display:flex;align-items:center;justify-items:center;padding:0 10px;color:var(--el-color-info-dark-2);background:var(--el-color-info-light-9);font-size:12px;border-radius:var(--el-border-radius-base);margin-right:5px;margin-bottom:10px;cursor:pointer}.table-filter .filter-tags .tag-item .action{color:var(--el-color-info-light-5);text-align:center;width:14px;height:14px;line-height:14px;border-radius:50%;margin-left:10px;font-size:14px;cursor:pointer}.table-filter .filter-tags .tag-item .action:hover{color:var(--el-color-primary)}.table-filter .tag-clear{margin-bottom:2px;margin-left:10px}.table-filter .filter-item .el-form-item{margin:0}.table-filter .filter-item .el-form-item__label{display:none}.table-filter .filter-item .el-input{--el-input-border:none;--el-input-border-color:transparent;--el-input-focus-border-color:transparent;--el-input-hover-border-color:transparent}.table-filter .filter-item .el-select{--el-select-border-color-hover:transparent;--el-select-input-focus-border-color:transparent}.table-filter .filter-item .el-select__wrapper{box-shadow:none}.table-filter-type{box-shadow:var(--el-box-shadow-light);background:var(--el-bg-color);z-index:3060;min-width:150px;max-height:300px;overflow:hidden;--el-font-size-base:12px}.table-filter-type .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-type .base-select .remote-input{width:100%}.table-filter-type .base-select .remote-input .el-input{--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-type .base-select .el-empty__image svg{height:50px}.table-filter-type .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-type .base-select .select-spinner ul{margin:0;padding:0}.table-filter-type .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;font-size:var(--el-font-size-base)}.table-filter-type .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-type .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-toggle{padding:0 10px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;min-width:120px;font-size:12px}.table-filter-toggle .current-filter-label{margin-right:20px}.table-filter-List{box-shadow:0 2px 8px 0 rgba(0,0,0,.2);background:var(--el-bg-color);z-index:3060;border-radius:2px;max-height:300px;overflow-y:auto;font-size:12px}.table-filter-List ul{width:100%;margin:0;padding:0}.table-filter-List ul li{width:100%;list-style:none;padding:6px 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box;cursor:pointer}.table-filter-List ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.table-filter-List ul li.active{color:var(--el-color-primary);font-weight:600}.table-filter-tag-popper{max-height:400px;overflow:auto;padding:0!important;width:250px!important}.table-filter-tag-popper .base-select{--el-font-size-base:12px;height:100%;max-height:300px;display:flex;flex-direction:column}.table-filter-tag-popper .base-select .remote-input{width:100%}.table-filter-tag-popper .base-select .remote-input :deep(.el-input){--el-input-border-radius:0;--el-input-bg-color:var(--el-bg-color-page);--el-input-border:none;--el-input-hover-border-color:transparent;--el-input-focus-border-color:var(--el-border-color)}.table-filter-tag-popper .base-select :deep(.el-empty__imagesvg){height:50px}.table-filter-tag-popper .base-select .select-spinner{flex:1;position:relative;overflow-y:auto}.table-filter-tag-popper .base-select .select-spinner ul{margin:0;padding:0}.table-filter-tag-popper .base-select .select-spinner ul li{list-style:none;padding:6px 10px;cursor:pointer;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--el-font-size-base);box-sizing:border-box}.table-filter-tag-popper .base-select .select-spinner ul li.active{color:var(--el-color-primary)}.table-filter-tag-popper .base-select .select-spinner ul li:hover{background:var(--el-color-primary-light-9);color:var(--el-color-primary)}.detail-info{flex:1}.detail-info .detail-info-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.detail-info .title{border-left:3px solid var(--el-color-primary);padding-left:10px;line-height:1.2}.detail-info+.detail-info{margin-top:30px}.detail-info.card{background:var(--el-bg-color);border-radius:0;opacity:1;border:1px solid var(--el-border-color)}.detail-info.card[shadow]{box-shadow:var(--el-box-shadow-lighter)}.detail-info.card .detail-info-header{height:50px;border-bottom:1px solid var(--el-border-color);margin:0;padding:0 20px}.detail-info.card .detail-info-header .title{border-left:0;padding:0}.detail-info.card .detail-info-body{padding:10px 20px 20px 20px;margin:0}.detail-info .detail-info-body{display:flex;flex-wrap:wrap;position:relative;box-sizing:border-box}.detail-info .detail-info-body .table-detail-col{box-sizing:border-box}.detail-info .detail-info-body .item-col{line-height:20px;height:100%;box-sizing:border-box;display:flex}.detail-info .detail-info-body .item-col .label{padding:4px 0;color:var(--el-text-color-secondary);box-sizing:border-box;vertical-align:middle;float:left;display:flex;align-items:center}.detail-info .detail-info-body .item-col .det{flex:1;padding:4px 10px;box-sizing:border-box;min-height:20px;height:100%;word-break:break-all;overflow:hidden}.detail-info .detail-info-body.table{border-top:1px solid var(--el-border-color);border-left:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .table-detail-col{padding:0!important;border-bottom:1px solid var(--el-border-color);border-right:1px solid var(--el-border-color)}.detail-info .detail-info-body.table .item-col{background:var(--el-fill-color-light);border:1px solid var(--el-bg-color)}.detail-info .detail-info-body.table .item-col .label{padding-left:10px;padding-right:10px;width:100px}.detail-info .detail-info-body.table .item-col .det{border-left:1px solid var(--el-border-color);background-color:var(--el-bg-color)}

package/utils/hooks/useGlobalConfig.ts

@@ -1,4 +1,5 @@
 import { ref, type Ref, unref } from "vue"
+import type { Language } from "../../locale"
 const globalConfig: Ref<GlobalConfig> = ref({} as GlobalConfig)
 export function useGlobalConfig() {
   return globalConfig
@@ -31,6 +32,7 @@ const mergeConfig = (a: GlobalConfig, b: Partial<GlobalConfig>) => {
 export interface GlobalConfig {
   size: "default" | "small" | "large"
   form?: FormConfig
+  locale?: Language
 }
 interface FormConfig {
   components?: unknown[]

package/utils/hooks/useLocal.ts

@@ -0,0 +1,59 @@
+import { computed, isRef, ref, unref, type ComputedRef } from "vue"
+import zhCn from "../../locale/lang/zh-cn"
+
+import type { MaybeRef } from "@vueuse/core"
+import type { Ref } from "vue"
+import type { Language } from "../../locale"
+import { useGlobalConfig } from "./useGlobalConfig"
+
+export type TranslatorOption = Record<string, string | number> | string[]
+export type Translator = (path: string, option?: TranslatorOption) => string
+export type LocaleContext = {
+  locale: Ref<Language>
+  lang: Ref<string>
+  t: Translator
+}
+
+export const buildTranslator =
+  (locale: MaybeRef<Language>): Translator =>
+  (path, option) =>
+    translate(path, option, unref(locale))
+
+export const translate = (path: string, option: undefined | TranslatorOption, locale: Language): string => {
+  const value = get(locale, path, path) as string
+  if (Array.isArray(option)) {
+    return value.replace(/\{(\d+)\}/g, (_, key) => `${option[Number(key)]}`)
+  }
+  return value.replace(/\{(\w+)\}/g, (_, key) => `${option?.[key] ?? `{${key}}`}`)
+}
+
+export const buildLocaleContext = (locale: ComputedRef<Language>): LocaleContext => {
+  const lang = computed(() => unref(locale).name)
+  const localeRef = isRef(locale) ? locale : ref(locale)
+  return {
+    lang,
+    locale: localeRef,
+    t: buildTranslator(locale),
+  }
+}
+
+export const useLocale = (localeOverrides?: Language | undefined) => {
+  const globalConfig = useGlobalConfig()
+  const locale = localeOverrides || globalConfig.value.locale!
+  return buildLocaleContext(computed(() => locale || zhCn))
+}
+function get(object: Record<string, unknown>, path: string, defaultValue: unknown) {
+  // 将路径转换为数组形式
+  const pathArray = Array.isArray(path) ? path : path.split(/[\.\[\]]/).filter(Boolean)
+
+  let result = object
+
+  for (const key of pathArray) {
+    if (result === null || result === undefined) {
+      return defaultValue
+    }
+    result = result[key] as Record<string, unknown>
+  }
+
+  return result === undefined ? defaultValue : result
+}

package/utils/vue/install.ts

@@ -1,11 +1,11 @@
 import type { App, Component } from "vue"
 import type { SFCWithInstall } from "./typescript"
 
-export const withInstall = <T, E extends Record<string, unknown>>(main: T, extra?: E) => {
+export const withInstall = <T, E extends Record<string, unknown>>(name: string, main: T, extra?: E) => {
   ;(main as SFCWithInstall<T>).install = (app: App): void => {
     for (const comp of [main, ...Object.values(extra ?? {})]) {
       const component = comp as Component
-      app.component(component.name || "", component)
+      app.component(name || "", component)
     }
   }
 

package/components/CurdForm/src/index.ts

@@ -1,3 +0,0 @@
-import CurdForm from "./CurdForm.vue"
-export { CurdForm }
-export default CurdForm

package/components/CurdTable/src/index.ts

@@ -1,2 +0,0 @@
-import CurdTable from "./CurdTable.vue"
-export default CurdTable