feat: end of development

examples/main.js

@@ -1,16 +1,12 @@
 import { createApp } from 'vue'
 import ElementPlus from 'element-plus'
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
-import Vant from 'vant'
-// import '@vant/touch-emulator'
 import 'element-plus/dist/index.css'
-import 'vant/lib/index.css'
 import router from './router'
 import App from './App.vue'
 const app = createApp(App)
 app.use(router)
 app.use(ElementPlus)
-app.use(Vant)
 app.mount('#app')
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
   app.component(key, component)

examples/views/demo.vue

@@ -66,13 +66,11 @@
 </template>
 
 <script>
-import draggable from 'vuedraggable'
 export default {
   name: 'functional',
   display: 'Functional third party',
   order: 17,
   components: {
-    draggable
   },
   data () {
     return {

examples/views/filter.vue

@@ -7,22 +7,9 @@ import quickSearchOptionsData from './data/quickSearchOptionsData.json'
 import { ref, onMounted, getCurrentInstance, reactive, unref, watch, nextTick, computed } from 'vue'
 import { EverrightFilter } from '/packages/filter'
 import uri from '@ER-examples/uri.js'
-const lang = ref(localStorage.getItem('er-lang') || 'zh-cn')
-const ERfilterRef = ref(null)
-const state = reactive({
-  value0: {},
-  // type: 'quick-search'
-  // type: 'linear'
-  type: 'matrix'
-  // type: 'quick-filter'
-})
-const isReRender = ref(true)
-watch(() => state.type, () => {
-  isReRender.value = false
-  nextTick(() => {
-    isReRender.value = true
-  })
-})
+import hooks from '@ER/hooks'
+import utils from '@ER/utils'
+
 const httpPrams = {
   options: {
     url: uri.options,
@@ -57,6 +44,58 @@ const httpPrams = {
     }
   }
 }
+const getOptions = async () => {
+  // return hooks.useFetch(uri.options)
+  return new Promise((resolve, reject) => {
+    try {
+      // hooks.useFetch(uri.options).then(data => {
+      //   resolve(data)
+      // })
+      let result = {}
+      if (state.type === 'quick-filter') {
+        result = quickFilterOptionsData
+      }
+      if (state.type === 'quick-search') {
+        result = quickSearchOptionsData
+      }
+      resolve({
+        data: result
+      })
+    } catch (e) {
+
+    }
+  })
+}
+const getConditions = async (params) => {
+  // return hooks.useFetch(uri.options)
+  return new Promise((resolve, reject) => {
+    console.log(params)
+    try {
+      hooks.useFetch(...utils.apiParams('conditions', 'get', httpPrams, {
+        params
+      })).then(data => {
+        resolve(data)
+      })
+    } catch (e) {
+    }
+  })
+}
+const lang = ref(localStorage.getItem('er-lang') || 'zh-cn')
+const ERfilterRef = ref(null)
+const state = reactive({
+  value0: {},
+  type: 'quick-search'
+  // type: 'linear'
+  // type: 'matrix'
+  // type: 'quick-filter'
+})
+const isReRender = ref(true)
+watch(() => state.type, () => {
+  isReRender.value = false
+  nextTick(() => {
+    isReRender.value = true
+  })
+})
 const isShowValidateState = computed(() => /^quick-(search|filter)$/.test(state.type))
 const defaultOptions = computed(() => {
   let result = {}
@@ -77,7 +116,6 @@ onMounted(() => {
   // erEditor.value.setData(data.slice(15, 16))
 })
 const handleEvent = (type) => {
-  console.log(type)
   switch (type) {
     case 1:
       if (state.type === 'matrix') {
@@ -90,6 +128,9 @@ const handleEvent = (type) => {
         unref(ERfilterRef).setData(quickFilterData)
       }
       break
+    case 2:
+      unref(ERfilterRef).clearData()
+      break
     case 3:
       // console.log(unref(ERfilterRef).getData(false))
       state.value0 = unref(ERfilterRef).getData(!isShowValidateState.value)
@@ -102,15 +143,18 @@ const handleEvent = (type) => {
       // state.value0 = unref(ERfilterRef).getData()
       unref(ERfilterRef).clearData('values')
       break
-    case 2:
-      unref(ERfilterRef).clearData()
+    case 6:
+      // unref(ERfilterRef).clearData()
       break
   }
 }
 const handleListener = ({ type, data }) => {
   if (type === 'init') {
     handleEvent(1)
   }
+  if (type === 'search') {
+    handleEvent(3)
+  }
 }
 const handleLang = (val) => {
   // lang.value = val
@@ -142,6 +186,8 @@ const handleLang = (val) => {
     :isFetchOptions="!isShowValidateState"
     :isShowValidateState="!isShowValidateState"
     :options="defaultOptions"
+    :getOptions="isShowValidateState ? getOptions : ''"
+    :getConditions="getConditions"
     :type="state.type"
     ref="ERfilterRef"/>
   <el-button v-if="!/^quick-(search)$/.test(state.type)" @click="() => handleEvent(1)" type="primary">Set Data</el-button>

package.json

@@ -1,26 +1,15 @@
 {
-  "name": "@liberty/everright-editor",
+  "name": "everright-filter",
   "version": "0.0.19",
   "files": [
     "dist"
   ],
   "type": "module",
-  "main": "dist/Everright-editor.umd.cjs",
-  "module": "dist/Everright-editor.js",
-  "exports": {
-    ".": {
-      "import": "dist/Everright-editor.js",
-      "require": "dist/Everright-editor.umd.cjs"
-    },
-    "./dist/style.css": {
-      "import": "./dist/style.css",
-      "require": "./dist/style.css"
-    }
-  },
+  "main": "dist/Everright-filter.umd.cjs",
+  "module": "dist/Everright-filter.js",
+  "style": "dist/style.css",
   "scripts": {
     "dev:server": "nodemon server --watch server",
-    "dev:ckeditor5": "pnpm -C external/ckeditor5 dev",
-    "build:ckeditor5": "pnpm -C external/ckeditor5 build",
     "dev": "vite --host 0.0.0.0 --port 5174",
     "build": "vite build",
     "preview": "vite preview",
@@ -30,22 +19,14 @@
   },
   "dependencies": {
     "@vant/area-data": "^1.4.0",
-    "@vant/touch-emulator": "^1.4.0",
     "@vue/shared": "^3.2.45",
     "@vuelidate/core": "^2.0.0",
     "@vuelidate/validators": "^2.0.0",
     "async": "^3.2.4",
     "axios": "^1.2.2",
-    "dayjs": "^1.11.7",
     "element-plus": "^2.2.28",
-    "jss": "^10.9.2",
-    "jss-preset-default": "^10.9.2",
     "lodash-es": "^4.17.21",
-    "magic-string": "^0.30.0",
-    "nanoid": "^4.0.0",
     "nzh": "^1.0.8",
-    "signature_pad": "^4.1.4",
-    "vant": "^4.0.8",
     "vue": "^3.2.45",
     "vue-router": "^4.1.6",
     "vuedraggable": "^4.1.0",
@@ -84,6 +65,10 @@
     "vite": "^3.2.5",
     "vite-plugin-eslint": "^1.8.1"
   },
+  "peerDependencies": {
+    "element-plus": "^2.2.28",
+    "vue": "^3.2.45"
+  },
   "lint-staged": {
     "*.{vue,js,jsx}": "eslint --fix"
   },

packages/filter/Item.vue

@@ -34,7 +34,8 @@ const ruleRef = ref()
 const optionContentRef = ref()
 const state = reactive({
   logicalOperator: 'and',
-  rules: ER.props.type === 'quick-filter' ? [] : utils.generateItems(1)
+  // rules: ER.props.type === 'quick-filter' ? [] : utils.generateItems(1)
+  rules: /^(quick-search|quick-filter)$/.test(ER.props.type) ? [] : utils.generateItems(1)
 })
 const isShowOperator = computed(() => {
   return ER.props.type !== 'quick-filter' && state.rules.length > 1
@@ -114,7 +115,7 @@ const itemLabel = computed(() => {
           :class="[ns.e('add')]"
           @click="addRule"
           link
-        >{{isInConstraint ? t(`er.${NAME.FILTERITEM}.addProp`) : t(`er.${NAME.FILTERITEM}.addCondition1`)}}</el-button>
+        >{{isInConstraint ? t(`er.${NAME.FILTERITEM}.addProp`) : t(`er.${NAME.FILTERITEM}.addCondition`)}}</el-button>
       </div>
     </div>
   </div>

packages/filter/components/Operator.vue

@@ -3,6 +3,7 @@ import { ref, computed, nextTick, reactive, inject, watch } from 'vue'
 import _ from 'lodash-es'
 import hooks from '@ER/hooks'
 import NAME from '@ER/filter/name.js'
+import utils from '@ER/utils'
 export default {
   name: NAME.OPERATORCOMPONENT
 }
@@ -19,6 +20,10 @@ const state = reactive({
 watch(state, () => {
   emit('update:modelValue', [state.value0, state.value1])
 })
+const {
+  t,
+  lang
+} = hooks.useI18n()
 watch(() => props.modelValue, (val, oldVal) => {
   state.value0 = val[0]
   state.value1 = val[1]
@@ -51,7 +56,7 @@ watch(() => props.modelValue, (val, oldVal) => {
     <el-option
       v-for="item in options[1]"
       :key="item.value"
-      :label="item.label"
+      :label="utils.getLableByLang(item, lang)"
       :value="item.value"
     />
   </el-select>

packages/filter/components/Picker.vue

@@ -6,6 +6,7 @@ import NAME from '@ER/filter/name.js'
 import TriggerComponent from './Trigger.vue'
 import OperatorComponent from './Operator.vue'
 import types from '../types'
+import utils from '@ER/utils'
 export default {
   name: NAME.PICKERCOMPONENT
 }
@@ -67,7 +68,7 @@ const params = computed(() => {
   return result
 })
 const operatorOptions = computed(() => {
-  return ER.state.operators[!props.isConstraint ? unref(params).operatorKey : 'TimesOperators']
+  return utils.convertDataByLang(ER.state.operators[!props.isConstraint ? unref(params).operatorKey : 'TimesOperators'], lang.value)
 })
 const renderType = computed(() => {
   let result = ''

packages/filter/components/Trigger.vue

@@ -3,6 +3,7 @@ import { ref, computed, nextTick, reactive, inject, defineExpose } from 'vue'
 import _ from 'lodash-es'
 import NAME from '@ER/filter/name.js'
 import hooks from '@ER/hooks'
+import utils from '@ER/utils'
 export default {
   name: NAME.TRIGGERCOMPONENT
 }
@@ -13,10 +14,17 @@ const emit = defineEmits(['update:modelValue'])
 const ER = inject('Everright')
 const element = ref()
 const ns = hooks.useNamespace(NAME.TRIGGERCOMPONENT)
+const {
+  t,
+  lang
+} = hooks.useI18n()
 // const {
 //   getData,
 //   setData
 // } = hooks.useCommon(NAME.TRIGGERCOMPONENT, {})
+const newOptions = computed(() => {
+  return utils.convertDataByLang(props.options, lang.value)
+})
 const handleChange = (val) => {
   emit('update:modelValue', val)
 }
@@ -35,5 +43,5 @@ defineExpose({
     :props="{
         emitPath: false
       }"
-    :options="options" />
+    :options="newOptions"/>
 </template>