Add config page

change/@acedatacloud-nexior-66eb3758-a58f-45e3-8cf9-73c0d36a62e7.json

@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "add config page for site",
+  "packageName": "@acedatacloud/nexior",
+  "email": "germey@acedata.cloud",
+  "dependentChangeType": "patch"
+}

package.json

@@ -60,8 +60,8 @@
     "vuex-persistedstate": "^4.0.0"
   },
   "devDependencies": {
-    "@acedatacloud/transmart-cli": "^0.5.0",
     "@rollup/plugin-replace": "^3.0.0",
+    "@transmart/cli": "^0.5.0",
     "@types/lodash": "^4.14.172",
     "@types/markdown-it": "^12.2.3",
     "@types/node": "^16.7.4",

src/components/chat/InputBox.vue

@@ -53,7 +53,7 @@ import { defineComponent } from 'vue';
 import { ElMessage, ElTooltip, ElUpload } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
 import { IChatModel } from '@/models';
-import { getBaseUrlData } from '@/utils';
+import { getBaseUrlPlatform } from '@/utils';
 import { CHAT_MODEL_GPT_4_VISION } from '@/constants';
 
 export default defineComponent({
@@ -86,7 +86,7 @@ export default defineComponent({
       inputHeight: '35px', //add inputHeight
       questionValue: this.question,
       fileList: [],
-      uploadUrl: getBaseUrlData() + '/api/v1/files/'
+      uploadUrl: getBaseUrlPlatform() + '/api/v1/files/'
     };
   },
   computed: {

src/components/chatdoc/UploadDocument.vue

@@ -32,7 +32,7 @@
 import { defineComponent } from 'vue';
 import { ElButton, ElDialog, ElUpload, ElIcon, ElMessage, UploadFiles } from 'element-plus';
 import { UploadFilled } from '@element-plus/icons-vue';
-import { getBaseUrlData } from '@/utils';
+import { getBaseUrlPlatform } from '@/utils';
 
 interface IData {
   dialogVisible: boolean;
@@ -55,7 +55,7 @@ export default defineComponent({
       dialogVisible: false,
       fileList: [],
       learning: false,
-      uploadUrl: getBaseUrlData() + '/api/v1/files/'
+      uploadUrl: getBaseUrlPlatform() + '/api/v1/files/'
     };
   },
   computed: {

src/components/common/AuthPanel.vue

@@ -43,18 +43,18 @@ export default defineComponent({
   },
   computed: {
     iframeUrl() {
-      return `${getBaseUrlAuth()}/auth/login?config=${JSON.stringify(this.$config.auth)}&inviter_id=${this.inviterId}`;
+      return `${getBaseUrlAuth()}/auth/login?inviter_id=${this.inviterId}`;
     },
     inviterId() {
       // if forceInviterId is set, then use forceInviterId
-      if (this.$config?.distribution?.forceInviterId) {
-        return this.$config?.distribution?.forceInviterId;
+      if (this.$store?.state?.site?.distribution?.force_inviter_id) {
+        return this.$store?.state?.site?.distribution?.force_inviter_id;
       }
       // Otherwise, use the inviter_id in the url, then use the inviter_id in the cookie, and finally use the default inviter_id
       const result =
         this.$route.query.inviter_id?.toString() ||
         getCookie('INVITER_ID') ||
-        this.$config?.distribution?.defaultInviterId;
+        this.$store?.state?.site?.distribution?.default_inviter_id;
       return result;
     },
     authenticated() {

src/components/common/DarkSelector.vue

@@ -19,10 +19,10 @@ export default defineComponent({
     ElButton
   },
   emits: ['update:dark'],
-  computed: {
-    dark() {
-      return getCookie('THEME') === 'dark';
-    }
+  data() {
+    return {
+      dark: getCookie('THEME') === 'dark'
+    };
   },
   watch: {
     dark(val) {
@@ -48,6 +48,7 @@ export default defineComponent({
         path: '/',
         domain: getDomain()
       });
+      this.dark = isDark;
     }
   }
 });

src/components/common/Navigator.vue

@@ -31,7 +31,7 @@
     <div class="middle" />
     <div v-if="!collapsed" class="bottom">
       <el-menu :default-active="activeIndex">
-        <el-menu-item v-if="$config.navigation?.console" @click="onConsole">
+        <el-menu-item @click="onConsole">
           <font-awesome-icon icon="fa-solid fa-compass" class="mr-2" />
           <template #title>{{ $t('common.nav.console') }}</template>
         </el-menu-item>
@@ -46,25 +46,32 @@
       </el-menu>
     </div>
     <div v-else class="bottom">
-      <div v-if="$config.navigation?.darkMode" class="link">
+      <div class="link">
         <el-tooltip effect="dark" :content="$t('common.nav.darkMode')" placement="right">
           <dark-selector class="button" />
         </el-tooltip>
       </div>
-      <div v-if="$config.navigation?.locale" class="link">
+      <div class="link">
         <el-tooltip effect="dark" :content="$t('common.nav.locale')" placement="right">
           <el-button class="button">
             <locale-selector />
           </el-button>
         </el-tooltip>
       </div>
-      <div v-if="$config.navigation?.console" class="link">
+      <div class="link">
         <el-tooltip effect="dark" :content="$t('common.nav.console')" placement="right">
           <el-button class="button" @click="onConsole">
             <font-awesome-icon icon="fa-solid fa-compass" />
           </el-button>
         </el-tooltip>
       </div>
+      <div v-if="showSite" class="link">
+        <el-tooltip effect="dark" :content="$t('common.nav.site')" placement="right">
+          <el-button class="button" @click="onSite">
+            <font-awesome-icon icon="fa-solid fa-gear" />
+          </el-button>
+        </el-tooltip>
+      </div>
       <div v-if="showDistribution" class="link">
         <el-tooltip effect="dark" :content="$t('common.nav.distribution')" placement="right">
           <el-button class="button" @click="onDistribution">
@@ -102,7 +109,8 @@ import {
   ROUTE_MIDJOURNEY_HISTORY,
   ROUTE_MIDJOURNEY_INDEX,
   ROUTE_QRART_INDEX,
-  ROUTE_QRART_HISTORY
+  ROUTE_QRART_HISTORY,
+  ROUTE_SITE_INDEX
 } from '@/router/constants';
 import Chevron from './Chevron.vue';
 import Logo from './Logo.vue';
@@ -122,7 +130,7 @@ export default defineComponent({
   },
   data() {
     const links = [];
-    if (this.$config?.navigation?.chat) {
+    if (this.$store?.state?.site?.features?.chat?.enabled) {
       links.push({
         route: {
           name: ROUTE_CHAT_CONVERSATION_NEW
@@ -132,7 +140,7 @@ export default defineComponent({
         routes: [ROUTE_CHAT_CONVERSATION, ROUTE_CHAT_CONVERSATION_NEW]
       });
     }
-    if (this.$config.navigation?.midjourney) {
+    if (this.$store?.state?.site?.features?.midjourney?.enabled) {
       links.push({
         route: {
           name: ROUTE_MIDJOURNEY_INDEX
@@ -143,7 +151,7 @@ export default defineComponent({
       });
     }
 
-    if (this.$config.navigation?.chatdoc) {
+    if (this.$store?.state?.site?.features?.chatdoc?.enabled) {
       links.push({
         route: {
           name: ROUTE_CHATDOC_INDEX
@@ -154,7 +162,7 @@ export default defineComponent({
       });
     }
 
-    if (this.$config.navigation?.qrart) {
+    if (this.$store?.state?.site?.features?.qrart?.enabled) {
       links.push({
         route: {
           name: ROUTE_QRART_INDEX
@@ -174,14 +182,15 @@ export default defineComponent({
     authenticated() {
       return !!this.$store.state.token.access;
     },
+    showSite() {
+      return this.$store?.state?.site?.admins?.includes(this.$store.getters.user?.id);
+    },
     showDistribution() {
       return (
-        // config is enabled
-        this.$config.navigation.distribution &&
         // if forcedInviterId is set, only the forced inviter can see the distribution menu
         // if forcedInviterId is not set, everyone can see the distribution menu
-        (!this.$config.distribution?.forceInviterId ||
-          this.$store.getters.user?.id === this.$config.distribution?.forceInviterId)
+        !this.$store?.state?.site?.distribution?.force_inviter_id ||
+        this.$store.getters.user?.id === this.$store?.state?.site?.distribution?.force_inviter_id
       );
     },
     collapsed: {
@@ -201,6 +210,11 @@ export default defineComponent({
         name: ROUTE_INDEX
       });
     },
+    onSite() {
+      this.$router.push({
+        name: ROUTE_SITE_INDEX
+      });
+    },
     onDistribution() {
       this.$router.push({
         name: ROUTE_DISTRIBUTION_INDEX

src/components/midjourney/ReferenceImage.vue

@@ -2,7 +2,6 @@
   <div class="mb-4">
     <el-upload
       v-model:file-list="fileList"
-      class="upload-demo"
       name="file"
       :limit="5"
       :multiple="true"
@@ -29,7 +28,7 @@
 import { defineComponent } from 'vue';
 import { ElUpload, ElButton, UploadFiles, UploadFile, ElMessage } from 'element-plus';
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
-import { getBaseUrlData } from '@/utils';
+import { getBaseUrlPlatform } from '@/utils';
 
 interface IData {
   fileList: UploadFiles;
@@ -47,7 +46,7 @@ export default defineComponent({
   data(): IData {
     return {
       fileList: [],
-      uploadUrl: getBaseUrlData() + '/api/v1/files/'
+      uploadUrl: getBaseUrlPlatform() + '/api/v1/files/'
     };
   },
   computed: {

src/components/site/EditArray.vue

@@ -0,0 +1,137 @@
+<template>
+  <el-dialog v-model="editing" :title="title" width="400px">
+    <el-tag
+      v-for="(item, itemKey) in value"
+      :key="itemKey"
+      closable
+      round
+      class="mr-2 mb-2"
+      :disable-transitions="false"
+      @close="onClose(item)"
+    >
+      {{ item }}
+    </el-tag>
+    <el-input
+      v-if="inputVisible"
+      ref="input"
+      v-model="inputValue"
+      class="block"
+      size="small"
+      @keyup.enter="onInputConfirm"
+      @blur="onInputConfirm"
+    />
+    <el-button v-else round class="block" size="small" @click="onNewItem"> + </el-button>
+    <span class="block tip">{{ tip }}</span>
+    <template #footer>
+      <span class="dialog-footer">
+        <el-button round @click="onCancel">{{ $t('common.button.cancel') }}</el-button>
+        <el-button round type="primary" @click="onConfirm">{{ $t('common.button.confirm') }}</el-button>
+      </span>
+    </template>
+  </el-dialog>
+  <span class="edit" @click="editing = true">
+    <el-icon class="icon">
+      <edit />
+    </el-icon>
+  </span>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import { ElDialog, ElInput, ElButton, ElIcon, ElTag, ElMessage } from 'element-plus';
+import { Edit } from '@element-plus/icons-vue';
+
+export default defineComponent({
+  name: 'EditText',
+  components: {
+    ElDialog,
+    ElInput,
+    ElButton,
+    ElIcon,
+    ElTag,
+    Edit
+  },
+  props: {
+    modelValue: {
+      type: Array,
+      required: true
+    },
+    title: {
+      type: String,
+      required: true
+    },
+    placeholder: {
+      type: String,
+      required: true
+    },
+    tip: {
+      type: String,
+      default: undefined
+    },
+    min: {
+      type: Number,
+      default: undefined
+    },
+    minErrorMessage: {
+      type: String,
+      default: undefined
+    }
+  },
+  emits: ['confirm', 'cancel'],
+  data() {
+    return {
+      inputVisible: false,
+      inputValue: '',
+      editing: false,
+      value: JSON.parse(JSON.stringify(this.modelValue))
+    };
+  },
+  methods: {
+    onCancel() {
+      this.editing = false;
+    },
+    onConfirm() {
+      if (this.min !== undefined && this.value.length < this.min) {
+        ElMessage.error(this.minErrorMessage);
+        return;
+      }
+      this.$emit('confirm', this.value);
+      this.editing = false;
+    },
+    onClose(item: any) {
+      this.value.splice(this.value.indexOf(item), 1);
+    },
+    onInputConfirm() {
+      const inputValue = this.inputValue;
+      if (inputValue) {
+        this.value.push(inputValue);
+      }
+      this.inputVisible = false;
+      this.inputValue = '';
+    },
+    onNewItem() {
+      this.inputVisible = true;
+      this.$nextTick(() => {
+        // @ts-ignore
+        this.$refs.input.focus();
+      });
+    }
+  }
+});
+</script>
+
+<style lang="scss">
+.edit {
+  cursor: pointer;
+  margin-left: 5px;
+  position: relative;
+  top: 2px;
+  .icon {
+    font-size: 14px;
+  }
+}
+.tip {
+  color: var(--el-text-color-secondary);
+  font-size: 12px;
+}
+</style>