@questwork/vue-q-widget-vue3 3.1.0

package/lib/models/nodes/elements/qPaginator.js

@@ -0,0 +1,20 @@
+import { Element } from '../element'
+
+class ElementQPaginator extends Element {
+  constructor(opt = {}) {
+    super(opt)
+    this.defaultStateName = {
+      currentPage: 'currentPage',
+      currentPageSize: 'currentPageSize',
+      totalRecords: 'totalRecords'
+    }
+  }
+}
+
+export default {
+  ElementQPaginator
+}
+
+export {
+  ElementQPaginator
+}

package/lib/models/nodes/elements/qTab.js

@@ -0,0 +1,19 @@
+import { Element } from '../element'
+
+class ElementQTab extends Element {
+  constructor(opt = {}) {
+    super(opt)
+    this.defaultStateName = {
+      active: 'active',
+      tabLayout: 'tabLayout'
+    }
+  }
+}
+
+export default {
+  ElementQTab
+}
+
+export {
+  ElementQTab
+}

package/lib/models/nodes/index.js

@@ -0,0 +1,21 @@
+import { Container } from './container'
+import Containers from './containers'
+import { Element } from './element'
+import Elements from './elements'
+import { Node } from './node'
+
+const NODE_TYPE = {
+  ...Containers,
+  ...Elements,
+  Container,
+  Element,
+  Node
+}
+
+export default {
+  ...NODE_TYPE
+}
+
+export {
+  NODE_TYPE
+}

package/lib/models/nodes/node.js

@@ -0,0 +1,69 @@
+import { setId } from '../../helpers'
+
+class Node {
+  constructor(opt = {}) {
+    // this.active = typeof opt.active === 'boolean' ? opt.active : true
+    this.id = opt.id || setId('node')
+    this.css = opt.css || {}
+    this.hidden = opt.hidden || false
+    this.nodeType = 'Node'
+    this.permissionResult = opt.permissionResult
+    this.permissionResultHandler(this.permissionResult)
+  }
+
+  get isValid() {
+    return !!this.id
+      && !this.hidden
+  }
+
+  get isCreated() {
+    return !!this
+  }
+
+  static init(layout) {
+    const instance = new this(layout)
+    return instance.isValid ? instance : null
+  }
+
+  getElementState() {
+    return this
+  }
+
+  getType() {
+    return this.type
+  }
+
+  isExist(nodes) {
+    const { name } = this
+    return !!nodes.find((node) => name && node.name === name)
+  }
+
+  permissionResultHandler(permissionResult) {
+    const { event, isAllowCreate, isAllowRead, isAllowUpdate, isAllowDelete } = permissionResult
+    if (event) {
+      if (typeof this[event] === 'function') {
+        this[event]({ val: true })
+      } else {
+        console.log(`do not have the event ${event}`)
+      }
+    } else if (!(isAllowCreate && isAllowRead && isAllowUpdate && isAllowDelete)) {
+      this.setHidden({ val: true })
+    }
+  }
+
+  setHidden({ val }) {
+    this.hidden = val
+  }
+
+  updateElementState(state) {
+    return this
+  }
+}
+
+export default {
+  Node
+}
+
+export {
+  Node
+}

package/package.json

@@ -0,0 +1,73 @@
+{
+  "name": "@questwork/vue-q-widget-vue3",
+  "version": "3.1.0",
+  "description": "Questwork vue component Sample",
+  "main": "dist/q-widget.min.js",
+  "author": {
+    "name": "Questwork Consulting Limited",
+    "email": "info@questwork.com",
+    "url": "http://www.questwork.com/"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@babel/core": "^7.12.16",
+    "@babel/eslint-parser": "^7.12.16",
+    "@babel/preset-env": "^7.22.4",
+    "@questwork/vue-q-buttons-vue3": "^3.1.0",
+    "@questwork/vue-q-form-vue3": "3.1.0",
+    "@questwork/vue-q-grid-vue3": "^3.1.0",
+    "@questwork/vue-q-list-vue3": "^3.1.0",
+    "@questwork/vue-q-modal-vue3": "^3.1.0",
+    "@questwork/vue-q-paginator-vue3": "^3.1.0",
+    "@storybook/addon-links": "^8.4.6",
+    "@storybook/addon-viewport": "^8.4.6",
+    "@storybook/source-loader": "^8.4.6",
+    "@storybook/test": "^8.4.6",
+    "@storybook/vue3": "^8.4.6",
+    "@storybook/vue3-vite": "^8.4.6",
+    "@vitejs/plugin-vue": "^5.2.1",
+    "babel-loader": "^8.2.4",
+    "chai": "^4.3.6",
+    "chromedriver": "^116.0.0",
+    "clean-webpack-plugin": "^3.0.0",
+    "cross-env": "^7.0.3",
+    "css-loader": "^3.6.0",
+    "eslint": "^8.47.0",
+    "eslint-config-airbnb-base": "11.2.0",
+    "eslint-plugin-import": "2.3.0",
+    "eslint-plugin-storybook": "^0.11.1",
+    "eslint-plugin-vue": "^8.0.3",
+    "file-loader": "^6.2.0",
+    "gulp": "^4.0.2",
+    "lodash": "^4.17.21",
+    "rollup-plugin-license": "^3.5.3",
+    "rollup-webpack-umd": "^0.1.2",
+    "sass": "^1.49.11",
+    "sass-loader": "^8.0.2",
+    "selenium-webdriver": "^4.11.1",
+    "sinon": "^9.2.4",
+    "sinon-chai": "^3.7.0",
+    "storybook": "^8.4.6",
+    "style-loader": "^1.3.0",
+    "underscore": "1.4.4",
+    "url-loader": "^4.1.1",
+    "vite": "^6.0.2",
+    "vite-plugin-commonjs": "^0.10.4",
+    "vite-plugin-lib-inject-css": "^2.1.1",
+    "vue": "^3.5.13",
+    "vue-loader": "^15.10.1",
+    "vue-template-compiler": "^2.6.14",
+    "webpack": "^5.71.0",
+    "webpack-cli": "^4.9.2",
+    "webpack-merge": "^4.2.2",
+    "webpack-node-externals": "^1.7.2"
+  },
+  "engines": {
+    "node": ">=10.0.0"
+  },
+  "scripts": {
+    "build": "vite build",
+    "build:storybook": "storybook build -c .storybook -o storybook",
+    "storybook": "storybook dev -p 6061"
+  }
+}

package/vite.config.js

@@ -0,0 +1,52 @@
+import { URL, fileURLToPath } from 'node:url'
+import { defineConfig } from 'vite'
+import { libInjectCss } from 'vite-plugin-lib-inject-css'
+import vue from '@vitejs/plugin-vue'
+import license from 'rollup-plugin-license'
+import commonjs from 'vite-plugin-commonjs'
+import UmdRewrite from 'rollup-webpack-umd'
+ 
+// 与 ./webpack/prod.config.js 的 output.library 名一致
+const libName = 'QWidget'
+// libName 的 kebab-case 格式
+const fileName = 'q-widget'
+
+export default defineConfig({
+  build: {
+    target: ['chrome100', 'safari15', 'firefox91'],
+    lib: {
+      entry: './src/index.js',
+      name: libName,
+      fileName: () => `${fileName}.min.js`,
+      formats: ['umd'],
+    },
+    rollupOptions: {
+      external: ['vue'],
+      output: {
+        globals: {
+          vue: 'Vue',
+        },
+        exports: 'named',
+      },
+      plugins: [
+        license({
+          thirdParty: {
+            output: `./dist/${fileName}.min.js.LICENSE.txt`,
+          },
+        }),
+        UmdRewrite({
+          banner: `/*! For license information please see ${fileName}.min.js.LICENSE.txt */`
+        })
+      ],
+    },
+  },
+  esbuild: {
+    legalComments: 'none',
+  },
+  plugins: [vue(), libInjectCss(), commonjs()],
+  resolve: {
+    alias: {
+      '@': fileURLToPath(new URL('./src', import.meta.url)),
+    },
+  },
+})