vue2-client 1.2.51 → 1.2.54-1

package/.env

@@ -1,14 +1,15 @@
-VUE_APP_PUBLIC_PATH=/
-VUE_APP_NAME=Admin
-VUE_APP_ROUTES_KEY=admin.routes
-VUE_APP_PERMISSIONS_KEY=admin.permissions
-VUE_APP_ROLES_KEY=admin.roles
-VUE_APP_USER_KEY=admin.user
-VUE_APP_LOGIN_KEY=admin.login
-VUE_APP_SETTING_KEY=admin.setting
-VUE_APP_TBAS_KEY=admin.tabs
-VUE_APP_TBAS_TITLES_KEY=admin.tabs.titles
-VUE_APP_DICTIONARY_KEY=admin.dictionary
-VUE_APP_BADGE_KEY=admin.badge
-VUE_APP_SINGLEVALUE_KEY=admin.singlevalue
-VUE_APP_API_BASE_URL=http://123.60.214.109:8405
+VUE_APP_PUBLIC_PATH=/
+VUE_APP_NAME=Admin
+VUE_APP_ROUTES_KEY=admin.routes
+VUE_APP_PERMISSIONS_KEY=admin.permissions
+VUE_APP_ROLES_KEY=admin.roles
+VUE_APP_USER_KEY=admin.user
+VUE_APP_LOGIN_KEY=admin.login
+VUE_APP_SETTING_KEY=admin.setting
+VUE_APP_TBAS_KEY=admin.tabs
+VUE_APP_TBAS_TITLES_KEY=admin.tabs.titles
+VUE_APP_DICTIONARY_KEY=admin.dictionary
+VUE_APP_BADGE_KEY=admin.badge
+VUE_APP_SINGLEVALUE_KEY=admin.singlevalue
+VUE_APP_DIVISIONSOHCHINA=admin.divisionsohchina
+VUE_APP_API_BASE_URL=http://123.60.214.109:8405

package/.eslintrc.js

@@ -1,82 +1,82 @@
-module.exports = {
-  root: true,
-  env: {
-    node: true
-  },
-  'extends': [
-    'plugin:vue/essential',
-    'plugin:vue/strongly-recommended',
-    '@vue/standard'
-  ],
-  rules: {
-    'comma-dangle': 'off',
-    'no-console': 'off',
-    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
-    'generator-star-spacing': 'off',
-    'no-mixed-operators': 0,
-    'vue/max-attributes-per-line': [
-      2,
-      {
-        'singleline': 5,
-        'multiline': {
-          'max': 1,
-          'allowFirstLine': false
-        }
-      }
-    ],
-    'vue/attribute-hyphenation': 0,
-    'vue/html-self-closing': 0,
-    'vue/component-name-in-template-casing': 0,
-    'vue/html-closing-bracket-spacing': 0,
-    'vue/singleline-html-element-content-newline': 0,
-    'vue/no-unused-components': 0,
-    'vue/multiline-html-element-content-newline': 0,
-    'vue/no-use-v-if-with-v-for': 0,
-    'vue/html-closing-bracket-newline': 0,
-    'vue/no-parsing-error': 0,
-    'vue/name-property-casing': 0,
-    'no-tabs': 0,
-    'quotes': [
-      2,
-      'single',
-      {
-        'avoidEscape': true,
-        'allowTemplateLiterals': true
-      }
-    ],
-    'semi': [
-      2,
-      'never',
-      {
-        'beforeStatementContinuationChars': 'never'
-      }
-    ],
-    'no-delete-var': 2,
-    'prefer-const': [
-      2,
-      {
-        'ignoreReadBeforeAssign': false
-      }
-    ],
-    'template-curly-spacing': 'off',
-    'indent': 'off',
-    // 必须使用全等: false
-    'eqeqeq': 0,
-    // 可以使用!! 双重否定
-    'no-extra-boolean-cast': 'off'
-  },
-  parserOptions: {
-    parser: 'babel-eslint'
-  },
-  overrides: [
-    {
-      files: [
-        '**/__tests__/*.{j,t}s?(x)',
-        '**/tests/unit/**/*.spec.{j,t}s?(x)'
-      ],
-      env: {
-        jest: true
-      }
-    }
-  ]
-}
+module.exports = {
+  root: true,
+  env: {
+    node: true
+  },
+  'extends': [
+    'plugin:vue/essential',
+    'plugin:vue/strongly-recommended',
+    '@vue/standard'
+  ],
+  rules: {
+    'comma-dangle': 'off',
+    'no-console': 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
+    'generator-star-spacing': 'off',
+    'no-mixed-operators': 0,
+    'vue/max-attributes-per-line': [
+      2,
+      {
+        'singleline': 5,
+        'multiline': {
+          'max': 1,
+          'allowFirstLine': false
+        }
+      }
+    ],
+    'vue/attribute-hyphenation': 0,
+    'vue/html-self-closing': 0,
+    'vue/component-name-in-template-casing': 0,
+    'vue/html-closing-bracket-spacing': 0,
+    'vue/singleline-html-element-content-newline': 0,
+    'vue/no-unused-components': 0,
+    'vue/multiline-html-element-content-newline': 0,
+    'vue/no-use-v-if-with-v-for': 0,
+    'vue/html-closing-bracket-newline': 0,
+    'vue/no-parsing-error': 0,
+    'vue/name-property-casing': 0,
+    'no-tabs': 0,
+    'quotes': [
+      2,
+      'single',
+      {
+        'avoidEscape': true,
+        'allowTemplateLiterals': true
+      }
+    ],
+    'semi': [
+      2,
+      'never',
+      {
+        'beforeStatementContinuationChars': 'never'
+      }
+    ],
+    'no-delete-var': 2,
+    'prefer-const': [
+      2,
+      {
+        'ignoreReadBeforeAssign': false
+      }
+    ],
+    'template-curly-spacing': 'off',
+    'indent': 'off',
+    // 必须使用全等: false
+    'eqeqeq': 0,
+    // 可以使用!! 双重否定
+    'no-extra-boolean-cast': 'off'
+  },
+  parserOptions: {
+    parser: 'babel-eslint'
+  },
+  overrides: [
+    {
+      files: [
+        '**/__tests__/*.{j,t}s?(x)',
+        '**/tests/unit/**/*.spec.{j,t}s?(x)'
+      ],
+      env: {
+        jest: true
+      }
+    }
+  ]
+}

package/CHANGELOG.md

@@ -1,6 +1,11 @@
 # Change Log
 > 所有关于本项目的变化都在该文档里。
 
+**1.2.50 - 1.2.51 -2022-05-11 @何文强**
+- 功能修改：
+- 新增地址搜索框表单项
+- 新增省市区选择框表单项
+
 **1.2.50 - 1.2.51 -2022-05-11 @何文强**
 - 功能修改：
 - 整理地图组件

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue2-client",
-  "version": "1.2.51",
+  "version": "1.2.54-1",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/base-client/all.js

@@ -1,61 +1,64 @@
-import Vue from 'vue'
-
-import CustomColumnsDrawer from '@vue2-client/base-client/components/common/CustomColumnsDrawer'
-import InstructDetailsView from '@vue2-client/base-client/components/iot/InstructDetailsView'
-import MeterDetailsView from '@vue2-client/base-client/components/iot/MeterDetailsView'
-import CustomerDetailsView from '@vue2-client/base-client/components/iot/CustomerDetailsView'
-import LogDetailsView from '@vue2-client/base-client/components/iot/LogDetailsView'
-import WebmeterAnalysisView from '@vue2-client/base-client/components/iot/WebmeterAnalysisView'
-import XCard from '@vue2-client/base-client/components/common/XCard/XCard'
-import XFormCol from '@vue2-client/base-client/components/common/XFormCol'
-import XBadge from '@vue2-client/base-client/components/common/XBadge'
-import DataAnalysisView from '@vue2-client/base-client/components/iot/DataAnalysisView'
-import DataAnalysisUser from '@vue2-client/base-client/components/iot/DataAnalysisUser'
-import SrcollList from '@vue2-client/base-client/components/common/ScrollList'
-import AmapPointRendering from '@vue2-client/base-client/components/common/AmapMarker'
-import DeviceTypeDetailsView from '@vue2-client/base-client/components/iot/DeviceTypeDetailsView'
-import DeviceBrandDetailsView from '@vue2-client/base-client/components/iot/DeviceBrandDetailsView'
-import DictionaryDetailsView from '@vue2-client/base-client/components/system/DictionaryDetailsView'
-import QueryParamsDetailsView from '@vue2-client/base-client/components/system/QueryParamsDetailsView'
-import DeviceDetailsView from '@vue2-client/base-client/components/iot/DeviceDetailsView'
-import TicketDetailsView from '@vue2-client/base-client/components/ticket/TicketDetailsView'
-import EmployeeDetailsView from '@vue2-client/base-client/components/ticket/EmployeeDetailsView'
-import submitTicketSuccess from '@vue2-client/base-client/components/ticket/TicketSubmitSuccessView'
-import CreateQuery from '@vue2-client/base-client/components/common/CreateQuery'
-import CreateSimpleFormQuery from '@vue2-client/base-client/components/common/CreateSimpleFormQuery'
-import FormGroupQuery from '@vue2-client/base-client/components/common/FormGroupQuery'
-import FormGroupEdit from '@vue2-client/base-client/components/common/FormGroupEdit'
-import JSONToTree from '@vue2-client/base-client/components/common/JSONToTree'
-import Upload from '@vue2-client/base-client/components/common/Upload'
-
-// 插件
-import Plugins from '@vue2-client/base-client/plugins'
-Vue.use(Plugins)
-
-Vue.component('custom-columns-drawer', CustomColumnsDrawer)
-Vue.component('InstructDetailsView', InstructDetailsView)
-Vue.component('MeterDetailsView', MeterDetailsView)
-Vue.component('CustomerDetailsView', CustomerDetailsView)
-Vue.component('LogDetailsView', LogDetailsView)
-Vue.component('WebmeterAnalysisView', WebmeterAnalysisView)
-Vue.component('XCard', XCard)
-Vue.component('XBadge', XBadge)
-Vue.component('XFormCol', XFormCol)
-Vue.component('DataAnalysisView', DataAnalysisView)
-Vue.component('DataAnalysisUser', DataAnalysisUser)
-Vue.component('SrcollList', SrcollList)
-Vue.component('DeviceTypeDetailsView', DeviceTypeDetailsView)
-Vue.component('DeviceBrandDetailsView', DeviceBrandDetailsView)
-Vue.component('DeviceDetailsView', DeviceDetailsView)
-Vue.component('DictionaryDetailsView', DictionaryDetailsView)
-Vue.component('QueryParamsDetailsView', QueryParamsDetailsView)
-Vue.component('TicketDetailsView', TicketDetailsView)
-Vue.component('EmployeeDetailsView', EmployeeDetailsView)
-Vue.component('submitTicketSuccess', submitTicketSuccess)
-Vue.component('CreateQuery', CreateQuery)
-Vue.component('CreateSimpleFormQuery', CreateSimpleFormQuery)
-Vue.component('FormGroupQuery', FormGroupQuery)
-Vue.component('FormGroupEdit', FormGroupEdit)
-Vue.component('JSONToTree', JSONToTree)
-Vue.component('Upload', Upload)
-Vue.component('AmapPointRendering', AmapPointRendering)
+import Vue from 'vue'
+
+import CustomColumnsDrawer from '@vue2-client/base-client/components/common/CustomColumnsDrawer'
+import InstructDetailsView from '@vue2-client/base-client/components/iot/InstructDetailsView'
+import MeterDetailsView from '@vue2-client/base-client/components/iot/MeterDetailsView'
+import CustomerDetailsView from '@vue2-client/base-client/components/iot/CustomerDetailsView'
+import LogDetailsView from '@vue2-client/base-client/components/iot/LogDetailsView'
+import WebmeterAnalysisView from '@vue2-client/base-client/components/iot/WebmeterAnalysisView'
+import XCard from '@vue2-client/base-client/components/common/XCard/XCard'
+import XFormCol from '@vue2-client/base-client/components/common/XFormCol'
+import XBadge from '@vue2-client/base-client/components/common/XBadge'
+import DataAnalysisView from '@vue2-client/base-client/components/iot/DataAnalysisView'
+import DataAnalysisUser from '@vue2-client/base-client/components/iot/DataAnalysisUser'
+import SrcollList from '@vue2-client/base-client/components/common/ScrollList'
+import AmapPointRendering from '@vue2-client/base-client/components/common/AmapMarker'
+import DeviceTypeDetailsView from '@vue2-client/base-client/components/iot/DeviceTypeDetailsView'
+import DeviceBrandDetailsView from '@vue2-client/base-client/components/iot/DeviceBrandDetailsView'
+import DictionaryDetailsView from '@vue2-client/base-client/components/system/DictionaryDetailsView'
+import QueryParamsDetailsView from '@vue2-client/base-client/components/system/QueryParamsDetailsView'
+import DeviceDetailsView from '@vue2-client/base-client/components/iot/DeviceDetailsView'
+import TicketDetailsView from '@vue2-client/base-client/components/ticket/TicketDetailsView'
+import EmployeeDetailsView from '@vue2-client/base-client/components/ticket/EmployeeDetailsView'
+import submitTicketSuccess from '@vue2-client/base-client/components/ticket/TicketSubmitSuccessView'
+import CreateQuery from '@vue2-client/base-client/components/common/CreateQuery'
+import CreateSimpleFormQuery from '@vue2-client/base-client/components/common/CreateSimpleFormQuery'
+import FormGroupQuery from '@vue2-client/base-client/components/common/FormGroupQuery'
+import FormGroupEdit from '@vue2-client/base-client/components/common/FormGroupEdit'
+import JSONToTree from '@vue2-client/base-client/components/common/JSONToTree'
+import Upload from '@vue2-client/base-client/components/common/Upload'
+import AddressSearchCombobox from '@/base-client/components/common/AddressSearchCombobox'
+import CitySelect from '@/base-client/components/common/CitySelect'
+// 插件
+import Plugins from '@vue2-client/base-client/plugins'
+Vue.use(Plugins)
+
+Vue.component('custom-columns-drawer', CustomColumnsDrawer)
+Vue.component('InstructDetailsView', InstructDetailsView)
+Vue.component('MeterDetailsView', MeterDetailsView)
+Vue.component('CustomerDetailsView', CustomerDetailsView)
+Vue.component('LogDetailsView', LogDetailsView)
+Vue.component('WebmeterAnalysisView', WebmeterAnalysisView)
+Vue.component('XCard', XCard)
+Vue.component('XBadge', XBadge)
+Vue.component('XFormCol', XFormCol)
+Vue.component('DataAnalysisView', DataAnalysisView)
+Vue.component('DataAnalysisUser', DataAnalysisUser)
+Vue.component('SrcollList', SrcollList)
+Vue.component('DeviceTypeDetailsView', DeviceTypeDetailsView)
+Vue.component('DeviceBrandDetailsView', DeviceBrandDetailsView)
+Vue.component('DeviceDetailsView', DeviceDetailsView)
+Vue.component('DictionaryDetailsView', DictionaryDetailsView)
+Vue.component('QueryParamsDetailsView', QueryParamsDetailsView)
+Vue.component('TicketDetailsView', TicketDetailsView)
+Vue.component('EmployeeDetailsView', EmployeeDetailsView)
+Vue.component('submitTicketSuccess', submitTicketSuccess)
+Vue.component('CreateQuery', CreateQuery)
+Vue.component('CreateSimpleFormQuery', CreateSimpleFormQuery)
+Vue.component('FormGroupQuery', FormGroupQuery)
+Vue.component('FormGroupEdit', FormGroupEdit)
+Vue.component('JSONToTree', JSONToTree)
+Vue.component('Upload', Upload)
+Vue.component('AmapPointRendering', AmapPointRendering)
+Vue.component('AddressSearchCombobox', AddressSearchCombobox)
+Vue.component('CitySelect', CitySelect)

package/src/base-client/components/common/AddressSearchCombobox/AddressSearchCombobox.vue

@@ -0,0 +1,225 @@
+<template>
+  <div class="certain-category-search-wrapper">
+    <a-auto-complete
+      :disabled="!mapAutocomplete"
+      :dropdown-match-select-width="false"
+      :dropdown-style="{ width: '400px' }"
+      class="certain-category-search"
+      dropdown-class-name="certain-category-search-dropdown"
+      option-label-prop="value"
+      placeholder="输入地址关键字搜索"
+      @search="fetchFunction"
+      @select="onSelect"
+    >
+      <a-spin v-if="searching" slot="notFoundContent" size="small" />
+      <template slot="dataSource">
+        <a-select-opt-group v-for="group in option" :key="group.title">
+          <span
+            slot="label">
+            <a-icon type="bank" /> {{ group.title }}
+          </span>
+          <a-select-option v-for="address in group.children" :key="address.label + ' (' + address.value + ')'">
+            <p class="addressName"><a-icon type="environment" /> <span v-html="highLight(address.label, address.word)">{{ address.label }}</span></p>
+            <p v-if="address.address !== '[]'" class="addressRemark">
+              {{ address.address }}
+            </p>
+          </a-select-option>
+        </a-select-opt-group>
+      </template>
+      <a-input>
+        <a-icon slot="suffix" class="certain-category-icon" type="search"/>
+      </a-input>
+    </a-auto-complete>
+  </div>
+</template>
+<script>
+
+import { post } from '@vue2-client/services/api'
+import { GetGDMap } from '@/utils/map-utils'
+import { debounce } from 'ant-design-vue/lib/vc-table/src/utils'
+
+export default {
+  name: 'AddressSearchCombobox',
+  data () {
+    // 检索去抖
+    this.fetchFunction = debounce(this.fetchFunction, 300)
+    return {
+      // 地址搜索联想
+      mapAutocomplete: undefined,
+      // 检索结果
+      option: [],
+      // 最后检索版本
+      lastFetchId: 0,
+      // 检索中
+      searching: false
+    }
+  },
+  model: {
+    prop: 'searchResult',
+    event: 'onSelect'
+  },
+  props: {
+    searchResult: {
+      type: String,
+      default: undefined
+    },
+    // 返回数据格式
+    searchResultType: {
+      type: String,
+      default: 'Default'
+      // default: 'Array'
+      // default: 'Object'
+    },
+    // Object 返回格式时 可以自定义key
+    resultKeys: {
+      type: Object,
+      default: () => { return { address: 'address', coords: 'coords' } }
+    }
+  },
+  created () {
+  },
+  mounted () {
+    GetGDMap().then(aMap => {
+      this.mapAutocomplete = new (aMap).Autocomplete({})
+    })
+  },
+  methods: {
+    onSelect (value) {
+      let result
+      if (this.searchResultType !== 'Default') {
+        const _arr = value.replace(')', '').split('(')
+        if (this.searchResultType === 'Array') {
+           result = _arr
+        } else {
+          result = {}
+          result[this.resultKeys.address] = _arr[0]
+          result[this.resultKeys.coords] = _arr[1]
+        }
+      }
+      this.$emit('onSelect', JSON.stringify(result) || value)
+      // this.$emit('onClick', result || value)
+    },
+    // 懒加载检索方法
+    fetchFunction (value) {
+      if (value && this.mapAutocomplete) {
+        this.searching = true
+        this.lastFetchId += 1
+        const fetchId = this.lastFetchId
+        this.mapAutocomplete.search(value, (status, result) => {
+          if (fetchId !== this.lastFetchId) {
+            return
+          }
+          if (status === 'complete') {
+            this.option = []
+            const addressMap = {}
+            result.tips.forEach((res) => {
+              if (res.location) {
+                if (!addressMap.hasOwnProperty(res.district)) {
+                  addressMap[res.district] = []
+                }
+                addressMap[res.district].push({
+                  label: res.name,
+                  value: res.location.lat + ',' + res.location.lng,
+                  address: res.address + '',
+                  word: value
+                })
+              }
+            })
+            for (const key of Object.keys(addressMap)) {
+              this.option.push({
+                title: key,
+                children: addressMap[key]
+              })
+            }
+          }
+          this.searching = false
+        })
+      }
+    },
+    // 获取数据
+    getData (value, callback) {
+      if (value !== '') {
+        const logicName = this.attr.keyName
+        const logic = logicName.substring(6)
+        post('/webmeterapi/' + logic, value).then(res => {
+          callback(res)
+        })
+      }
+    },
+    // 关键字高亮
+    highLight (value, word) {
+      // 如果标题中包含，关键字就替换一下
+      if (value.includes(word)) {
+        value = value.replace(word,
+          // 这里是替换成html格式的数据，最好再加一个样式权重，保险一点
+          '<span style="color:red!important;">' + word + '</span>'
+        )
+        return value
+        // eslint-disable-next-line brace-style
+      }
+      // 不包含的话还用这个
+      else {
+        return value
+      }
+    }
+  }
+}
+</script>
+
+<style>
+.certain-category-search-dropdown .ant-select-dropdown-menu-item-group-title {
+  color: #666;
+  font-weight: bold;
+  font-size: 14px;
+}
+
+.certain-category-search-dropdown .ant-select-dropdown-menu-item-group {
+  border-bottom: 1px solid #f6f6f6;
+}
+
+.certain-category-search-dropdown .ant-select-dropdown-menu-item {
+  padding-left: 16px;
+}
+
+.certain-category-search-dropdown .ant-select-dropdown-menu-item.show-all {
+  text-align: center;
+  cursor: default;
+}
+
+.certain-category-search-dropdown .ant-select-dropdown-menu {
+  max-height: 300px;
+}
+</style>
+<style scoped>
+.certain-category-search-wrapper
+>>> .certain-category-search.ant-select-auto-complete
+.ant-input-affix-wrapper
+.ant-input-suffix {
+  right: 12px;
+}
+.certain-category-search-wrapper >>> .certain-search-item-count {
+  position: absolute;
+  color: #999;
+  right: 16px;
+}
+.certain-category-search-wrapper >>> .certain-category-search.ant-select-focused,
+.certain-category-icon {
+  color: #108ee9;
+}
+.certain-category-search-wrapper >>> .certain-category-icon {
+  color: #6e6e6e;
+  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+  font-size: 16px;
+}
+
+.addressName {
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: bold;
+}
+
+.addressRemark {
+  margin-bottom: 0;
+  font-size: 12px;
+}
+</style>

package/src/base-client/components/common/AddressSearchCombobox/index.js

@@ -0,0 +1,3 @@
+import AddressSearchCombobox from './AddressSearchCombobox'
+
+export default AddressSearchCombobox