- build için dosyalar ayrı kaydedilecek şekilde düzenleme yapıldı
- gereksiz paketler package.json dan silindi - Kullanılmayan quill dosyaları silindi
This commit is contained in:
M. Bestami
23
Configs.ts
Normal file
23
Configs.ts
Normal file
@ -0,0 +1,23 @@
|
||||
// build olurken bazı klasorlerin ayri script olarak kaydedilmesi
|
||||
export const TEMPLATE_CHUNK_GROUPS: Record<string, (RegExp | string)[]> = {
|
||||
store: [/\/src\/stores\//],
|
||||
lott: [/\/src\/module\/cekilisler\//],
|
||||
user: [/\/src\/module\/kullanicilar\//],
|
||||
cust: [/\/src\/module\/uyeler\//],
|
||||
acc: [/\/src\/module\/muhasebe\//],
|
||||
site: [/\/src\/module\/site-yonetimi\//],
|
||||
aut: [/\/src\/module\/auth\//]
|
||||
}
|
||||
|
||||
// id -> group_name
|
||||
export function SetTemplateGroup(id: string): string | undefined {
|
||||
const cleanId = id.split('?')[0]
|
||||
for (const [group, pats] of Object.entries(TEMPLATE_CHUNK_GROUPS)) {
|
||||
if (
|
||||
pats.some((p) => (typeof p === 'string' ? cleanId.includes(p) : p.test(cleanId)))
|
||||
) {
|
||||
return group
|
||||
}
|
||||
}
|
||||
return undefined
|
||||
}
|
||||
@ -21,8 +21,6 @@
|
||||
"jquery": "^3.7.1",
|
||||
"parchment": "^3.0.0",
|
||||
"pinia": "^2.1.7",
|
||||
"quill": "^2.0.3",
|
||||
"quill-image-resize-module": "^3.0.0",
|
||||
"summernote": "^0.9.1",
|
||||
"uuid": "^11.1.0",
|
||||
"vue": "^3.4.29",
|
||||
|
||||
@ -1,210 +0,0 @@
|
||||
<template>
|
||||
<div :class="['form-item', half ? 'form-item-half' : '', elclass || '']">
|
||||
<span class="form-item-title" v-if="title !== undefined && title !== ''">
|
||||
{{ title }}
|
||||
</span>
|
||||
<slot name="input">
|
||||
<label>
|
||||
<span v-if="label !== undefined && label !== ''">
|
||||
{{ label }}
|
||||
<i v-if="required" class="form-item-alert">*</i>
|
||||
</span>
|
||||
<div :ref="'quillContainer' + rnd"></div>
|
||||
<span
|
||||
class="form-item-alert"
|
||||
v-if="InvalidMessages.length > 0 && InvalidMessages !== ''">
|
||||
{{ InvalidMessages }}
|
||||
</span>
|
||||
<span
|
||||
class="form-item-description"
|
||||
v-if="description !== undefined && description !== ''">
|
||||
{{ description }}
|
||||
</span>
|
||||
</label>
|
||||
</slot>
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, computed, onMounted, useTemplateRef, watch } from 'vue'
|
||||
import Quill from 'quill'
|
||||
import 'quill/dist/quill.snow.css'
|
||||
|
||||
declare const window: any
|
||||
|
||||
window.Quill = Quill
|
||||
|
||||
export interface Props {
|
||||
label?: string
|
||||
disabled?: boolean
|
||||
modelValue: string
|
||||
half?: boolean
|
||||
title?: string
|
||||
invalidText?: string
|
||||
description?: string
|
||||
placeholder?: string
|
||||
required?: boolean
|
||||
maxlength?: string
|
||||
minlength?: string
|
||||
iclass?: string
|
||||
elclass?: string
|
||||
modelKey?: string
|
||||
}
|
||||
const props = withDefaults(defineProps<Props>(), {
|
||||
disabled: false,
|
||||
half: false,
|
||||
required: false,
|
||||
placeholder: ''
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modelValue', 'change', 'text-change'])
|
||||
const rnd = ref<number>(Number(Math.random() * 10000000))
|
||||
|
||||
const toolbar = ref<any[]>([
|
||||
[{ font: [] }, { size: [] }],
|
||||
['bold', 'italic', 'underline', 'strike'],
|
||||
[{ color: [] }, { background: [] }],
|
||||
[{ script: 'super' }, { script: 'sub' }],
|
||||
[{ header: '1' }, { header: '2' }, 'blockquote'],
|
||||
[{ list: 'ordered' }, { list: 'bullet' }, { indent: '-1' }, { indent: '+1' }],
|
||||
[{ align: [] }],
|
||||
['link', 'image', 'video'],
|
||||
['clean']
|
||||
])
|
||||
|
||||
const options = reactive<Record<string, any>>({
|
||||
theme: 'snow',
|
||||
modules: {
|
||||
toolbar: toolbar.value,
|
||||
imageResize: {
|
||||
modules: ['Resize', 'DisplaySize', 'Toolbar']
|
||||
}
|
||||
},
|
||||
placeholder: props.placeholder,
|
||||
readOnly: false,
|
||||
debug: false
|
||||
})
|
||||
|
||||
const QuillImageResize = ref<any>()
|
||||
|
||||
const editor = useTemplateRef<any>('quillContainer' + rnd.value)
|
||||
const quill = ref<Quill | null>(null)
|
||||
|
||||
const localValue = ref<string>(props.modelValue)
|
||||
|
||||
const InvalidMessageText = ref<Record<string, any>>({})
|
||||
const InvalidMessages = computed(() => {
|
||||
let text = ''
|
||||
Object.keys(InvalidMessageText.value).forEach((k: string, i: number) => {
|
||||
text += InvalidMessageText.value[k] + ', '
|
||||
})
|
||||
return text
|
||||
})
|
||||
|
||||
const OnTextChange = (e: any) => {
|
||||
if (props.minlength !== undefined) {
|
||||
if (localValue.value.length < Number(props.minlength)) {
|
||||
InvalidMessageText.value.minlength = `Girdiğiniz bilgi en az ${props.minlength} karakter uzunluğunda olmalı`
|
||||
} else {
|
||||
delete InvalidMessageText.value.minlength
|
||||
}
|
||||
}
|
||||
|
||||
if (quill.value !== null) {
|
||||
localValue.value = quill.value!.container.querySelector('.ql-editor')!.innerHTML
|
||||
}
|
||||
|
||||
emit('update:modelValue', localValue.value)
|
||||
emit('change', e)
|
||||
}
|
||||
|
||||
const InitializeEditor = async () => {
|
||||
await setupQuillEditor()
|
||||
SetContent()
|
||||
RegisterEditorEventListeners()
|
||||
}
|
||||
|
||||
const SetContent = () => {
|
||||
if (props.modelValue) quill.value!.root.innerHTML = props.modelValue
|
||||
}
|
||||
|
||||
const setupQuillEditor = async () => {
|
||||
//let Parchment = Quill.import('parchment')
|
||||
|
||||
window.Quill.imports.parchment.Attributor.Style =
|
||||
window.Quill.imports.parchment.StyleAttributor
|
||||
|
||||
//@ts-ignore
|
||||
QuillImageResize.value = await import('quill-image-resize-module')
|
||||
|
||||
quill.value = new Quill(editor.value, options) as Quill
|
||||
;(quill.value!.getModule('toolbar') as Record<
|
||||
string,
|
||||
any
|
||||
>)!.container.addEventListener('mousedown', (e: Event) => {
|
||||
e.preventDefault()
|
||||
})
|
||||
;(quill.value!.getModule('toolbar') as Record<
|
||||
string,
|
||||
any
|
||||
>)!.container.addEventListener('click', (e: Event) => {
|
||||
if ((e.target as HTMLElement).className !== 'ql-image') e.preventDefault()
|
||||
})
|
||||
}
|
||||
|
||||
const RegisterEditorEventListeners = () => {
|
||||
quill.value!.on('text-change', OnTextChange)
|
||||
quill.value!.on('editor-change', OnTextChange)
|
||||
//image resize imaja tıklandığını anlamıyor.
|
||||
quill.value!.root.addEventListener('mouseover', OnMouseOver, false)
|
||||
ListenForEditorEvent('text-change')
|
||||
}
|
||||
const ListenForEditorEvent = (type: any) => {
|
||||
quill.value!.on(type, (...args) => {
|
||||
emit(type, ...args)
|
||||
})
|
||||
}
|
||||
|
||||
const OnMouseOver = (e: Event) => {
|
||||
if (
|
||||
(e.target as HTMLElement)!.firstChild &&
|
||||
((e.target as HTMLElement)!.firstChild as HTMLElement)!.tagName &&
|
||||
((e.target as HTMLElement)!.firstChild as HTMLElement)!.tagName.toUpperCase() ===
|
||||
'IMG'
|
||||
) {
|
||||
;(e.target as HTMLElement)!.classList.add('remove-click-p')
|
||||
;((e.target as HTMLElement)!.firstChild as HTMLElement)!.classList.add(
|
||||
'add-click-img'
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
InitializeEditor()
|
||||
})
|
||||
|
||||
watch(
|
||||
() => props.invalidText,
|
||||
() => {
|
||||
if (props.invalidText !== undefined && props.invalidText !== '') {
|
||||
InvalidMessageText.value.invalid = props.invalidText
|
||||
} else {
|
||||
delete InvalidMessageText.value.invalid
|
||||
}
|
||||
}
|
||||
)
|
||||
</script>
|
||||
<style>
|
||||
.ql-toolbar {
|
||||
width: 100%;
|
||||
}
|
||||
.ql-container {
|
||||
width: 100%;
|
||||
min-height: 120px;
|
||||
}
|
||||
.remove-click-p {
|
||||
pointer-events: none;
|
||||
}
|
||||
.add-click-img {
|
||||
pointer-events: all;
|
||||
}
|
||||
</style>
|
||||
@ -455,7 +455,6 @@
|
||||
const RouteFilterControl = () => {
|
||||
if (props.isUseRoute) {
|
||||
filterChanging.value = true
|
||||
console.log('c', localFilterParams.value, route.query)
|
||||
if (Object.keys(route.query).length > 0) {
|
||||
Object.keys(route.query).forEach((key) => {
|
||||
if (key.includes('Filters[')) {
|
||||
|
||||
@ -106,13 +106,11 @@
|
||||
d: Record<string, any>,
|
||||
ext: Record<string, any>
|
||||
) => {
|
||||
console.log(v,d)
|
||||
if (v !== '' && v !== null) {
|
||||
ext.f.values[0].val = v
|
||||
ext.f.values[0].text = d[ext.k]
|
||||
ext.f.filter = true
|
||||
} else {
|
||||
console.log("-----")
|
||||
ext.f.filter = false
|
||||
ext.f.values[0].text = ''
|
||||
}
|
||||
|
||||
@ -5,7 +5,6 @@ import FormInput from './FormInput.vue'
|
||||
import FormDate from './FormDate.vue'
|
||||
import FormFile from './FormFile.vue'
|
||||
import FormTextarea from './FormTextarea.vue'
|
||||
import FormQuill from './FormQuill.vue'
|
||||
import FormSummer from './FormSummer.vue'
|
||||
import FormSelect from './FormSelect.vue'
|
||||
import FormRadio from './FormRadio.vue'
|
||||
@ -25,7 +24,6 @@ export {
|
||||
FormDate,
|
||||
FormFile,
|
||||
FormTextarea,
|
||||
FormQuill,
|
||||
FormSummer,
|
||||
FormSelect,
|
||||
FormRadio,
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{
|
||||
"extends": "@vue/tsconfig/tsconfig.dom.json",
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
|
||||
"include": ["env.d.ts", "src/**/*", "src/**/*.vue", "Configs.ts"],
|
||||
"exclude": ["src/**/__tests__/*"],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
|
||||
@ -1,11 +1,12 @@
|
||||
{
|
||||
"extends": "@tsconfig/node20/tsconfig.json",
|
||||
"extends": "./tsconfig.json",
|
||||
"include": [
|
||||
"vite.config.*",
|
||||
"vitest.config.*",
|
||||
"cypress.config.*",
|
||||
"nightwatch.conf.*",
|
||||
"playwright.config.*"
|
||||
"playwright.config.*",
|
||||
"Configs.ts"
|
||||
],
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
|
||||
@ -3,6 +3,7 @@ import { fileURLToPath, URL } from 'node:url'
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
import vueJsx from '@vitejs/plugin-vue-jsx'
|
||||
import { SetTemplateGroup } from './Configs.js'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
@ -23,5 +24,47 @@ export default defineConfig({
|
||||
},
|
||||
esbuild: {
|
||||
drop: process.env.NODE_ENV === 'production' ? ['console', 'debugger'] : []
|
||||
},
|
||||
build: {
|
||||
rollupOptions: {
|
||||
output: {
|
||||
manualChunks(id) {
|
||||
if (id.includes('/src/')) {
|
||||
const group = SetTemplateGroup(id)
|
||||
if (group) return `grp_${group}` // group files
|
||||
}
|
||||
|
||||
// jquery files
|
||||
if (id.includes('node_modules/jquery')) return 'ven_jquery'
|
||||
if (id.includes('node_modules/summernote')) return 'ven_summer'
|
||||
if (id.includes('node_modules/pdfmake')) return 'ven_pdfmake'
|
||||
if (id.includes('node_modules/html-to-pdfmake')) return 'ven_pdfmake'
|
||||
if (id.includes('node_modules/vue3-pdfmake')) return 'ven_pdfmake'
|
||||
if (id.includes('node_modules/vuedraggable')) return 'ven_drg'
|
||||
|
||||
// other node_modules files
|
||||
if (id.includes('node_modules')) return 'vendor'
|
||||
},
|
||||
assetFileNames: (assetInfo) => {
|
||||
const name = assetInfo.names?.[0] || assetInfo.name || ''
|
||||
|
||||
if (name.endsWith('.css')) {
|
||||
return 'static/css/[name]-[hash][extname]'
|
||||
}
|
||||
if (/\.(png|jpe?g|svg|gif|webp|ico)$/i.test(name)) {
|
||||
return 'static/images/[name]-[hash][extname]'
|
||||
}
|
||||
if (/\.(ttf|woff2?|eot|otf)$/i.test(name)) {
|
||||
return 'static/fonts/[name]-[hash][extname]'
|
||||
}
|
||||
return 'static/[name]-[hash][extname]'
|
||||
},
|
||||
chunkFileNames: (chunkInfo) => {
|
||||
if (chunkInfo.name?.startsWith('grp_')) return 'static/js/[name]-[hash].js'
|
||||
return 'static/js/[name]-[hash].js'
|
||||
},
|
||||
entryFileNames: 'static/js/[name]-[hash].js'
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user