@qqt-product/system 0.0.1 → 0.0.16

package/src/lib/components/QI18nList/src/QI18nList.vue

@@ -1,361 +1,365 @@
-<template>
-  <div style="height: 100%">
-    <q-list-layout ref="listLayoutRef" v-if="!showEditPage" :pageData="pageData" :apiUrls="apiUrls" />
-
-    <!--新增-->
-    <vxe-modal v-model="addZhWord" title="添加词条" type="confirm" show-footer @confirm="addZhWordHandle('confirm')" @cancel="addZhWordHandle('cancel')">
-      <vxe-form title-colon title-align="right" title-width="160" :data="addZhWordFrom" :loading="addZhWordLoading">
-        <vxe-form-gather span="24">
-          <vxe-form-item title="词条类型" field="translateType" span="24">
-            <template #default="{ data }">
-              <q-select style="width: 200px" v-model:value="data.translateType" dict-code="translateType"></q-select>
-            </template>
-          </vxe-form-item>
-          <vxe-form-item title="中文内容" field="i18nValue" span="24">
-            <template #default="{ data }">
-              <vxe-input v-model="data.i18nValue" type="text" placeholder="请输入中文内容" clearable></vxe-input>
-            </template>
-          </vxe-form-item>
-        </vxe-form-gather>
-      </vxe-form>
-    </vxe-modal>
-
-    <!--翻译-->
-    <vxe-modal v-model="translateVisible" title="翻译" type="confirm" show-footer @confirm="translateHandle('confirm')">
-      <q-select style="width: 200px" v-model:value="languageValue" dict-code="language"></q-select>
-    </vxe-modal>
-
-    <!--编辑-->
-    <QI18nForm v-if="showEditPage" title="编辑" :currentRow="itemInfoRow" @hide="showEditPage = false" />
-  </div>
-</template>
-
-<script lang="ts">
-//JS
-import { defineComponent, reactive, ref, inject, nextTick } from 'vue'
-//hook
-import { useConfigData } from './useConfigData'
-//组件
-import { Modal, message } from '@qqt-product/ui'
-import QI18nForm from './QI18nForm.vue'
-//ts
-import { INJECT_HTTP, HttpClient, MapObjectNoneType } from '../../../utils/global.types'
-
-export default defineComponent({
-  name: 'QI18nList',
-  components: {
-    QI18nForm,
-  },
-  props: {
-    userInfo: {
-      type: Object,
-      defalut: () => {
-        return {}
-      },
-    },
-  },
-  setup() {
-    //data-hook
-    const { itemInfoRow, languageValue, translateVisible, showEditPage, apiUrls, addZhWord, addZhWordFrom, addZhWordLoading } = useConfigData()
-    //data
-    const qHttp = inject(INJECT_HTTP) as HttpClient
-    const pageData = reactive({
-      statusConfig: {
-        show: false,
-      },
-      optColumn: {
-        attrs: {},
-        extend: {},
-        optColumnList: [
-          { authorityCode: 'i18n#I18n:editNew', type: 'edit', title: '编辑', click: handleEdit },
-          {
-            type: 'delete',
-            title: '删除',
-            authorityCode: 'i18n#I18n:delete',
-            // args: {
-            //   url: apiUrls.value.deleteWord,
-            // },
-            click: I18nRowDel,
-            // allow: allowDelete,
-          },
-        ],
-      },
-      buttonConfig: {
-        attrs: {},
-        extend: {},
-        buttons: [
-          {
-            authorityCode: 'i18n#I18n:add',
-            label: '新增',
-            icon: {
-              type: 'icon-Q-add',
-            },
-            attrs: {
-              type: 'primary',
-            },
-            click: addRow,
-          },
-          {
-            label: '导入',
-            icon: {
-              type: 'icon-Q-import',
-            },
-            type: 'import',
-            args: {
-              url: '/base/i18n/importExcel',
-              excelCode: 'i18n',
-            },
-          },
-          {
-            label: '导出',
-            icon: {
-              type: 'icon-Q-export',
-            },
-            args: {
-              url: '/base/i18n/exportXls',
-            },
-            type: 'export',
-          },
-          { authorityCode: 'i18n#I18n:delRedisData', label: '清除缓存', click: delRedis },
-          { authorityCode: 'i18n#I18n:delRedisData', label: '清除菜单缓存', click: delPerRedis },
-          { authorityCode: 'i18n#I18n:translateData', label: '翻译', click: translate },
-          { authorityCode: 'i18n#I18n:translateAll', label: '一键翻译', click: translateAll },
-          {
-            label: '列自定义',
-            icon: {
-              type: 'icon-Q-setting',
-            },
-            type: 'setting',
-          },
-          {
-            label: '帮助说明',
-            icon: {
-              type: 'icon-Q-help-text',
-            },
-            type: 'help-text',
-          },
-          {
-            label: '附件说明',
-            icon: {
-              type: 'icon-Q-attachment-text',
-            },
-            type: 'attachment-text',
-          },
-        ],
-      },
-      queryConfig: {
-        attrs: {},
-        extend: {},
-        form: [
-          {
-            type: 'input',
-            label: '国际化key',
-            fieldName: 'i18nKey',
-            placeholder: '请输入国际化key',
-          },
-          {
-            type: 'input',
-            label: '国际化名称',
-            fieldName: 'chinese',
-            placeholder: '请输入国际化名称',
-          },
-        ],
-        formState: {
-          i18nKey: '',
-          chinese: '',
-        },
-      },
-      pagerConfig: {},
-    })
-    const listLayoutRef = ref()
-
-    function delRedis() {
-      Modal.confirm({
-        title: '提示',
-        content: '确认清除缓存?',
-        onOk() {
-          listLayoutRef.value.loading = true
-          qHttp
-            .get({
-              url: apiUrls.value.delRedisData,
-            })
-            .then((res) => {
-              if (res.success) {
-                message.success(res.message)
-                listLayoutRef.value.fetchListData()
-              } else {
-                message.warning(res.message)
-              }
-            })
-            .finally(() => {
-              listLayoutRef.value.loading = true
-            })
-        },
-      })
-    }
-
-    function delPerRedis() {
-      Modal.confirm({
-        title: '提示',
-        content: '确认清除缓存?',
-        onOk() {
-          listLayoutRef.value.loading = true
-          qHttp
-            .get({
-              url: apiUrls.value.delPerRedis,
-            })
-            .then((res) => {
-              if (res.success) {
-                message.success(res.message)
-                listLayoutRef.value.fetchListData()
-              } else {
-                message.warning(res.message)
-              }
-            })
-            .finally(() => {
-              listLayoutRef.value.loading = true
-            })
-        },
-      })
-    }
-
-    function translateAll() {
-      listLayoutRef.value.loading = true
-      qHttp
-        .get({
-          url: apiUrls.value.translateAll,
-        })
-        .then((res) => {
-          listLayoutRef.value.loading = false
-          if (res.success) {
-            // this.$message.success(res.message)
-            message.success('操作成功')
-          } else {
-            // this.$message.warning(res.message)
-            message.warning('操作失败')
-          }
-        })
-        .catch(() => {
-          listLayoutRef.value.loading = false
-        })
-    }
-
-    function addRow() {
-      addZhWord.value = true
-    }
-    function addZhWordHandle(handleType: string) {
-      if (handleType == 'confirm') {
-        if (!addZhWordFrom.value.i18nValue && !addZhWordFrom.value.i18nValue) {
-          message.error('请填写词条类型和中文内容')
-        } else {
-          listLayoutRef.value.loading = true
-          qHttp
-            .post({
-              url: apiUrls.value.add,
-              data: {
-                translateType: addZhWordFrom.value.translateType,
-                i18nValue: addZhWordFrom.value.i18nValue,
-              },
-            })
-            .then((res) => {
-              listLayoutRef.value.loading = false
-              if (res.success) {
-                // this.$message.success(res.message)
-                message.success('操作成功')
-                listLayoutRef.value.fetchListData()
-              } else {
-                // this.$message.warning(res.message)
-                message.warning('操作失败')
-              }
-            })
-            .catch(() => {
-              listLayoutRef.value.loading = false
-            })
-        }
-      } else {
-        addZhWordFrom.value = {
-          translateType: '',
-          i18nValue: '',
-        }
-      }
-    }
-
-    function I18nRowDel({ row = {} as MapObjectNoneType }) {
-      Modal.confirm({
-        title: '提示',
-        content: '是否需要删除行?',
-        onOk() {
-          listLayoutRef.value.loading = true
-          qHttp
-            .get({
-              url: apiUrls.value.deleteWord,
-              params: { i18nKey: row.i18nKey },
-            })
-            .then((res) => {
-              if (res.success) {
-                message.success(res.message)
-                listLayoutRef.value.fetchListData()
-              } else {
-                message.warning(res.message)
-              }
-            })
-            .finally(() => {
-              listLayoutRef.value.loading = true
-            })
-        },
-      })
-    }
-
-    function translate() {
-      translateVisible.value = true
-    }
-
-    function translateHandle(handleType: string) {
-      if (handleType == 'confirm') {
-        if (languageValue.value == 'zh') {
-          message.warning('中文不需要翻译！')
-        } else {
-          listLayoutRef.value.loading = true
-          qHttp
-            .get({
-              url: apiUrls.value.translateData,
-              params: { to: languageValue.value },
-            })
-            .then((res) => {
-              if (res.success) {
-                message.success('操作成功！')
-                listLayoutRef.value.fetchListData()
-              }
-            })
-            .finally(() => {
-              listLayoutRef.value.loading = false
-              translateVisible.value = false
-            })
-        }
-      }
-    }
-
-    function handleEdit({ row = {} as MapObjectNoneType }) {
-      itemInfoRow.value = row
-      nextTick(() => {
-        showEditPage.value = true
-      })
-    }
-
-    return {
-      itemInfoRow,
-      translateHandle,
-      languageValue,
-      translateVisible,
-      addZhWordHandle,
-      showEditPage,
-      apiUrls,
-      pageData,
-      listLayoutRef,
-      addZhWord,
-      addZhWordFrom,
-      addZhWordLoading,
-    }
-  },
-})
-</script>
+<template>
+  <div style="height: 100%">
+    <q-list-layout ref="listLayoutRef" v-if="!showEditPage" :pageData="pageData" :apiUrls="apiUrls" />
+
+    <!--新增-->
+    <vxe-modal v-model="addZhWord" title="添加词条" type="confirm" width="600" show-footer @confirm="addZhWordHandle('confirm')" @cancel="addZhWordHandle('cancel')">
+      <vxe-form title-colon title-align="right" title-width="120" :data="addZhWordFrom" :loading="addZhWordLoading">
+        <vxe-form-gather span="24">
+          <vxe-form-item title="词条类型" field="translateType" span="24">
+            <template #default="{ data }">
+              <q-select style="width: 100%" v-model:value="data.translateType" dict-code="translateType"></q-select>
+            </template>
+          </vxe-form-item>
+          <vxe-form-item title="中文内容" field="i18nValue" span="24">
+            <template #default="{ data }">
+              <vxe-input style="width: 100%" v-model="data.i18nValue" type="text" placeholder="请输入中文内容" clearable></vxe-input>
+              <!-- <a-input style="width: 200px" v-model:value="data.i18nValue" placeholder="请输入中文内容" clearable /> -->
+            </template>
+          </vxe-form-item>
+        </vxe-form-gather>
+      </vxe-form>
+    </vxe-modal>
+
+    <!--翻译-->
+    <vxe-modal v-model="translateVisible" title="翻译" type="confirm" show-footer @confirm="translateHandle('confirm')">
+      <q-select style="width: 200px" v-model:value="languageValue" dict-code="language"></q-select>
+    </vxe-modal>
+
+    <!--编辑-->
+    <QI18nForm v-if="showEditPage" title="编辑" :currentRow="itemInfoRow" @hide="showEditPage = false" />
+  </div>
+</template>
+
+<script lang="ts">
+//JS
+import { defineComponent, reactive, ref, inject, nextTick } from 'vue'
+//hook
+import { useConfigData } from './useConfigData'
+//组件
+import { Modal, message } from '@qqt-product/ui'
+import QI18nForm from './QI18nForm.vue'
+//ts
+import { INJECT_HTTP, HttpClient, MapObjectNoneType } from '../../../utils/global.types'
+
+export default defineComponent({
+  name: 'QI18nList',
+  components: {
+    QI18nForm,
+  },
+  props: {
+    userInfo: {
+      type: Object,
+      defalut: () => {
+        return {}
+      },
+    },
+  },
+  setup(props) {
+    //data-hook
+    const { itemInfoRow, languageValue, translateVisible, showEditPage, apiUrls, addZhWord, addZhWordFrom, addZhWordLoading } = useConfigData()
+    //data
+    const qHttp = inject(INJECT_HTTP) as HttpClient
+    const pageData = reactive({
+      statusConfig: {
+        show: false,
+      },
+      optionConfig: {
+        attrs: {},
+        extend: {},
+        options: [
+          { authorityCode: 'i18n#I18n:editNew', type: 'edit', title: '编辑', click: handleEdit },
+          {
+            type: 'delete',
+            title: '删除',
+            authorityCode: 'i18n#I18n:delete',
+            // args: {
+            //   url: apiUrls.value.deleteWord,
+            // },
+            click: I18nRowDel,
+            // allow: allowDelete,
+          },
+        ],
+      },
+      buttonConfig: {
+        attrs: {},
+        extend: {},
+        buttons: [
+          {
+            authorityCode: 'i18n#I18n:add',
+            label: '新增',
+            icon: {
+              type: 'icon-Q-add',
+            },
+            attrs: {
+              type: 'primary',
+            },
+            click: addRow,
+          },
+          {
+            label: '导入',
+            icon: {
+              type: 'icon-Q-import',
+            },
+            type: 'import',
+            args: {
+              url: '/base/i18n/importExcel',
+              excelCode: 'i18n',
+            },
+          },
+          {
+            label: '导出',
+            icon: {
+              type: 'icon-Q-export',
+            },
+            args: {
+              url: '/base/i18n/exportXls',
+            },
+            type: 'export',
+          },
+          { authorityCode: 'i18n#I18n:delRedisData', label: '清除缓存', click: delRedis },
+          { authorityCode: 'i18n#I18n:delRedisData', label: '清除菜单缓存', click: delPerRedis },
+          { authorityCode: 'i18n#I18n:translateData', label: '翻译', click: translate },
+          { authorityCode: 'i18n#I18n:translateAll', label: '一键翻译', click: translateAll },
+          {
+            label: '列自定义',
+            icon: {
+              type: 'icon-Q-setting',
+            },
+            type: 'setting',
+          },
+          {
+            label: '帮助说明',
+            icon: {
+              type: 'icon-Q-help-text',
+            },
+            type: 'help-text',
+          },
+          {
+            label: '附件说明',
+            icon: {
+              type: 'icon-Q-attachment-text',
+            },
+            type: 'attachment-text',
+          },
+        ],
+      },
+      queryConfig: {
+        attrs: {},
+        extend: {},
+        form: [
+          {
+            type: 'input',
+            label: '国际化key',
+            fieldName: 'i18nKey',
+            placeholder: '请输入国际化key',
+          },
+          {
+            type: 'input',
+            label: '国际化名称',
+            fieldName: 'chinese',
+            placeholder: '请输入国际化名称',
+          },
+        ],
+      },
+      pagerConfig: {},
+    })
+    const listLayoutRef = ref()
+
+    function delRedis() {
+      Modal.confirm({
+        title: '提示',
+        content: '确认清除缓存?',
+        onOk() {
+          listLayoutRef.value.loading = true
+          qHttp
+            .get({
+              url: apiUrls.value.delRedisData,
+            })
+            .then((res) => {
+              if (res.success) {
+                message.success(res.message)
+                listLayoutRef.value.fetchListData()
+              } else {
+                message.warning(res.message)
+              }
+            })
+            .finally(() => {
+              listLayoutRef.value.loading = true
+            })
+        },
+      })
+    }
+
+    function delPerRedis() {
+      Modal.confirm({
+        title: '提示',
+        content: '确认清除缓存?',
+        onOk() {
+          listLayoutRef.value.loading = true
+          qHttp
+            .get({
+              url: apiUrls.value.delPerRedis,
+            })
+            .then((res) => {
+              if (res.success) {
+                message.success(res.message)
+                listLayoutRef.value.fetchListData()
+              } else {
+                message.warning(res.message)
+              }
+            })
+            .finally(() => {
+              listLayoutRef.value.loading = true
+            })
+        },
+      })
+    }
+
+    function translateAll() {
+      listLayoutRef.value.loading = true
+      qHttp
+        .get({
+          url: apiUrls.value.translateAll,
+        })
+        .then((res) => {
+          listLayoutRef.value.loading = false
+          if (res.success) {
+            // this.$message.success(res.message)
+            message.success('操作成功')
+          } else {
+            // this.$message.warning(res.message)
+            message.warning('操作失败')
+          }
+        })
+        .catch(() => {
+          listLayoutRef.value.loading = false
+        })
+    }
+
+    function addRow() {
+      // console.log(props.userInfo?.userInfo?.elsAccount)
+      const elsAccount = props.userInfo?.userInfo?.elsAccount
+
+      if (elsAccount != '100000') {
+        message.warning('请在平台添加词条！')
+        return
+      }
+      addZhWord.value = true
+    }
+    function addZhWordHandle(handleType: string) {
+      if (handleType == 'confirm') {
+        if (!addZhWordFrom.value.i18nValue && !addZhWordFrom.value.i18nValue) {
+          message.error('请填写词条类型和中文内容')
+        } else {
+          listLayoutRef.value.loading = true
+          qHttp
+            .post({
+              url: apiUrls.value.add,
+              data: {
+                translateType: addZhWordFrom.value.translateType,
+                i18nValue: addZhWordFrom.value.i18nValue,
+              },
+            })
+            .then((res) => {
+              listLayoutRef.value.loading = false
+              if (res.success) {
+                // this.$message.success(res.message)
+                message.success('操作成功')
+                listLayoutRef.value.fetchListData()
+              } else {
+                // this.$message.warning(res.message)
+                message.warning('操作失败')
+              }
+            })
+            .catch(() => {
+              listLayoutRef.value.loading = false
+            })
+        }
+      } else {
+        addZhWordFrom.value = {
+          translateType: '',
+          i18nValue: '',
+        }
+      }
+    }
+
+    function I18nRowDel({ row = {} as MapObjectNoneType }) {
+      Modal.confirm({
+        title: '提示',
+        content: '是否需要删除行?',
+        onOk() {
+          listLayoutRef.value.loading = true
+          qHttp
+            .get({
+              url: apiUrls.value.deleteWord,
+              params: { i18nKey: row.i18nKey },
+            })
+            .then((res) => {
+              if (res.success) {
+                message.success(res.message)
+                listLayoutRef.value.fetchListData()
+              } else {
+                message.warning(res.message)
+              }
+            })
+            .finally(() => {
+              listLayoutRef.value.loading = true
+            })
+        },
+      })
+    }
+
+    function translate() {
+      translateVisible.value = true
+    }
+
+    function translateHandle(handleType: string) {
+      if (handleType == 'confirm') {
+        if (languageValue.value == 'zh') {
+          message.warning('中文不需要翻译！')
+        } else {
+          listLayoutRef.value.loading = true
+          qHttp
+            .get({
+              url: apiUrls.value.translateData,
+              params: { to: languageValue.value },
+            })
+            .then((res) => {
+              if (res.success) {
+                message.success('操作成功！')
+                listLayoutRef.value.fetchListData()
+              }
+            })
+            .finally(() => {
+              listLayoutRef.value.loading = false
+              translateVisible.value = false
+            })
+        }
+      }
+    }
+
+    function handleEdit({ row = {} as MapObjectNoneType }) {
+      itemInfoRow.value = row
+      nextTick(() => {
+        showEditPage.value = true
+      })
+    }
+
+    return {
+      itemInfoRow,
+      translateHandle,
+      languageValue,
+      translateVisible,
+      addZhWordHandle,
+      showEditPage,
+      apiUrls,
+      pageData,
+      listLayoutRef,
+      addZhWord,
+      addZhWordFrom,
+      addZhWordLoading,
+    }
+  },
+})
+</script>