Dev 278 beta2

server/model/system/request/sys_init.go

@@ -15,6 +15,7 @@ type InitDB struct {
 Password string `json:"password"` // 数据库密码
 DBName string `json:"dbName" binding:"required"` // 数据库名
 DBPath string `json:"dbPath"` // sqlite数据库文件路径
+Template string `json:"template"` // postgresql指定template
 }
 
 // MysqlEmptyDsn msyql 空数据库 建库链接

server/resource/package/web/view/table.vue.tpl

@@ -629,7 +629,7 @@ getDataSourceFunc()
  {{- end }}
  {{- end }}
  {{- end }}
- <el-table-column align="left" label="操作" fixed="right" min-width="240">
+ <el-table-column align="left" label="操作" fixed="right" :min-width="appStore.operateMinWith">
  <template #default="scope">
  {{- if .IsTree }}
  <el-button {{ if $global.AutoCreateBtnAuth }}v-auth="btnAuth.add"{{ end }} type="primary" link class="table-button" @click="openDialog(scope.row)"><el-icon style="margin-right: 5px"><InfoFilled /></el-icon>新增子节点</el-button>
@@ -652,7 +652,7 @@ getDataSourceFunc()
  />
  </div>
  </div>
- <el-drawer destroy-on-close size="800" v-model="dialogFormVisible" :show-close="false" :before-close="closeDialog">
+ <el-drawer destroy-on-close :size="appStore.drawerSize" v-model="dialogFormVisible" :show-close="false" :before-close="closeDialog">
  <template #header>
  <div class="flex justify-between items-center">
  <span class="text-lg">{{"{{"}}type==='create'?'新增':'编辑'{{"}}"}}</span>
@@ -751,7 +751,7 @@ getDataSourceFunc()
  </el-form>
  </el-drawer>
 
- <el-drawer destroy-on-close size="800" v-model="detailShow" :show-close="true" :before-close="closeDetailShow" title="查看">
+ <el-drawer destroy-on-close :size="appStore.drawerSize" v-model="detailShow" :show-close="true" :before-close="closeDetailShow" title="查看">
  <el-descriptions :column="1" border>
  {{- if .IsTree }}
  <el-descriptions-item label="父节点">
@@ -855,6 +855,7 @@ import { ref, reactive } from 'vue'
 // 引入按钮权限标识
 import { useBtnAuth } from '@/utils/btnAuth'
 {{- end }}
+import { useAppStore } from "@/pinia"
 
 {{if .HasExcel -}}
 // 导出组件
@@ -877,6 +878,7 @@ defineOptions({
 
 // 提交按钮loading
 const btnLoading = ref(false)
+const appStore = useAppStore()
 
 // 控制更多查询条件显示/隐藏状态
 const showAllQuery = ref(false)

server/service/system/sys_initdb_pgsql.go

@@ -54,7 +54,12 @@ func (h PgsqlInitHandler) EnsureDB(ctx context.Context, conf *request.InitDB) (n
 } // 如果没有数据库名, 则跳出初始化数据
 
 dsn := conf.PgsqlEmptyDsn()
-createSql := fmt.Sprintf("CREATE DATABASE %s;", c.Dbname)
+var createSql string
+if conf.Template != "" {
+createSql = fmt.Sprintf("CREATE DATABASE %s WITH TEMPLATE %s;", c.Dbname, conf.Template)
+} else {
+createSql = fmt.Sprintf("CREATE DATABASE %s;", c.Dbname)
+}
 if err = createDatabase(dsn, "pgx", createSql); err != nil {
 return nil, err
 } // 创建数据库

web/src/components/commandMenu/index.vue

@@ -90,11 +90,11 @@
  const quickArr = [
  {
  label: '亮色主题',
- func: () => changeMode('light')
+ func: () => changeMode(false)
  },
  {
  label: '暗色主题',
- func: () => changeMode('dark')
+ func: () => changeMode(true)
  },
  {
  label: '退出登录',
@@ -135,12 +135,8 @@
  dialogVisible.value = false
  }
 
- const changeMode = (e) => {
- if (e === null) {
- appStore.toggleTheme(false)
- return
- }
- appStore.toggleTheme(true)
+ const changeMode = (darkMode) => {
+ appStore.toggleTheme(darkMode)
  }
 
  const close = () => {

web/src/components/selectImage/selectImage.vue

@@ -23,7 +23,7 @@
  />
  </div>
 
- <el-drawer v-model="drawer" title="媒体库" size="650px">
+ <el-drawer v-model="drawer" title="媒体库" :size="appStore.drawerSize">
  <warning-bar title="点击“文件名/备注”可以编辑文件名或者备注内容。" />
  <div class="gva-btn-list gap-2">
  <upload-common :image-common="imageCommon" @on-success="getImageList" />
@@ -124,6 +124,9 @@
  import { ElMessage, ElMessageBox } from 'element-plus'
  import { Picture as IconPicture } from '@element-plus/icons-vue'
  import selectComponent from '@/components/selectImage/selectComponent.vue'
+ import { useAppStore } from "@/pinia";
+
+ const appStore = useAppStore()
 
  const imageUrl = ref('')
  const imageCommon = ref('')

web/src/hooks/charts.js

@@ -7,7 +7,7 @@ import { useAppStore } from '@/pinia'
 export default function useChartOption(sourceOption) {
  const appStore = useAppStore()
  const isDark = computed(() => {
- return appStore.theme === 'dark'
+ return appStore.isDark
  })
  const chartOption = computed(() => {
  return sourceOption(isDark.value)

web/src/pathInfo.json

@@ -64,4 +64,4 @@
  "/src/plugin/announcement/form/info.vue": "InfoForm",
  "/src/plugin/announcement/view/info.vue": "Info",
  "/src/plugin/email/view/index.vue": "Email"
-}
+}

web/src/pinia/modules/app.js

@@ -1,8 +1,12 @@
 import { defineStore } from 'pinia'
 import { ref, watchEffect, reactive } from 'vue'
 import { setBodyPrimaryColor } from '@/utils/format'
+import { useDark, usePreferredDark } from '@vueuse/core'
+
 export const useAppStore = defineStore('app', () => {
  const device = ref('')
+ const drawerSize = ref('')
+ const operateMinWith = ref('240')
  const config = reactive({
  weakness: false,
  grey: false,
@@ -16,14 +20,17 @@ export const useAppStore = defineStore('app', () => {
  side_mode: 'normal'
  })
 
- const theme = ref('auto')
+ const isDark = useDark({
+ selector: 'html',
+ attribute: 'class',
+ valueDark: 'dark',
+ valueLight: 'light',
+ })
 
- const toggleTheme = (dark) => {
- if (dark) {
- theme.value = 'dark'
- } else {
- theme.value = 'light'
- }
+ const preferredDark = usePreferredDark()
+
+ const toggleTheme = (darkMode) => {
+ isDark.value = darkMode
  }
 
  const toggleWeakness = (e) => {
@@ -43,22 +50,28 @@ export const useAppStore = defineStore('app', () => {
  }
 
  const toggleDevice = (e) => {
+ if(e === 'mobile'){
+ drawerSize.value = '100%'
+ operateMinWith.value = '80'
+ }else {
+ drawerSize.value = '800'
+ operateMinWith.value = '240'
+ }
  device.value = e
  }
 
  const toggleDarkMode = (e) => {
  config.darkMode = e
  }
 
- const toggleDarkModeAuto = () => {
- // 处理浏览器主题
- const darkQuery = window.matchMedia('(prefers-color-scheme: dark)')
- const dark = darkQuery.matches
- toggleTheme(dark)
- darkQuery.addEventListener('change', (e) => {
- toggleTheme(e.matches)
- })
- }
+ // 监听系统主题变化
+ watchEffect(() => {
+ if (config.darkMode === 'auto') {
+ isDark.value = preferredDark.value
+ return
+ }
+ isDark.value = config.darkMode === 'dark'
+ })
 
  const toggleConfigSideWidth = (e) => {
  config.layout_side_width = e
@@ -76,55 +89,26 @@ export const useAppStore = defineStore('app', () => {
  config.show_watermark = e
  }
 
- const toggleSideModel = (e) => {
+ const toggleSideMode = (e) => {
  config.side_mode = e
  }
 
+ // 监听色弱模式和灰色模式
  watchEffect(() => {
- if (theme.value === 'dark') {
- document.documentElement.classList.add('dark')
- document.documentElement.classList.remove('light')
- } else {
- document.documentElement.classList.add('light')
- document.documentElement.classList.remove('dark')
- }
- })
- watchEffect(() => {
- // 色弱模式监听处理
- if (config.weakness) {
- document.documentElement.classList.add('html-weakenss')
- } else {
- document.documentElement.classList.remove('html-weakenss')
- }
- })
- watchEffect(() => {
- // 灰色模式监听处理
- if (config.grey) {
- document.documentElement.classList.add('html-grey')
- } else {
- document.documentElement.classList.remove('html-grey')
- }
- })
-
- watchEffect(() => {
- if (config.darkMode === 'auto') {
- toggleDarkModeAuto()
- }
-
- if (config.darkMode === 'dark') {
- toggleTheme(true)
- } else {
- toggleTheme(false)
- }
+ document.documentElement.classList.toggle('html-weakenss', config.weakness)
+ document.documentElement.classList.toggle('html-grey', config.grey)
  })
 
+ // 监听主题色
  watchEffect(() => {
- setBodyPrimaryColor(config.primaryColor, theme.value)
+ setBodyPrimaryColor(config.primaryColor, isDark.value ? 'dark' : 'light')
  })
 
  return {
- theme,
+ isDark,
  device,
+ drawerSize,
+ operateMinWith,
  config,
  toggleTheme,
  toggleDevice,
@@ -137,6 +121,6 @@ export const useAppStore = defineStore('app', () => {
  toggleConfigSideCollapsedWidth,
  toggleConfigSideItemHeight,
  toggleConfigWatermark,
- toggleSideModel
+ toggleSideMode
  }
 })

web/src/view/dashboard/components/charts-content-numbers.vue

@@ -25,8 +25,7 @@
  }
  })
  const dotColor = computed(() => {
- console.log(appStore.theme)
- return appStore.theme === 'dark' ? '#333' : '#E5E8EF'
+ return appStore.isDark ? '#333' : '#E5E8EF'
  })
  const graphicFactory = (side) => {
  return {

web/src/view/init/index.vue

@@ -111,6 +111,12 @@
  placeholder="请输入sqlite数据库文件存放路径"
  />
  </el-form-item>
+ <el-form-item v-if="form.dbType === 'pgsql'" label="template">
+ <el-input
+ v-model="form.template"
+ placeholder="请输入postgresql指定template"
+ />
+ </el-form-item>
  <el-form-item>
  <div style="text-align: right">
  <el-button type="primary" @click="onSubmit">立即初始化</el-button>
@@ -192,7 +198,8 @@
  userName: 'postgres',
  password: '',
  dbName: 'gva',
- dbPath: ''
+ dbPath: '',
+ template: 'template0'
  })
  break
  case 'oracle':

web/src/view/layout/header/index.vue

@@ -9,7 +9,8 @@
  >
  <div class="flex items-center cursor-pointer flex-1">
  <div
- class="flex items-center cursor-pointer min-w-48"
+ class="flex items-center cursor-pointer"
+ :class="isMobile ? '' : 'min-w-48'"
  @click="router.push({ path: '/' })"
  >
  <img

web/src/view/layout/header/tools.vue

@@ -58,10 +58,9 @@
  effect="dark"
  content="切换主题"
  placement="bottom"
- :disabled="appStore.theme === 'auto'"
  >
  <el-icon
- v-if="appStore.theme === 'dark'"
+ v-if="appStore.isDark"
  class="w-8 h-8 shadow rounded-full border border-gray-600 cursor-pointer border-solid"
  @click="appStore.toggleTheme(false)"
  >

web/src/view/layout/index.vue

@@ -62,7 +62,7 @@
  import { useAppStore } from '@/pinia'
  import { storeToRefs } from 'pinia'
  const appStore = useAppStore()
- const { config, theme, device } = storeToRefs(appStore)
+ const { config, isDark, device } = storeToRefs(appStore)
 
  defineOptions({
  name: 'GvaLayout'
@@ -75,7 +75,7 @@
 
  watchEffect(() => {
  font.color =
- theme.value === 'dark' ? 'rgba(255,255,255, .15)' : 'rgba(0, 0, 0, .15)'
+ isDark.value ? 'rgba(255,255,255, .15)' : 'rgba(0, 0, 0, .15)'
  })
 
  const router = useRouter()

web/src/view/layout/setting/index.vue

@@ -71,7 +71,7 @@
  v-model="config.side_mode"
  :options="sideModes"
  size="default"
- @change="appStore.toggleSideModel"
+ @change="appStore.toggleSideMode"
  />
  <!-- <el-select
  v-model="config.side_mode"