demo.html 2.9 KB
<div id="fscores_page" class="page out" data-title="星级评分">
	<div class="page-content" id="fscores_content">
		<div id="fscores-header"></div>
		<div id="fscores-form"></div>
		<div id="fscores1"></div>
		<div id="fscores2"></div>
		<div id="fscores-fbutton"></div>
	</div>
</div>
<script>
require(["NavHeader", "Form", "FScores", "FButton", "mUtil"], function(NavHeader, Form, FScores, FButton, mUtil) {
	var _u = require("mUtil");
	var hasClsPicker = typeof clsPicker !== "undefined";

	if(!hasClsPicker) {
		new NavHeader({
			el: "fscores-header",
			option: {
				title:"表单-星级评分", 
				smallTitle:"fscores"
			}
		}).render();
		
		new Form({
			el: "fscores-form",
			option: {
				submit : {
					action : "/mobilemode/mobile/demo/plugin/Form/formAction.jsp",//提交地址
					validate : function(){
						//表单提交前验证脚本
					}
				}
			}
		}).render();
	}

	new FScores({
		el: "fscores1",
		option: {
			form : "fscores-form",
			field : {
				label : "服务态度",//显示名称
				name : "f1",//对应字段
				size : 5,// 评分个数
				text : "非常差,差,一般,好,非常好",//评分名称
				value : 4//评分
			},
			required : true,
			readonly : false
		}
	}).render().then(function () {
		if (!hasClsPicker) return;

		_u.vetically("#fscores1");

		clsPicker.golalSetting({
			container: ".wev-comp-FScores",
			type: "FScores"
		});

		new clsPicker({
			selector: ".wev-field",
			text: ".wev-field",
			lineYSkew: 20
		});
		new clsPicker({
			selector: ".wev-field>div:nth-child(1)",
			text: " ",
			lineYSkew: 50,
			position: "top right"
		});
		new clsPicker({
			selector: ".wev-comp-score>b",
			text: " ",
			lineYSkew: 20,
			position: "top right"
		});
		new clsPicker({
			selector: ".wev-comp-score label",
			text: " ",
			lineYSkew: 20,
			position: "top right"
		});
		new clsPicker({
			selector: ".wev-field>div:nth-child(2)",
			text: " ",
			lineYSkew: 50,
			position: "top right"
		});
	});
	
	if(!hasClsPicker) {
		new FScores({
			el: "fscores2",
			option: {
				form : "fscores-form",
				field : {
					label : "满意度",//显示名称
					name : "f2",//对应字段
					size : 5,// 评分个数
					text : "很不满意,不满意,一般,好,非常满意",//评分名称
					value : 3//评分
				},
				required : false,
				readonly : false,
				icons : {
					icon1 : "/mobilemode/mobile/images/demo/smile.png",
					icon2 : "/mobilemode/mobile/images/demo/sad.png"
				}
			}
		}).render();
		
		new FButton({
			el: "fscores-fbutton",
			container: "#fscores_page",
			option: {
				form : "fscores-form",
				btns : [
					{
						text : "重置",
						action : "reset"
					},
					{
						text : "提交",
						action : "submit",
						callback : function(billid) {
							console.log(billid);
						},
						remindMsg : "操作成功"
					}
				],
				fixed : true
			}
		}).render();
	}

	mUtil.trigger('load');//页面渲染完成回调
});
</script>