zsysview 0.0.16 → 0.0.18

package/dist/zsysview.es.js

@@ -0,0 +1,2 @@
+import "vue";
+import "./index-C_d1JnWR.js";

package/package.json

@@ -1,20 +1,34 @@
-{
-  "name": "zsysview",
-  "version": "0.0.16",
-  "description": "zsystem view",
-  "author": {
-    "name": "liuhaomiao"
-  },
-  "private": false,
-  "dependencies": {},
-  "peerDependencies": {
-    "axios": "^1.12.2",
-    "element-plus": "^2.11.2",
-    "json-bigint": "^1.0.0",
-    "ts-md5": "^2.0.1",
-    "vue": "^3.5.18",
-    "vue-router": "^4.5.1",
-    "pinia": "^3.0.2",
-    "pinia-plugin-persistedstate": "^4.3.0"
-  }
-}
+{
+  "name": "zsysview",
+  "private": false,
+  "version": "0.0.18",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/zsysview.umd.js",
+  "module": "./dist/zsysview.es.js",
+  "exports": {
+    ".": {
+      "import": "./dist/zsysview.es.js",
+      "require": "./dist/zsysview.umd.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vue-tsc -b && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "element-plus": "^2.11.5",
+    "vue": "^3.5.22"
+  },
+  "devDependencies": {
+    "@types/node": "^24.6.0",
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vue/tsconfig": "^0.8.1",
+    "typescript": "~5.9.3",
+    "vite": "^7.1.7",
+    "vue-tsc": "^3.1.0"
+  }
+}

package/components/export/export_dialog.vue

@@ -1,150 +0,0 @@
-<!-- ReusableDialog.vue -->
-<template>
-  <el-dialog v-model="visible" title="导出" :align-center="true" :before-close="handleBeforeClose" @open="open"
-    width="800" :draggable="true" :overflow="true" @opened="focus" destroy-on-close :close-on-click-modal="false">
-    <!-- 默认插槽放主要内容 -->
-    <el-form @submit.prevent ref="ruleFormRef" :model="form" :rules="rules"
-      style="padding-left: 10px;padding-right: 10px;" label-width="auto" v-show="view.exporting == false">
-      <el-form-item label="字段选项" prop="role_title">
-        <el-radio-group v-model="form.columnOption">
-          <el-radio value="all">全部支持的字段</el-radio>
-          <el-radio v-if="props.exportColumn ? true : false" value="custom">自定义</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item label="自定义" v-show="form.columnOption == 'custom'">
-        <!-- v-model="form.permission_value" :data="permission_option" -->
-        <el-transfer v-model="form.exportColumnWanted" :data="props.exportColumn" :titles="['可选', '已选']" :props="{
-          key: 'ColumnName',
-          label: 'ColumnTitle',
-        }">
-          <template #left-empty>
-            <el-empty :image-size="60" description="无可选项" />
-          </template>
-          <template #right-empty>
-            <el-empty :image-size="60" description="请从左侧选择" />
-          </template>
-        </el-transfer>
-      </el-form-item>
-    </el-form>
-
-    <export_progress v-show="view.exporting" :export-id="view.exportId"></export_progress>
-
-    <!-- 底部按钮区插槽 -->
-    <template #footer>
-      <div style="display: flex;justify-content: right;">
-        <el-button type="primary" @click="startExport" v-show="view.exporting == false">开始导出</el-button>
-        <!-- <el-button @click="close">取消</el-button> -->
-      </div>
-
-    </template>
-  </el-dialog>
-</template>
-
-<script setup lang="ts">
-import { ref, watch, reactive } from 'vue';
-import { HttpApiV1 as http } from '../../core/httpapi/http_api_v1';
-import { ZSYSMessage } from '../../components/message';
-import type { FormInstance, FormRules, ElInput } from 'element-plus'
-import { useMagicKeys, whenever } from '@vueuse/core'
-import export_progress from './export_progress.vue';
-const inputRef = ref<InstanceType<typeof ElInput> | null>(null)
-const props = defineProps({
-  modelValue: { type: Boolean, required: true }, // 控制显示隐藏
-  exportUrl: { type: String, required: true },
-  exportColumn: { type: [] }
-});
-
-const emit = defineEmits<{
-  (e: 'update:modelValue', value: boolean): void;
-  // (e: 'confirm'): void;
-  // (e: 'close'): void;
-}>();
-
-const visible = ref(false);
-
-// 同步外部 v-model 变化
-watch(
-  () => props.modelValue,
-  (val) => {
-    visible.value = val;
-  },
-  { immediate: true }
-);
-
-// 内部状态变化通知外部
-watch(visible, (val) => {
-  emit('update:modelValue', val);
-});
-
-//弹窗显示时的处理
-const open = () => {
-  view.exporting = false
-}
-
-// const close = () => {
-//   visible.value = false;
-//   // emit('close');
-// };
-
-const handleBeforeClose = (done: () => void) => {
-  ruleFormRef.value?.clearValidate();
-  // 可以在这里添加关闭前的拦截逻辑
-  done();
-};
-
-const view = reactive({
-  exporting: false,// 导出框当前的状态
-  exportId:0n//导出id
-})
-
-
-
-//^^^^^^^^^^^^^^^上方为对话框功能^^^^^^^^^^^^^^^
-
-//===============下方为数据部分===============
-//开始请求后台导出
-async function startExport() {
-  view.exporting = true
-  let res = await http.Post(props.exportUrl, {})
-  if (res.IsSuccess) {
-    view.exportId=BigInt(res.data as unknown as bigint)
-  } else {
-    ZSYSMessage.ShowError(res.message)
-    view.exporting = false
-  }
-}
-
-//=================表单
-const ruleFormRef = ref<FormInstance>()
-const form = ref({
-  columnOption: 'all',
-  exportColumnWanted: []
-})
-
-const rules = reactive<FormRules<typeof form>>({
-
-})
-//=================
-
-const focus = () => {
-  inputRef.value?.focus()
-  inputRef.value?.select()
-}
-
-//==========快捷键
-const keys = useMagicKeys()
-
-whenever(keys.alt_s, () => {
-  if (visible.value) {
-    console.log('Alt+S提交')
-  }
-  // 在这里执行你的业务逻辑
-})
-
-</script>
-
-<style scoped>
-.el-transfer /deep/ .el-transfer-panel {
-  width: 240px;
-}
-</style>

package/components/export/export_progress.vue

@@ -1,62 +0,0 @@
-<template>
-    <div style="padding-left: 20px; padding-right: 20px; padding-top: 6px;">
-        <div v-if="view.state == 1" style="font-size: x-large;">正在导出</div>
-        <div v-if="view.state == 2" style="font-size: x-large;">导出完成</div>
-        <div style="font-size:large; margin-top: 10px;">
-            累计处理: {{ view.progress }}
-        </div>
-        <el-progress v-if="view.state == 1" :percentage="50" :indeterminate="true" style="margin-top: 10px;">
-            {{ view.progress }}
-        </el-progress>
-        <el-space v-if="view.state == 2" wrap style="font-size:large; margin-top: 10px;">
-            <el-text>文件(点击下载):</el-text>
-                <el-link v-for="item of view.file_ids" :href="http.url_export_file+'?id='+item.toString()" target="_blank"
-                    underline="always" type="primary">文件{{ item.toString() }}</el-link>
-            </el-space>
-
-    </div>
-
-</template>
-
-<script setup lang="ts">
-import { reactive, watch, type PropType } from 'vue';
-import { HttpApiV1 as http } from '../../core/httpapi/http_api_v1';
-const props = defineProps({
-    exportId: { type: BigInt as unknown as PropType<bigint>, required: true }
-});
-
-const view = reactive({
-    state: 1,
-    progress: 0n,
-    file_ids: [] as bigint[]
-})
-
-
-watch(props, (newVal) => {
-    if (newVal.exportId != 0n) {
-        var intervalId = setInterval(async () => {
-            let xRes = await http.Post(http.url_export_detail, { id: props.exportId })
-            if (xRes.IsSuccess) {
-                let data = xRes.data as {
-                    progress: bigint,
-                    state: number,
-                    file_ids: string
-                }
-                view.progress = data.progress
-                view.state = data.state
-                view.file_ids = []
-                let fs = data.file_ids.split(',')
-                for (let f of fs) {
-                    view.file_ids.push(BigInt(f))
-                }
-
-                if (view.state != 1) { clearInterval(intervalId) }
-            }
-            // completeExport()
-        }, 3600);
-    }
-});
-
-</script>
-
-<style scoped></style>

package/components/list/zsyslist.vue

@@ -1,164 +0,0 @@
-<template>
-  <div v-loading="view.loading">
-    <!-- 工具条 -->
-    <zsyslist_header
-      :config="config"
-      v-model:query="query"
-      @refresh="GetListData()"
-    >
-      <template #headermain>
-        <slot name="headermain"></slot>
-      </template>
-    </zsyslist_header>
-
-    <!-- 列表内容 -->
-    <el-table :data="data.listdata" style="width: 100%" :stripe="true">
-      <slot name="content"></slot>
-      <template #empty>
-        <el-empty description="无相关数据" :image-size="100" />
-      </template>
-    </el-table>
-
-    <!-- 分页 -->
-    <el-pagination
-      v-if="config.HideBottomToolbar != true"
-      v-model:current-page="currentPage"
-      v-model:page-size="pageSize"
-      :page-sizes="[30, 50, 100, 150, 200]"
-      layout="total, sizes, prev, next, pager, jumper"
-      :total="total"
-      prev-text="上一页"
-      next-text="下一页"
-      @change="pageChange"
-      style="margin-top: 6px; margin-bottom: 6px"
-    >
-    </el-pagination>
-  </div>
-</template>
-
-<script setup lang="ts">
-import { ref, onMounted, onUnmounted, reactive } from "vue";
-import zsyslist_header from "./zsyslist_header.vue";
-import { HttpApiV1 as http } from "../../core/httpapi/http_api_v1";
-import { zsysEventBus } from "../../core/common/zsys_eventBus";
-const eventBus = zsysEventBus();
-const view = reactive({
-  loading: false,
-});
-
-//获取应用层的配置
-// const props = defineProps(['config'])
-const props = defineProps({
-  config: { type: Object, required: true },
-  module: { type: String, default: "" },
-  //   closeOnClickModal: { type: Boolean, default: true }
-});
-
-console.log("zlist", props.module);
-
-const config: ListConfig = props.config as ListConfig;
-const query = reactive({ keyword: "" });
-const currentPage = ref(1);
-const pageSize = ref(30);
-const total = ref(0);
-
-const data = ref({} as ListData); //后台返回的数据
-// console.log(data.value.count);
-
-// 定义整个列表控件的功能
-export interface ListConfig {
-  ApiUrl: string;
-  QuickConditionsGroups?: QuickConditionsGroup[]; //快捷查询条件组
-  HideBottomToolbar?: boolean; //隐藏底部工具条
-  KeywordTip?: string; //快捷查询提示
-  ExportUrl?: string; //导出功能接口
-  ExportColumn?: ExportColumn[]; //支持导出的字段选项，如果没有的话，就是全部支持字段
-}
-
-export interface ExportColumn {
-  ColumnTitle: string;
-  ColumnName: string;
-}
-
-//快捷查询条件结构
-export interface QuickConditionsGroup {
-  Label: string; //快捷查询组的标题
-  QuickConditions: SqlQueryParam[]; //快捷查询组的选项
-  Select: number; //选中的选项的下标
-}
-
-//查询条件结构
-interface SqlQueryParam {
-  label: string;
-  column: string | null;
-  condition?: string | null;
-  value?: number | string | null;
-}
-
-//列表数据返回值
-interface ListData {
-  count: number;
-  listdata: [];
-}
-
-// const config = defineProps<ListConfig>()
-// 使用 toRefs 保持响应性
-// const { user } = toRefs(props)
-// const userName = computed(() => user.value.name)
-
-const GetListData = async () => {
-  view.loading = true;
-  let q = {
-    page_size: pageSize.value,
-    page_index: currentPage.value,
-    user_query_param: GetUserQueryParam(),
-    keyword: query.keyword,
-  };
-  let res = await http.Post(config.ApiUrl, q);
-  if (res.IsSuccess) {
-    let d = res.data as ListData;
-    data.value = d;
-    total.value = d.count;
-  }
-  view.loading = false;
-};
-
-//provide("refresh_list",GetListData)//提供给子组件调用
-// 处理aud事件
-const aud_event = (payload: { module: string; id: bigint }) => {
-  console.log("aud_event:", payload);
-  if (payload.module == props.module || payload.module == "all") {
-    GetListData();
-  }
-};
-
-const GetUserQueryParam = (): SqlQueryParam[] => {
-  let re: SqlQueryParam[] = [];
-  for (const g of config.QuickConditionsGroups || []) {
-    if (g.QuickConditions[g.Select].column != null) {
-      re.push(g.QuickConditions[g.Select]);
-    }
-  }
-  return re;
-};
-
-onMounted(() => {
-  eventBus.on("aud", aud_event);
-  GetListData();
-});
-
-onUnmounted(() => {
-  eventBus.off("aud", aud_event);
-});
-
-//==============分页功能===================================
-
-const pageChange = (pageindex: number, size: number) => {
-  currentPage.value = pageindex;
-  pageSize.value = size;
-  console.log(currentPage.value, pageSize.value);
-  GetListData();
-};
-</script>
-
-<style scoped></style>

package/components/list/zsyslist_content.vue

@@ -1,29 +0,0 @@
-<template>
-    
-    <el-table :data="tableData" style="width: 100%" stripe="true">
-        <slot name="content"></slot>
-        <!-- <el-table-column prop="date" label="ID" width="180" />
-        <el-table-column prop="name" label="IP" width="180" />
-        <el-table-column prop="address" label="时间" width="180"/>
-        <el-table-column prop="address" label="操作人" width="180"/>
-        <el-table-column prop="address" label="日志内容" /> -->
-    </el-table>
-</template>
-
-<script setup lang="ts">
-const tableData = [
-  {
-    date: '2016-05-03',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles',
-  },{
-    date: '2016-05-03',
-    name: 'Tom',
-    address: 'No. 189, Grove St, Los Angeles',
-  }
-]
-</script>
-
-<style scoped>
-
-</style>

package/components/list/zsyslist_header.vue

@@ -1,62 +0,0 @@
-<template>
-    <el-row>
-        <el-col :span="24">
-            <el-space :size="4" wrap>
-                <slot name="headermain"></slot>
-                <el-tooltip content="刷新列表数据">
-                    <el-button :icon="Refresh" @click="refresh" />
-                </el-tooltip>
-                <el-tooltip v-if="config.KeywordTip?true:false" :show-after="800" :content="config.KeywordTip?config.KeywordTip:'快捷搜索'">
-                    <el-input style="width: 160px;" :placeholder="config.KeywordTip?config.KeywordTip:'快捷搜索'" :prefix-icon="Search" v-model="query.keyword"
-                        clearable @keyup.enter.native="refresh" />
-                </el-tooltip>
-                <!-- <el-tooltip content="打开/关闭高级搜索功能">
-                    <el-button>高级搜索</el-button>
-                </el-tooltip> -->
-                <!-- <el-button>排序</el-button> -->
-                <el-tooltip v-if="config.ExportUrl?true:false" content="将查询的结果全部导出">
-                    <el-button @Click="view.exportDialogShow=true">导出</el-button>
-                </el-tooltip>
-                <!-- <el-button>批量操作</el-button> -->
-            </el-space>
-        </el-col>
-    </el-row>
-
-    <el-row style="margin-top: 8px;" v-for="v in config.QuickConditionsGroups">
-        <el-col :span="24">
-            <el-space :size="4" wrap>
-                <el-text>{{ v.Label }}</el-text>
-                <el-radio-group v-model="v.Select" size="small">
-                    <el-radio-button v-for="q, index in v.QuickConditions" :value="index" @change="refresh">{{ q.label
-                        }}</el-radio-button>
-                </el-radio-group>
-            </el-space>
-        </el-col>
-    </el-row>
-    <el-divider style="margin-top: 4px; margin-bottom: 4px;" />
-    <!-- 导出 -->
-    <export_dialog v-model="view.exportDialogShow" :export-url="config.ExportUrl" :export-column="config.ExportColumn"></export_dialog>
-</template>
-
-<script setup lang="ts">
-import { defineProps,reactive } from 'vue'
-import { Refresh, Search } from '@element-plus/icons-vue'
-import export_dialog from '../export/export_dialog.vue';
-
-const props = defineProps(['config', 'query'])
-const config = props.config
-const query = props.query
-
-const view = reactive({
-  exportDialogShow:false
-})
-
-const emit = defineEmits<{
-    (e: 'refresh'): void
-}>()
-
-const refresh = () => { emit('refresh') }
-
-</script>
-
-<style scoped></style>

package/components/message/index.ts

@@ -1,3 +0,0 @@
-import { ZSYSMessage } from "./message";
-
-export {ZSYSMessage}

package/components/message/message.ts

@@ -1,35 +0,0 @@
-import { ElMessage } from "element-plus";
-import type { MessageOptions} from "element-plus";
-import type { App } from 'vue'
-export class ZSYSMessage{
-    static show(msgType: 'success' | 'warning' | 'info' | 'error' = 'info', msg:string): void {
-        const options: MessageOptions = {
-        message: msg,
-        type: msgType,
-        plain: true,
-        duration: 3000, // 3秒后消失
-        showClose: false
-        };
-        ElMessage(options);
-    }
-
-    static ShowInfo(msg:string)
-    {
-        ZSYSMessage.show('info', msg)
-    }
-
-    static ShowSuccess(msg:string)
-    {
-        ZSYSMessage.show('success', msg)
-    }
-
-    static ShowError(msg:string)
-    {
-        ZSYSMessage.show('error', msg)
-    }
-
-    install=(app:App)=>{
-    app.component(ZSYSMessage.name as string,ZSYSMessage)
-    return app
-    }
-}

package/components/zsys_delbutton.vue

@@ -1,60 +0,0 @@
-<template>
-    <el-popconfirm @confirm="confirm" title="确认要删除吗?" v-if="!view.loading" confirm-button-text="删除"
-        cancel-button-text="取消" confirm-button-type="danger">
-        <template #reference>
-            <el-link type="primary">删除</el-link>
-        </template>
-    </el-popconfirm>
-    <el-popover v-if="view.loading" :visible="view.loading" :width="40" placement="top" content="正在删除">
-        <template #reference>
-            <el-link type="primary" style="margin-left: 6px;" disabled>删除</el-link>
-        </template>
-    </el-popover>
-</template>
-
-<script setup lang="ts">
-import { reactive, type PropType } from 'vue'
-import { HttpApiV1 as http } from '../core/httpapi/http_api_v1'
-import { ZSYSMessage } from '../components/message'
-import { zsysEventBus } from '../core/common/zsys_eventBus'
-const eventBus = zsysEventBus()
-const view = reactive({
-    loading: false
-})
-
-const props = defineProps({
-    id: { type: BigInt as unknown as PropType<bigint>, required: true },
-    api_url: { type: String, required: true },
-    module: { type: String, default:'all' }
-    //   closeOnClickModal: { type: Boolean, default: true }
-});
-
-// const refresh_list=inject<() => void>('refresh_list')
-// console.log(refresh_list);
-
-
-const confirm = async () => {
-    view.loading = true
-    try {
-        let res = await http.Post(props.api_url, { id: props.id })
-        if (res.IsSuccess) {
-            view.loading = false
-            ZSYSMessage.ShowSuccess("删除成功")
-            console.log('aud',props.module);
-            console.log(props.module);
-            
-            eventBus.emit("aud", {module:props.module, id: props.id })
-        } else {
-            ZSYSMessage.ShowError("删除失败")
-        }
-    } catch (e) {
-
-    }
-
-
-    view.loading = false
-}
-
-</script>
-
-<style scoped></style>

package/core/app.ts

@@ -1,32 +0,0 @@
-import { createApp } from 'vue'
-import '../css/common.css'
-import app from '../view/app.vue'
-import {createPinia} from 'pinia'
-import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
-
-import ElementPlus from 'element-plus' //导入 ElementPlus 组件库的所有模块和功能 
-import 'element-plus/dist/index.css' //导入 ElementPlus 组件库所需的全局 CSS 样式
-import zhCn from 'element-plus/es/locale/lang/zh-cn'
-
-
-//路由
-import {initRouter} from './router.ts' //导入路由模块
-
-
-const zsysapp=createApp(app)
-
-const pinia=createPinia()
-pinia.use(piniaPluginPersistedstate)
-
-// addFrameRouter({path:'/desktop',component:()=>import('../../test_view/test_desktop.vue')})
-
-zsysapp.use(initRouter()) //将 Vue Router 插件注册到 Vue 应用中
-zsysapp.use(ElementPlus,{locale: zhCn}) //将 ElementPlus 插件注册到 Vue 应用中
-zsysapp.use(pinia)
-//从后台获取全局信息
-// import {GetPublish}from '../core/runtime.ts'
-// GetPublish(zsysapp)
-zsysapp.mount('#app')
-
-
-export default zsysapp