define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'backend/format'], function ($, undefined, Backend, Table, Form, Format) { var Controller = { /** * 服务区域列表页初始化 */ index: function () { // 初始化表格参数配置 Table.api.init({ extend: { index_url: 'fc/area/index' + location.search, add_url: 'fc/area/add', edit_url: 'fc/area/edit', del_url: 'fc/area/del', multi_url: 'fc/area/multi', import_url: 'fc/area/import', table: 'fc_area', } }); var table = $("#table"); // 初始化表格 table.bootstrapTable({ url: $.fn.bootstrapTable.defaults.extend.index_url, pk: 'id', sortName: 'sort', columns: [ [ {checkbox: true}, {field: 'id', title: __('SerialNo'), operate: false, sortable: false, align: 'center', width: '70px', class: 'fc-serial', table: table, formatter: Format.serial}, {field: 'province', title: __('Province'), operate: 'LIKE'}, {field: 'city', title: __('City'), operate: 'LIKE'}, {field: 'district', title: __('District'), operate: 'LIKE'}, {field: 'full_name', title: __('FullName'), operate: false, sortable: false}, { field: 'enabled', title: __('Enabled'), searchList: {0: '否', 1: '是'}, formatter: Format.statusFormatter({0: '否', 1: '是'}, {0: 'default', 1: 'success'}) }, {field: 'sort', title: __('Sort'), width: '80px'}, {field: 'lat', title: __('Lat'), operate: false, visible: false}, {field: 'lng', title: __('Lng'), operate: false, visible: false}, {field: 'createtime', title: __('Createtime'), operate: 'RANGE', addclass: 'datetimerange', autocomplete: false, formatter: Table.api.formatter.datetime}, {field: 'updatetime', title: __('Updatetime'), operate: 'RANGE', addclass: 'datetimerange', autocomplete: false, formatter: Table.api.formatter.datetime, visible: false}, {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate} ] ] }); // 为表格绑定事件 Table.api.bindevent(table); }, /** * 服务区域新增页初始化 */ add: function () { Controller.api.bindevent(); Controller.api.bindAreaOptions(); }, /** * 服务区域编辑页初始化 */ edit: function () { Controller.api.bindevent(); Controller.api.bindAreaOptions(); }, api: { /** * 绑定表单通用事件 */ bindevent: function () { Form.api.bindevent($("form[role=form]")); }, /** * 规范化省级名称(将直辖市简称统一为标准全称) * @param {string} name 原始省份名称 * @return {string} */ normalizeProvinceName: function (name) { var val = String(name || '').trim(); var map = { '北京': '北京市', '天津': '天津市', '上海': '上海市', '重庆': '重庆市', '台湾': '台湾省' }; return map[val] || val; }, /** * 加载全国行政区划数据(ChineseDistricts) * @param {function} callback 数据加载完成回调 */ loadNationalDistricts: function (callback) { if (typeof window !== 'undefined' && window.ChineseDistricts) { callback(window.ChineseDistricts); return; } require(['citypicker-data'], function () { if (typeof window !== 'undefined' && window.ChineseDistricts) { callback(window.ChineseDistricts); return; } require(['ChineseDistricts'], function (ChineseDistricts) { callback(ChineseDistricts || window.ChineseDistricts || {}); }, function () { callback({}); }); }, function () { callback({}); }); }, /** * 构建全国省 / 市 / 区县全量数据树并合并数据库已有记录 * @param {Object} chineseDistricts 全国行政区划原始字典 * @param {Array} dbRows 数据库已存服务区域记录 * @param {number} currentId 当前编辑记录ID(新增时为0) * @return {Object} 包含 provinces, cityMap, districtMap, allCities, allDistricts, addedMap */ buildAreaDataTree: function (chineseDistricts, dbRows, currentId) { var normalizeProvince = Controller.api.normalizeProvinceName; var provinces = []; var provinceSeen = {}; var cityMap = {}; var districtMap = {}; var addedMap = {}; /** * 确保省份存在于数据树中 * @param {string} prov 省份名称 */ var ensureProvince = function (prov) { var p = normalizeProvince(prov); if (!p) { return ''; } if (!provinceSeen[p]) { provinceSeen[p] = true; provinces.push(p); } if (!cityMap[p]) { cityMap[p] = []; } return p; }; /** * 确保城市存在于指定省份下 * @param {string} prov 省份名称 * @param {string} city 城市名称 */ var ensureCity = function (prov, city) { var p = ensureProvince(prov); var c = String(city || '').trim(); if (!p || !c) { return; } if (cityMap[p].indexOf(c) === -1) { cityMap[p].push(c); } var key = p + '|' + c; if (!districtMap[key]) { districtMap[key] = []; } }; /** * 确保区县存在于指定省市下 * @param {string} prov 省份名称 * @param {string} city 城市名称 * @param {string} dist 区县名称 */ var ensureDistrict = function (prov, city, dist) { var p = ensureProvince(prov); var c = String(city || '').trim(); var d = String(dist || '').trim(); if (!p || !c || !d) { return; } ensureCity(p, c); var key = p + '|' + c; if (districtMap[key].indexOf(d) === -1) { districtMap[key].push(d); } }; // 1. 解析全国行政区划库 ChineseDistricts if (chineseDistricts && chineseDistricts[86]) { var groups = chineseDistricts[86]; var provEntries = []; $.each(groups, function (groupKey, list) { if ($.isArray(list)) { for (var i = 0; i < list.length; i++) { if (list[i] && list[i].code && list[i].address) { provEntries.push(list[i]); } } } }); // 按行政区划代码排序(北京、天津、河北...顺序更符合国标习惯) provEntries.sort(function (a, b) { return String(a.code).localeCompare(String(b.code)); }); for (var i = 0; i < provEntries.length; i++) { var provCode = provEntries[i].code; var provName = ensureProvince(provEntries[i].address); var citiesObj = chineseDistricts[provCode]; if (citiesObj && $.isPlainObject(citiesObj)) { $.each(citiesObj, function (cityCode, cityName) { ensureCity(provName, cityName); var districtsObj = chineseDistricts[cityCode]; if (districtsObj && $.isPlainObject(districtsObj)) { $.each(districtsObj, function (distCode, distName) { ensureDistrict(provName, cityName, distName); }); } }); } } } // 2. 合并数据库已有的 fc_area 记录(兼顾自定义区域与已添加标记) if ($.isArray(dbRows)) { for (var j = 0; j < dbRows.length; j++) { var row = dbRows[j] || {}; var pRaw = String(row.province || '').trim(); var pNorm = normalizeProvince(pRaw); var cName = String(row.city || '').trim(); var dName = String(row.district || '').trim(); var rowId = parseInt(row.id || 0, 10); if (pNorm && cName && dName) { ensureDistrict(pNorm, cName, dName); if (rowId !== currentId) { addedMap[pNorm + '|' + cName + '|' + dName] = true; addedMap[pRaw + '|' + cName + '|' + dName] = true; } } } } // 3. 构建全国扁平化城市索引与区县索引,支持跨省直搜城市/区县反填 var allCities = []; var allDistricts = []; for (var pIdx = 0; pIdx < provinces.length; pIdx++) { var pItem = provinces[pIdx]; var cList = cityMap[pItem] || []; for (var cIdx = 0; cIdx < cList.length; cIdx++) { var cItem = cList[cIdx]; allCities.push({ province: pItem, city: cItem }); var dList = districtMap[pItem + '|' + cItem] || []; for (var dIdx = 0; dIdx < dList.length; dIdx++) { allDistricts.push({ province: pItem, city: cItem, district: dList[dIdx] }); } } } return { provinces: provinces, cityMap: cityMap, districtMap: districtMap, allCities: allCities, allDistricts: allDistricts, addedMap: addedMap }; }, /** * 省 / 市 / 区县全量可搜索级联下拉与中心坐标联动 */ bindAreaOptions: function () { var $raw = $('#area-options'); var $province = $('#c-province'); var $city = $('#c-city'); var $district = $('#c-district'); var $lat = $('#c-lat'); var $lng = $('#c-lng'); if (!$raw.length || !$province.length) { return; } var currentId = parseInt($raw.data('current-id') || 0, 10); var dbRows = []; try { dbRows = JSON.parse($raw.val() || '[]'); } catch (e) { dbRows = []; } if (!$.isArray(dbRows)) { dbRows = []; } var normalizeProvince = Controller.api.normalizeProvinceName; var coordAutoFilled = false; var geocodeTimer = null; /** * 更新输入框包装容器的 has-value 状态(控制清空按钮显示) */ var syncWrapState = function () { $('.fc-area-select-wrap').each(function () { var $wrap = $(this); var val = String($wrap.find('.fc-area-input').val() || '').trim(); $wrap.toggleClass('has-value', val !== ''); }); }; /** * 将 WGS84 坐标转换为 GCJ02 坐标(中国大陆标准) * @param {number} wgsLng WGS84经度 * @param {number} wgsLat WGS84纬度 * @return {{lat: number, lng: number}} */ var wgs84ToGcj02 = function (wgsLng, wgsLat) { var lon = Number(wgsLng); var lat = Number(wgsLat); if (!isFinite(lon) || !isFinite(lat)) { return {lat: lat, lng: lon}; } var a = 6378245.0; var ee = 0.00669342162296594323; var pi = Math.PI; var transformLat = function (x, y) { var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x)); ret += (20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0; ret += (20.0 * Math.sin(y * pi) + 40.0 * Math.sin(y / 3.0 * pi)) * 2.0 / 3.0; ret += (160.0 * Math.sin(y / 12.0 * pi) + 320 * Math.sin(y * pi / 30.0)) * 2.0 / 3.0; return ret; }; var transformLon = function (x, y) { var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x)); ret += (20.0 * Math.sin(6.0 * x * pi) + 20.0 * Math.sin(2.0 * x * pi)) * 2.0 / 3.0; ret += (20.0 * Math.sin(x * pi) + 40.0 * Math.sin(x / 3.0 * pi)) * 2.0 / 3.0; ret += (150.0 * Math.sin(x / 12.0 * pi) + 300.0 * Math.sin(x / 30.0 * pi)) * 2.0 / 3.0; return ret; }; var dLat = transformLat(lon - 105.0, lat - 35.0); var dLon = transformLon(lon - 105.0, lat - 35.0); var radLat = lat / 180.0 * pi; var magic = Math.sin(radLat); magic = 1 - ee * magic * magic; var sqrtMagic = Math.sqrt(magic); dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * pi); dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * pi); return { lat: lat + dLat, lng: lon + dLon }; }; /** * 刷新完整区域实时预览文案并同步地图选点按钮默认地址 */ var refreshPreview = function () { var parts = [ String($province.val() || '').trim(), String($city.val() || '').trim(), String($district.val() || '').trim() ].filter(function (item) { return item !== ''; }); $('#area-full-name').text(parts.length ? parts.join(' / ') : '未选择'); $('.fc-area-map-btn').data('address', parts.join('')); syncWrapState(); }; /** * 刷新中心坐标状态提示文案 * @param {boolean} isAuto 是否为自动匹配填充 */ var refreshCoordTip = function (isAuto) { var lat = String($lat.val() || '').trim(); var lng = String($lng.val() || '').trim(); var $tip = $('#area-coord-tip'); if (lat && lng && isFinite(lat) && isFinite(lng)) { var prefix = isAuto ? '已根据所选区域自动匹配中心坐标:' : '已设置中心坐标:'; $tip.removeClass('is-missing').addClass('is-set') .text(prefix + lat + ', ' + lng + '(可点击「地图选点」微调)'); } else { $tip.removeClass('is-set').addClass('is-missing') .text('未设置坐标:选择区域后将自动匹配中心坐标,也可点击「地图选点」手动指定'); } }; /** * 根据所选省市区自动解析中心经纬度(腾讯Place接口 + Nominatim自动降级) */ var autoResolveCoordinates = function () { var p = String($province.val() || '').trim(); var c = String($city.val() || '').trim(); var d = String($district.val() || '').trim(); if (!p || !c || !d) { return; } var curLat = String($lat.val() || '').trim(); var curLng = String($lng.val() || '').trim(); // 若已有手动填写的坐标且非自动匹配产生,则不覆盖 if (curLat && curLng && !coordAutoFilled) { return; } if (geocodeTimer) { clearTimeout(geocodeTimer); } geocodeTimer = setTimeout(function () { var queryAddress = (p === c ? p : (p + ' ' + c)) + ' ' + d; var resolveByNominatim = function () { $.ajax({ url: 'https://nominatim.openstreetmap.org/search', dataType: 'jsonp', jsonp: 'json_callback', data: { format: 'json', q: queryAddress, limit: 1, 'accept-language': 'zh-CN', countrycodes: 'cn' }, success: function (list) { if ($.isArray(list) && list.length > 0 && list[0].lat && list[0].lon) { var gcj = wgs84ToGcj02(list[0].lon, list[0].lat); coordAutoFilled = true; $lat.val(Number(gcj.lat).toFixed(6)); $lng.val(Number(gcj.lng).toFixed(6)); refreshCoordTip(true); } } }); }; var tencentKey = 'WM7BZ-ZAYLL-MZEPZ-MRZBT-MBYJE-ZAFIT'; $.ajax({ url: 'https://apis.map.qq.com/ws/place/v1/suggestion', dataType: 'jsonp', data: { keyword: (p === c ? p : (p + c)) + d, region: c, key: tencentKey, output: 'jsonp' }, success: function (ret) { if (ret && ret.status === 0 && $.isArray(ret.data) && ret.data.length > 0 && ret.data[0].location) { var loc = ret.data[0].location; if (loc.lat && loc.lng) { coordAutoFilled = true; $lat.val(Number(loc.lat).toFixed(6)); $lng.val(Number(loc.lng).toFixed(6)); refreshCoordTip(true); return; } } resolveByNominatim(); }, error: function () { resolveByNominatim(); } }); }, 180); }; refreshPreview(); refreshCoordTip(false); // 手动修改坐标时标记为非自动填充 $lat.add($lng).on('input change', function () { coordAutoFilled = false; refreshCoordTip(false); }); // 加载全国省市区数据并绑定下拉交互 Controller.api.loadNationalDistricts(function (chineseDistricts) { var tree = Controller.api.buildAreaDataTree(chineseDistricts, dbRows, currentId); /** * 根据输入省份名称匹配标准省份键名 * @param {string} inputProv 输入的省份名 * @return {string} */ var resolveProvinceKey = function (inputProv) { var raw = String(inputProv || '').trim(); if (!raw) { return ''; } var norm = normalizeProvince(raw); if (tree.cityMap[norm]) { return norm; } for (var i = 0; i < tree.provinces.length; i++) { if (tree.provinces[i].indexOf(raw) !== -1 || raw.indexOf(tree.provinces[i].replace(/省|市|自治区|特别行政区|壮族|回族|维吾尔/g, '')) !== -1) { return tree.provinces[i]; } } return raw; }; /** * 关闭所有下拉面板 * @param {jQuery} [$exceptWrap] 排除不关闭的容器 */ var closeAllDropdowns = function ($exceptWrap) { $('.fc-area-select-wrap').each(function () { if (!$exceptWrap || !$(this).is($exceptWrap)) { $(this).removeClass('is-open'); } }); }; /** * 滚动下拉框使当前选中项可见 * @param {jQuery} $dropdown 下拉面板元素 */ var scrollActiveIntoView = function ($dropdown) { var $active = $dropdown.find('.fc-area-dropdown__item.is-active').first(); if ($active.length) { var top = $active.position().top + $dropdown.scrollTop() - 40; $dropdown.scrollTop(Math.max(0, top)); } else { $dropdown.scrollTop(0); } }; /** * 渲染省份下拉列表 * @param {boolean} filterByInput 是否根据当前输入内容过滤 */ var renderProvinceDropdown = function (filterByInput) { var $dropdown = $('#province-dropdown'); var currentVal = String($province.val() || '').trim(); var currentNorm = normalizeProvince(currentVal); var keyword = filterByInput ? currentVal.toLowerCase() : ''; var list = tree.provinces.filter(function (prov) { if (!keyword) { return true; } return prov.toLowerCase().indexOf(keyword) !== -1; }); $dropdown.empty(); $('