如何使用ssm实现超市管理系统

@TOC

10917ssm超市管理系统

系统概述

进过系统的分析后，就开始记性系统的设计，系统设计包含总体设计和详细设计。总体设计只是一个大体的设计，经过了总体设计，我们能够划分出系统的一些东西，例如文件、文档、数据等。而且我们通过总体设计，大致可以划分出了程序的模块，以及功能。但是只是一个初步的分类，并没有真正的实现。

整体设计，只是一个初步设计，而且，对于一个项目，我们可以进行多个整体设计，通过对比，包括性能的对比、成本的对比、效益的对比，来最终确定一个最优的设计方案，选择优秀的整体设计可以降低开发成本，增加公司效益，从这一点来讲，整体设计还是非常重要的。

超市管理系统工作原理图如图4-1所示：

图4-1 系统工作原理图

4.2 系统结构设计

系统架构图属于系统设计阶段，系统架构图只是这个阶段一个产物，系统的总体架构决定了整个系统的模式，是系统的基础。超市管理系统的整体结构设计如图4-2所示。

图4-2 系统结构图

4.3数据库设计

数据库是计算机信息系统的基础。目前，电脑系统的关键与核心部分就是数据库。数据库开发的优劣对整个系统的质量和速度有着直接影响。

4.3.1 数据库设计原则

数据库的概念结构设计采用实体---联系（E-R）模型设计方法。E-R模型法的组成元素有：实体、属性、联系，E-R模型用E-R图表示，是提示员工工作环境中所涉及的事物，属性则是对实体特性的描述。在系统设计当中数据库起着决定性的因素。下面设计出这几个关键实体的实体---关系图。

4.3.2 数据库实体

数据模型中的实体（Entity），也称为实例，对应现实世界中可区别于其他对象的"事件"或"事物"。例如，公司中的每个员工，家里中的每个家具。

本系统的E-R图如下图所示：

1、请假信息管理实体图如图4-3所示：

图4-3请假信息管理实体图

2、员工管理实体图如图4-4所示：

图4-4员工管理实体图

3、商品库存管理实体图如图4-5所示：

图4-5商品库存管理实体图

#########

4.3.3 数据库表设计

数据库的表信息属于设计的一部分，下面介绍数据库中的各个表的详细信息。

表4-1 allusers表

列名	数据类型	长度	约束
id	int	11	NOT NULL
username	varchar	50	default NULL
pwd	varchar	50	default NULL
cx	varchar	50	default NULL

表4-2 gongyingshang表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
gongyingshangmingcheng	varchar	50	default NULL
gongyingshangleixing	varchar	50	default NULL
fuzeren	varchar	50	default NULL
lianxidianhua	varchar	50	default NULL
youxiang	varchar	50	default NULL
xiangxidizhi	varchar	50	default NULL

表4-3：jiaoliuhuifu表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
biaoti	varchar	50	default NULL
gonghao	varchar	50	default NULL
xingming	varchar	50	default NULL
riqi	varchar	50	default NULL
jiaoliuhuifu	varchar	50	default NULL

表4-4：jiaoliuxinxi表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
biaoti	varchar	50	default NULL
jiaoliuneirong	varchar	50	default NULL
jiaoliuriqi	varchar	50	default NULL
gonghao	varchar	50	default NULL
xingming	varchar	50	default NULL

表4-5：qingjiaxinxi表

列名	数据类型	长度	约束
id	int	11	NOT NULL
addtime	varchar	50	default NULL
biaoti	varchar	50	default NULL
qingjiariqi	varchar	50	default NULL
qingjiatianshu	varchar	50	default NULL
jieshuriqi	varchar	50	default NULL
qingjianeirong	varchar	50	default NULL
gonghao	varchar	50	default NULL
xingming	varchar	50	default NULL
sfsh	varchar	50	default NULL
shhf	varchar	50	default NULL

5统详细设计

5.1管理员功能模块

管理员登录，通过填写用户名、密码进行登录，如图5-1所示。

图5-1管理员登录界面图

管理员登录进入超市管理系统可以查看个人中心、员工管理、供应商管理、商品库存管理、商品类型管理、商品进货管理、商品销售管理、上班打卡管理、请假信息管理、交流信息管理、交流回复管理等信息。

员工管理，在员工管理页面中可以通过填写工号、姓名、性别、头像、部门、职位、电话等内容进行修改、删除，如图5-2所示。还可以根据需要对商品类型管理进行详情，修改等详细操作，如图5-3所示。

图5-2员工管理界面图

图5-3商品类型管理界面图

商品库存管理，在商品库存管理页面中可以查看商品名称、商品类型、图片、价格、数量、发布日期、商品详情、用户id等信息，并可根据需要对已有商品库存管理进行修改或删除等操作，如图5-4所示。

图5-4商品库存管理界面图

商品进货管理，在商品进货管理页面中可以查看商品名称、商品类型、进货价格、数量、总价格、进货日期、进货公司、备注、工号、姓名等信息，并可根据需要对已有商品进货管理进行修改或删除等详细操作，如图5-5所示。

图5-5商品进货管理界面图

上班打卡管理，在上班打卡管理页面中可以查看工号、姓名、打卡时间、打卡内容等内容，并且根据需要对已有上班打卡管理进行详情，修改或删除等详细操作，如图5-6所示。

图5-6上班打卡管理界面图

请假信息管理，在请假信息管理页面中可以查看标题、请假日期、请假天数、结束日期、请假内容、工号、姓名、是否审核、审核回复等内容，并且根据需要对已有请假信息管理进行详情，修改或删除等详细操作，如图5-7所示。

图5-7请假信息管理界面图

交流信息管理，在交流信息管理页面中可以查看标题、交流内容、交流日期、工号、姓名等内容，并且根据需要对已有交流信息管理进行修改或删除等详细操作，如图5-8所示。

图5-8交流信息管理界面图

5.2员工功能模块

员工登录进入超市管理系统可以查看个人中心、供应商管理、商品库存管理、商品进货管理、商品销售管理、上班打卡管理、请假信息管理、交流信息管理、交流回复管理等内容。

商品库存管理，在商品库存管理页面中通过查看商品名称、商品类型、图片、价格、数量、发布日期、商品详情、用户id等信息，还可以根据需要对商品库存管理进行修改，如图5-9所示。

图5-9商品库存管理界面图

上班打卡管理，在上班打卡管理页面中可以查看工号、姓名、打卡时间、打卡内容等信息，并且根据需要对已有上班打卡管理进行查看删除等其他详细操作，如图5-10所示。

图5-10上班打卡管理界面图

请假信息管理，在请假信息管理页面中通过查看标题、请假日期、请假天数、结束日期、请假内容、工号、姓名、是否审核、审核回复等内容进行查看、修改、删除，如图5-11所示。

图5-11请假信息管理界面图

交流信息管理，在交流信息管理页面中通过查看标题、交流内容、交流日期、工号、姓名等内容进行查看、删除，如图5-12所示。

图5-12交流信息管理界面图

BaiduUtil.java

package com.utils;

import java.io.BufferedReader;
import java.io.InputStreamReader;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

import org.json.JSONObject;


/**
* 类说明 : 
*/

public class BaiduUtil {
	
    /**
     * 根据经纬度获得省市区信息
     * @param lon 纬度
     * @param lat 经度
     * @param coordtype 经纬度坐标系
     * @return
     */
    public static Map<String, String> getCityByLonLat(String key, String lng, String lat) {
        String location = lat + "," + lng;
        try {
            //拼装url
            String url = "http://api.map.baidu.com/reverse_geocoding/v3/?ak="+key+"&output=json&coordtype=wgs84ll&location="+location;
            String result = HttpClientUtils.doGet(url);
            JSONObject o = new JSONObject(result);
            Map<String, String> area = new HashMap<>();
			area.put("province", o.getJSONObject("result").getJSONObject("addressComponent").getString("province"));
			area.put("city", o.getJSONObject("result").getJSONObject("addressComponent").getString("city"));
			area.put("district", o.getJSONObject("result").getJSONObject("addressComponent").getString("district"));
			area.put("street", o.getJSONObject("result").getJSONObject("addressComponent").getString("street"));
            return area;
        }catch (Exception e) {
            e.printStackTrace();
        }
        return null;
    }

    /**
	     * 获取API访问token
	     * 该token有一定的有效期，需要自行管理，当失效时需重新获取.
	     * @param ak - 百度云官网获取的 API Key
	     * @param sk - 百度云官网获取的 Securet Key
	     * @return assess_token
	     */
    public static String getAuth(String ak, String sk) {
        // 获取token地址
        String authHost = "https://aip.baidubce.com/oauth/2.0/token?";
        String getAccessTokenUrl = authHost
                // 1. grant_type为固定参数
                + "grant_type=client_credentials"
                // 2. 官网获取的 API Key
                + "&client_id=" + ak
                // 3. 官网获取的 Secret Key
                + "&client_secret=" + sk;
        try {
            URL realUrl = new URL(getAccessTokenUrl);
            // 打开和URL之间的连接
            HttpURLConnection connection = (HttpURLConnection) realUrl.openConnection();
            connection.setRequestMethod("GET");
            connection.connect();
            // 获取所有响应头字段
            Map<String, List<String>> map = connection.getHeaderFields();
            // 遍历所有的响应头字段
            for (String key : map.keySet()) {
                System.err.println(key + "--->" + map.get(key));
            }
            // 定义 BufferedReader输入流来读取URL的响应
            BufferedReader in = new BufferedReader(new InputStreamReader(connection.getInputStream()));
            String result = "";
            String line;
            while ((line = in.readLine()) != null) {
                result += line;
            }
            /**
             * 返回结果示例
             */
            System.err.println("result:" + result);
            org.json.JSONObject jsonObject = new org.json.JSONObject(result);
            String access_token = jsonObject.getString("access_token");
            return access_token;
        } catch (Exception e) {
            System.err.printf("获取token失败！");
            e.printStackTrace(System.err);
        }
        return null;
    }

}

CommonServiceImpl.java

package com.service.impl;


import java.util.List;
import java.util.Map;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.dao.CommonDao;
import com.service.CommonService;


/**
 * 系统用户
 */
@Service("commonService")
public class CommonServiceImpl implements CommonService {
	
	@Autowired
	private CommonDao commonDao;

	@Override
	public List<String> getOption(Map<String, Object> params) {
		return commonDao.getOption(params);
	}
	
	@Override
	public Map<String, Object> getFollowByOption(Map<String, Object> params) {
		return commonDao.getFollowByOption(params);
	}
	
	@Override
	public void sh(Map<String, Object> params) {
		commonDao.sh(params); 
	}

	@Override
	public int remindCount(Map<String, Object> params) {
		return commonDao.remindCount(params);
	}

	@Override
	public Map<String, Object> selectCal(Map<String, Object> params) {
		return commonDao.selectCal(params);
	}
	
	@Override
	public List<Map<String, Object>> selectGroup(Map<String, Object> params) {
		return commonDao.selectGroup(params);
	}
	
	@Override
	public List<Map<String, Object>> selectValue(Map<String, Object> params) {
		return commonDao.selectValue(params);
	}

}

JiaoliuxinxiController.java

package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.JiaoliuxinxiEntity;
import com.entity.view.JiaoliuxinxiView;

import com.service.JiaoliuxinxiService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;


/**
 * 交流信息
 * 后端接口
 * @author 
 * @email 
 * @date 2021-03-10 17:20:00
 */
@RestController
@RequestMapping("/jiaoliuxinxi")
public class JiaoliuxinxiController {
    @Autowired
    private JiaoliuxinxiService jiaoliuxinxiService;
    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,JiaoliuxinxiEntity jiaoliuxinxi, 
		HttpServletRequest request){

		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("yuangong")) {
			jiaoliuxinxi.setGonghao((String)request.getSession().getAttribute("username"));
		}
        EntityWrapper<JiaoliuxinxiEntity> ew = new EntityWrapper<JiaoliuxinxiEntity>();
    	PageUtils page = jiaoliuxinxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiaoliuxinxi), params), params));
		request.setAttribute("data", page);
        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,JiaoliuxinxiEntity jiaoliuxinxi, HttpServletRequest request){
        EntityWrapper<JiaoliuxinxiEntity> ew = new EntityWrapper<JiaoliuxinxiEntity>();
    	PageUtils page = jiaoliuxinxiService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, jiaoliuxinxi), params), params));
		request.setAttribute("data", page);
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( JiaoliuxinxiEntity jiaoliuxinxi){
       	EntityWrapper<JiaoliuxinxiEntity> ew = new EntityWrapper<JiaoliuxinxiEntity>();
      	ew.allEq(MPUtil.allEQMapPre( jiaoliuxinxi, "jiaoliuxinxi")); 
        return R.ok().put("data", jiaoliuxinxiService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(JiaoliuxinxiEntity jiaoliuxinxi){
        EntityWrapper< JiaoliuxinxiEntity> ew = new EntityWrapper< JiaoliuxinxiEntity>();
 		ew.allEq(MPUtil.allEQMapPre( jiaoliuxinxi, "jiaoliuxinxi")); 
		JiaoliuxinxiView jiaoliuxinxiView =  jiaoliuxinxiService.selectView(ew);
		return R.ok("查询交流信息成功").put("data", jiaoliuxinxiView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        JiaoliuxinxiEntity jiaoliuxinxi = jiaoliuxinxiService.selectById(id);
        return R.ok().put("data", jiaoliuxinxi);
    }

    /**
     * 前端详情
     */
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        JiaoliuxinxiEntity jiaoliuxinxi = jiaoliuxinxiService.selectById(id);
        return R.ok().put("data", jiaoliuxinxi);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody JiaoliuxinxiEntity jiaoliuxinxi, HttpServletRequest request){
    	jiaoliuxinxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(jiaoliuxinxi);

        jiaoliuxinxiService.insert(jiaoliuxinxi);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody JiaoliuxinxiEntity jiaoliuxinxi, HttpServletRequest request){
    	jiaoliuxinxi.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(jiaoliuxinxi);

        jiaoliuxinxiService.insert(jiaoliuxinxi);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    public R update(@RequestBody JiaoliuxinxiEntity jiaoliuxinxi, HttpServletRequest request){
        //ValidatorUtils.validateEntity(jiaoliuxinxi);
        jiaoliuxinxiService.updateById(jiaoliuxinxi);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        jiaoliuxinxiService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<JiaoliuxinxiEntity> wrapper = new EntityWrapper<JiaoliuxinxiEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}

		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("yuangong")) {
			wrapper.eq("gonghao", (String)request.getSession().getAttribute("username"));
		}

		int count = jiaoliuxinxiService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	
	


}

spechars.js

/**
 * Created with JetBrains PhpStorm.
 * User: xuheng
 * Date: 12-9-26
 * Time: 下午1:09
 * To change this template use File | Settings | File Templates.
 */
var charsContent = [
    { name:"tsfh", title:lang.tsfh, content:toArray("、,。,·,ˉ,ˇ,¨,〃,々,---,～,‖,...,',',",",〔,〕,〈,〉,《,》,「,」,『,』,〖,〗,【,】,±,×,÷,∶,∧,∨,∑,∏,∪,∩,∈,∷,√,⊥,∥,∠,⌒,⊙,∫,∮,≡,≌,≈,∽,∝,≠,≮,≯,≤,≥,∞,∵,∴,♂,♀,°,′,″,℃,＄,¤,￠,￡,‰,§,№,☆,★,○,●,◎,◇,◆,□,■,△,▲,※,→,←,↑,↓,〓,〡,〢,〣,〤,〥,〦,〧,〨,〩,㊣,㎎,㎏,㎜,㎝,㎞,㎡,㏄,㏎,㏑,㏒,㏕,︰,￢,￤,℡,ˊ,ˋ,˙,--,―,‥,‵,℅,℉,↖,↗,↘,↙,∕,∟,∣,≒,≦,≧,⊿,═,║,╒,╓,╔,╕,╖,╗,╘,╙,╚,╛,╜,╝,╞,╟,╠,╡,╢,╣,╤,╥,╦,╧,╨,╩,╪,╫,╬,╭,╮,╯,╰,╱,╲,╳,▁,▂,▃,▄,▅,▆,▇,�,█,▉,▊,▋,▌,▍,▎,▏,▓,▔,▕,▼,▽,◢,◣,◤,◥,☉,⊕,〒,〝,〞")},
    { name:"lmsz", title:lang.lmsz, content:toArray("ⅰ,ⅱ,ⅲ,ⅳ,ⅴ,ⅵ,ⅶ,ⅷ,ⅸ,ⅹ,Ⅰ,Ⅱ,Ⅲ,Ⅳ,Ⅴ,Ⅵ,Ⅶ,Ⅷ,Ⅸ,Ⅹ,Ⅺ,Ⅻ")},
    { name:"szfh", title:lang.szfh, content:toArray("⒈,⒉,⒊,⒋,⒌,⒍,⒎,⒏,⒐,⒑,⒒,⒓,⒔,⒕,⒖,⒗,⒘,⒙,⒚,⒛,⑴,⑵,⑶,⑷,⑸,⑹,⑺,⑻,⑼,⑽,⑾,⑿,⒀,⒁,⒂,⒃,⒄,⒅,⒆,⒇,①,②,③,④,⑤,⑥,⑦,⑧,⑨,⑩,㈠,㈡,㈢,㈣,㈤,㈥,㈦,㈧,㈨,㈩")},
    { name:"rwfh", title:lang.rwfh, content:toArray("ぁ,あ,ぃ,い,ぅ,う,ぇ,え,ぉ,お,か,が,き,ぎ,く,ぐ,け,げ,こ,ご,さ,ざ,し,じ,す,ず,せ,ぜ,そ,ぞ,た,だ,ち,ぢ,っ,つ,づ,て,で,と,ど,な,に,ぬ,ね,の,は,ば,ぱ,ひ,び,ぴ,ふ,ぶ,ぷ,へ,べ,ぺ,ほ,ぼ,ぽ,ま,み,む,め,も,ゃ,や,ゅ,ゆ,ょ,よ,ら,り,る,れ,ろ,ゎ,わ,ゐ,ゑ,を,ん,ァ,ア,ィ,イ,ゥ,ウ,ェ,エ,ォ,オ,カ,ガ,キ,ギ,ク,グ,ケ,ゲ,コ,ゴ,サ,ザ,シ,ジ,ス,ズ,セ,ゼ,ソ,ゾ,タ,ダ,チ,ヂ,ッ,ツ,ヅ,テ,デ,ト,ド,ナ,ニ,ヌ,ネ,ノ,ハ,バ,パ,ヒ,ビ,ピ,フ,ブ,プ,ヘ,ベ,ペ,ホ,ボ,ポ,マ,ミ,ム,メ,モ,ャ,ヤ,ュ,ユ,ョ,ヨ,ラ,リ,ル,レ,ロ,ヮ,ワ,ヰ,ヱ,ヲ,ン,ヴ,ヵ,ヶ")},
    { name:"xlzm", title:lang.xlzm, content:toArray("Α,Β,Γ,Δ,Ε,Ζ,Η,Θ,Ι,Κ,Λ,Μ,Ν,Ξ,Ο,Π,Ρ,Σ,Τ,Υ,Φ,Χ,Ψ,Ω,α,β,γ,δ,ε,ζ,η,θ,ι,κ,λ,μ,ν,ξ,ο,π,ρ,σ,τ,υ,φ,χ,ψ,ω")},
    { name:"ewzm", title:lang.ewzm, content:toArray("А,Б,В,Г,Д,Е,Ё,Ж,З,И,Й,К,Л,М,Н,О,П,Р,С,Т,У,Ф,Х,Ц,Ч,Ш,Щ,Ъ,Ы,Ь,Э,Ю,Я,а,б,в,г,д,е,ё,ж,з,и,й,к,л,м,н,о,п,р,с,т,у,ф,х,ц,ч,ш,щ,ъ,ы,ь,э,ю,я")},
    { name:"pyzm", title:lang.pyzm, content:toArray("ā,á,ǎ,à,ē,é,ě,è,ī,í,ǐ,ì,ō,ó,ǒ,ò,ū,ú,ǔ,ù,ǖ,ǘ,ǚ,ǜ,ü")},
    { name:"yyyb", title:lang.yyyb, content:toArray("i:,i,e,æ,ʌ,ə:,ə,u:,u,ɔ:,ɔ,a:,ei,ai,ɔi,əu,au,iə,εə,uə,p,t,k,b,d,g,f,s,ʃ,θ,h,v,z,ʒ,ð,tʃ,tr,ts,dʒ,dr,dz,m,n,ŋ,l,r,w,j,")},
    { name:"zyzf", title:lang.zyzf, content:toArray("ㄅ,ㄆ,ㄇ,ㄈ,ㄉ,ㄊ,ㄋ,ㄌ,ㄍ,ㄎ,ㄏ,ㄐ,ㄑ,ㄒ,ㄓ,ㄔ,ㄕ,ㄖ,ㄗ,ㄘ,ㄙ,ㄚ,ㄛ,ㄜ,ㄝ,ㄞ,ㄟ,ㄠ,ㄡ,ㄢ,ㄣ,ㄤ,ㄥ,ㄦ,ㄧ,ㄨ")}
];
(function createTab(content) {
    for (var i = 0, ci; ci = content[i++];) {
        var span = document.createElement("span");
        span.setAttribute("tabSrc", ci.name);
        span.innerHTML = ci.title;
        if (i == 1)span.className = "focus";
        domUtils.on(span, "click", function () {
            var tmps = $G("tabHeads").children;
            for (var k = 0, sk; sk = tmps[k++];) {
                sk.className = "";
            }
            tmps = $G("tabBodys").children;
            for (var k = 0, sk; sk = tmps[k++];) {
                sk.style.display = "none";
            }
            this.className = "focus";
            $G(this.getAttribute("tabSrc")).style.display = "";
        });
        $G("tabHeads").appendChild(span);
        domUtils.insertAfter(span, document.createTextNode("\n"));
        var div = document.createElement("div");
        div.id = ci.name;
        div.style.display = (i == 1) ? "" : "none";
        var cons = ci.content;
        for (var j = 0, con; con = cons[j++];) {
            var charSpan = document.createElement("span");
            charSpan.innerHTML = con;
            domUtils.on(charSpan, "click", function () {
                editor.execCommand("insertHTML", this.innerHTML);
                dialog.close();
            });
            div.appendChild(charSpan);
        }
        $G("tabBodys").appendChild(div);
    }
})(charsContent);
function toArray(str) {
    return str.split(",");
}

声明

本博客适用于广泛的学术和教育用途，包括但不限于个人学习、开发设计，产品设计。仅供学习参考，旨在为读者提供深入理解和学术研究的材料。