qtsk-vue3 0.0.7 → 0.0.9

package/package/component.js

@@ -1,130 +1,33 @@
-/* import McLink from './components/link'
-import McBreadcrumb from './components/breadcrumb'
-import McButton from './components/button'
-import McCheckbox from './components/checkbox'
-import McCheckboxGroup from './components/checkbox-group'
-import McRadio from './components/radio'
-import McRadioGroup from './components/radio-group'
-import McProgress from './components/progress'
-import McInput from './components/input'
-import McSlide from './components/slide'
-import McSwitch from './components/switch'
-import McTab from './components/tab'
-import McTextarea from './components/textarea'
-import McTree from './components/tree'
-import McCity from './components/city'
-import McCityPicker from './components/city-picker'
-import McAddress from './components/address'
-import McFuzzySearch from './components/fuzzy-search'
-import McTip from './components/tip'
-import McPopup from './components/popup'
-import McTable from './components/table'
-import McTableColumn from './components/table-column'
-import McPagination from './components/pagination'
-import McForm from './components/form'
-import McFormItem from './components/form-item'
-import McSelect from './components/select'
-import McSelectOption from './components/select-option'
-import McDatePicker from './components/date-picker'
-import McMonthPicker from './components/month-picker'
-import McDropdown from './components/dropdown'
-import McImport from './components/import'
-// import McNotification from './components/notification'
-import McCollapse from './components/collapse'
-import McCollapseItem from './components/collapse-item'
-import McCollapseTransition from './components/collapse-transition'
-import McUpload from './components/upload'
-import McDepartmentTree from './components/department-tree'
-import McDepartmentPicker from './components/department-picker'
-import McPermissionTree from './components/permission-tree'
-import McLabel from './components/label'
-import McJobFuncPicker from './components/job-func'
-import McAmountRange from './components/amount-range'
-
-// 新版table控件 支持除jsx外的调用方式
-import {McTableV2,McTableV2Column} from './components/tableV2'
-
-export default [
-    McLink,
-    McBreadcrumb,
-    McButton,
-    McCheckbox,
-    McCheckboxGroup,
-    McRadio,
-    McRadioGroup,
-    McProgress,
-    McInput,
-    McSlide,
-    McSwitch,
-    McTab,
-    McTextarea,
-    McTree,
-    McCity,
-    McCityPicker,
-    McAddress,
-    McFuzzySearch,
-    McTip,
-    McPopup,
-    McTable,
-    McTableColumn,
-    McPagination,
-    McForm,
-    McFormItem,
-    McSelect,
-    McSelectOption,
-    McDatePicker,
-    McMonthPicker,
-    McDropdown,
-    McImport,
-    // McNotification,
-    McCollapse,
-    McCollapseItem,
-    McCollapseTransition,
-    McUpload,
-    McDepartmentTree,
-    McDepartmentPicker,
-    McPermissionTree,
-    McLabel,
-    McJobFuncPicker,
-
-    // new version table package
-    McTableV2,
-    McTableV2Column,
-
-    McAmountRange,
-]
- */
-
-import QTButton from './components/QTButton/index.vue'
-import QTContainer from './components/QTContainer/index.vue'
-import QTMenu from './components/QTMenu/index.vue'
-import QTIcons from './components/QTIcons/index.vue'
-import QTInput from './components/QTInput/index.vue'
-import QTSelect from './components/QTSelect/index.vue'
-import QTTable from './components/QTTable/index.vue'
-import QTSwitch from './components/QTSwitch/index.vue'
-import QTPagination from './components/QTPagination/index.vue'
-import QTDatePicker from './components/QTDatePicker/index.vue'
-import QTTree from './components/QTTree/index.vue'
-import QTDialog from './components/QTDialog/index.vue'
-import QTForm from './components/QTForm/index.vue'
-import QTFormItem from './components/QTFormItem/index.vue'
+import Button from './components/Button/index.vue'
+import Container from './components/Container/index.vue'
+import Menu from './components/Menu/index.vue'
+import Icons from './components/Icons/index.vue'
+import Input from './components/Input/index.vue'
+import Select from './components/Select/index.vue'
+import Table from './components/Table/index.vue'
+import Switch from './components/Switch/index.vue'
+import Pagination from './components/Pagination/index.vue'
+import DatePicker from './components/DatePicker/index.vue'
+import Tree from './components/Tree/index.vue'
+import Dialog from './components/Dialog/index.vue'
+import Form from './components/Form/index.vue'
+import FormItem from './components/FormItem/index.vue'
 
 const components = 
     [
-        QTButton, 
-        QTContainer,
-        QTMenu, 
-        QTIcons, 
-        QTInput, 
-        QTSelect, 
-        QTTable, 
-        QTSwitch, 
-        QTPagination, 
-        QTDatePicker, 
-        QTTree, 
-        QTDialog,
-        QTForm,
-        QTFormItem
+        Button, 
+        Container,
+        Menu, 
+        Icons, 
+        Input, 
+        Select, 
+        Table, 
+        Switch, 
+        Pagination, 
+        DatePicker, 
+        Tree, 
+        Dialog,
+        Form,
+        FormItem
     ]
 export default components

package/package/components/{QTButton → Button}/index.vue

@@ -11,7 +11,7 @@ import { ElButton} from 'element-plus'
 import '../../style/root.css'
 
 defineOptions({
-  name: 'QTButton',
+  name: 'Button',
 })
 const props = defineProps({
   type:{

package/package/components/{QTContainer → Container}/index.vue

@@ -25,7 +25,7 @@
 <script setup>
 import { ElContainer, ElHeader, ElAside, ElMain } from 'element-plus'
 defineOptions({
-    name: 'QTContainer'
+    name: 'Container'
 })
 </script>
 

package/package/components/{QTDatePicker → DatePicker}/index.vue

@@ -9,7 +9,7 @@ import { ElDatePicker, ElConfigProvider } from 'element-plus'
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 defineOptions({
-  name: 'QTDatePicker',
+  name: 'DatePicker',
 })
 
 const props = defineProps({

package/package/components/{QTDialog → Dialog}/index.vue

@@ -18,7 +18,7 @@
 import { ElDialog, ElButton } from 'element-plus'
 
 defineOptions({
-  name: 'QTDialog',
+  name: 'Dialog',
 })
 
 defineProps({

package/package/components/{QTForm → Form}/index.vue

@@ -16,7 +16,7 @@
 import { ElForm } from 'element-plus'
 
 defineOptions({
-  name: 'QTForm',
+  name: 'Form',
 })
 
 defineProps({

package/package/components/{QTFormItem → FormItem}/index.vue

@@ -8,7 +8,7 @@
 import { ElFormItem } from 'element-plus'
 
 defineOptions({
-  name: 'QTFormItem',
+  name: 'FormItem',
 })
 
 defineProps({

package/package/components/{QTIcons → Icons}/index.vue

@@ -10,7 +10,7 @@ import { computed } from 'vue'
 import * as Icons from '@element-plus/icons-vue';
 
 defineOptions({
-    name: 'QTIcons'
+    name: 'Icons'
 })
 const props = defineProps({
     type: {

package/package/components/{QTInput → Input}/index.vue

@@ -7,7 +7,7 @@ import {ElInput} from 'element-plus'
 import '../../style/root.css'
 
 defineOptions({
-    name: 'QTInput'
+    name: 'Input'
 })
 defineProps({
     type: {

package/package/components/{QTMenu → Menu}/index.vue

@@ -3,15 +3,15 @@
         <el-menu class="el-menu-vertical-demo" router :collapse="isCollapse" :default-active="activeMenu"
             @open="handleOpen" @close="handleClose">
             <el-menu-item :index="menu.path" v-for="(menu, index) in menus" :key="index">
-                <QTIcons :type="menu.icon"></QTIcons>
+                <Icons :type="menu.icon"></Icons>
                 <template #title>
                     <span>{{ menu.name }}</span>
                 </template>
             </el-menu-item>
         </el-menu>
         <div class="menu_btn">
-            <QTIcons v-if="isCollapse"  @click="isCollapse = false" :type="'DArrowRight'"></QTIcons>
-            <QTIcons v-else  @click="isCollapse = true" :type="'DArrowLeft'"></QTIcons>
+            <Icons v-if="isCollapse"  @click="isCollapse = false" :type="'DArrowRight'"></Icons>
+            <Icons v-else  @click="isCollapse = true" :type="'DArrowLeft'"></Icons>
         </div>
     </div>
 </template>
@@ -19,10 +19,10 @@
 <script setup>
 import { ref } from 'vue'
 import { ElMenu, ElMenuItem } from 'element-plus'
-import QTIcons from '../QTIcons/index.vue'
+import Icons from '../Icons/index.vue'
 
 defineOptions({
-    name: 'QTMenu'
+    name: 'Menu'
 })
 defineProps({
     menus: {
@@ -59,8 +59,8 @@ const handleClose = (key, keyPath) => {
         }
 
         .is-active {
-            color: var(--qt-main-color);
-            background-color: var(--qt-background-color);
+            color: var(--main-color);
+            background-color: var(--main-background-color);
         }
     }
 

package/package/components/{QTMessage → Message}/index.js

@@ -1,9 +1,9 @@
 /** 
-* QTMessage 消息提示包含四种类型： error(错误)， success(成功)， warning(警告)， info(信息)
+* Message 消息提示包含四种类型： error(错误)， success(成功)， warning(警告)， info(信息)
 */
 import { ElMessage, ElMessageBox } from 'element-plus'
 
-export const QTMessage = {
+export const Message = {
     error: (message) => {
         ElMessage.error(message)
     },
@@ -24,4 +24,4 @@ export const QTMessage = {
     }
 }
 
-export const QTMessageBox = ElMessageBox
+export const MessageBox = ElMessageBox

package/package/components/{QTPagination → Pagination}/index.vue

@@ -13,7 +13,7 @@ import { ElPagination, ElConfigProvider } from 'element-plus'
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 
 defineOptions({
-  name: 'QTPagination',
+  name: 'Pagination',
 })
 defineProps({
   total: {

package/package/components/{QTSelect → Select}/index.vue

@@ -9,7 +9,7 @@ import { ElSelect, ElOption } from 'element-plus'
 import '../../style/root.css'
 
 defineOptions({
-    name: 'QTSelect'
+    name: 'Select'
 })
 defineProps({
     placeholder: {

package/package/components/{QTSwitch → Switch}/index.vue

@@ -6,7 +6,7 @@
 import { ElSwitch } from 'element-plus'
 
 defineOptions({
-  name: 'QTSwitch',
+  name: 'Switch',
 })
 
 const props = defineProps({

package/package/components/{QTTable → Table}/index.vue

@@ -28,7 +28,7 @@
 <script setup>
 import { ElTable, ElTableColumn, ElEmpty } from 'element-plus'
 defineOptions({
-  name: 'QTTable',
+  name: 'Table',
 })
 defineProps({
   data: {

package/package/components/{QTTree → Tree}/index.vue

@@ -18,7 +18,7 @@ import { ElTree } from 'element-plus'
 
 const treeRef = ref(null)
 defineOptions({
-  name: 'QTTree',
+  name: 'Tree',
 })
 
 defineProps({

package/package/index.backup.js

@@ -1,4 +1,6 @@
 import Components from './component'
+import { QTMessage, QTMessageBox } from './components/Message'
+
 const makeInstaller = (components = [], directives = []) => {
     const apps = []
     const install = (app, opts) => {
@@ -15,6 +17,6 @@ const makeInstaller = (components = [], directives = []) => {
 
 const install = makeInstaller(Components)
 
-export { install, install as default }
+export { QTMessage, QTMessageBox, install, install as default }
 
-console.info('%c====== Editing in local package ======', 'font-size:16px;color:green;')
+console.info('%c====== Editing in local package ======', 'font-size:16px;color:green;')

package/package/index.js

@@ -1,5 +1,5 @@
 import Components from './component'
-import { QTMessage, QTMessageBox } from './components/QTMessage'
+import { Message, MessageBox } from './components/Message'
 
 const makeInstaller = (components = [], directives = []) => {
     const apps = []
@@ -17,6 +17,9 @@ const makeInstaller = (components = [], directives = []) => {
 
 const install = makeInstaller(Components)
 
-export { QTMessage, QTMessageBox, install, install as default }
+export { Message, MessageBox, install, install as default }
 
 console.info('%c====== Editing in local package ======', 'font-size:16px;color:green;')
+
+
+console.info('%c====== Editing in local package ======', 'font-size:16px;color:yellow;')

package/package/style/root.css

@@ -1,5 +1,5 @@
 /* 标准化样式定义 */
 :root{
-    --qt-main-color: #4d4398;
-    --qt-background-color: #e0edff;
+    --main-color: #4d4398;
+    --main-background-color: #e0edff;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "qtsk-vue3",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "description": "vue3版组件库",
   "main": "./package/index.js",
   "scripts": {