优化select2

This commit is contained in:
java110 2020-06-30 00:11:49 +08:00
parent 4aa2d9d268
commit 7ea3ac9532
8 changed files with 209 additions and 167 deletions

4
app.js
View File

@ -33,8 +33,8 @@ let opts = {
//app.use('/callComponent',proxy('https://app.demo.winqi.cn/',opts));
//app.use('/callComponent',proxy('http://api.demo.winqi.cn:8012/',opts));
//app.use('/callComponent',proxy('http://api.demo.winqi.cn:8012',opts));
app.use('/callComponent',proxy('http://192.168.1.16:8012',opts));
app.use('/callComponent',proxy('http://api.demo.winqi.cn:8012',opts));
//app.use('/callComponent',proxy('http://192.168.1.16:8012',opts));
//app.listen(3000);

View File

@ -1,5 +1,4 @@
<div id="addOwnerRepairModel" class="modal fade" role="dialog" aria-labelledby="exampleModalLabel"
aria-hidden="true">
<div id="addOwnerRepairModel" class="modal fade" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-body">
@ -7,7 +6,29 @@
<div class="ibox-content">
<div>
<div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属楼栋</label>
<div class="col-sm-10">
<vc:create path="property/floorSelect2" parentModal="addOwnerRepairModel"
namespace="addOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属单元</label>
<div class="col-sm-10">
<vc:create path="property/unitSelect2" parentModal="addOwnerRepairModel"
callBackListener="addOwnerRepair" callBackFunction="notify2"
namespace="addOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属房屋</label>
<div class="col-sm-10">
<vc:create path="property/roomSelect2" parentModal="addOwnerRepairModel"
callBackListener="addOwnerRepair" callBackFunction="notify"
namespace="addOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">报修类型</label>
<div class="col-sm-10">
@ -31,37 +52,7 @@
class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属楼栋</label>
<div class="col-sm-10">
<vc:create path="property/floorSelect2"
parentModal="addOwnerRepairModel"
namespace="addOwnerRepair"
></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属单元</label>
<div class="col-sm-10">
<vc:create path="property/unitSelect2"
parentModal="addOwnerRepairModel"
callBackListener="addOwnerRepair"
callBackFunction="notify"
namespace="addOwnerRepair"
></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属房屋</label>
<div class="col-sm-10">
<vc:create path="property/roomSelect2"
parentModal="addOwnerRepairModel"
callBackListener="addOwnerRepair"
callBackFunction="notify"
namespace="addOwnerRepair"
></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">预约时间</label>
<div class="col-sm-10">

View File

@ -22,8 +22,11 @@
vc.component._initAddOwnerRepairInfo();
},
_initEvent: function () {
vc.on('addOwnerRepair','notify',function(_param){
console.log(_param);
vc.on('addOwnerRepair', 'notify', function (_param) {
console.log('notify', _param);
if (_param.hasOwnProperty('roomId')) {
$that.addOwnerRepairInfo.roomId = _param.roomId;
}
});
vc.on('addOwnerRepair', 'openAddOwnerRepairModal', function (_ownerInfo) {
$('#addOwnerRepairModel').modal('show');

View File

@ -7,14 +7,36 @@
<div class="ibox-content">
<div>
<div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属楼栋</label>
<div class="col-sm-10">
<vc:create path="property/floorSelect2" parentModal="editOwnerRepairModel"
namespace="editOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属单元</label>
<div class="col-sm-10">
<vc:create path="property/unitSelect2" parentModal="editOwnerRepairModel"
callBackListener="editOwnerRepair" callBackFunction="notify2"
namespace="editOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">归属房屋</label>
<div class="col-sm-10">
<vc:create path="property/roomSelect2" parentModal="editOwnerRepairModel"
callBackListener="editOwnerRepair" callBackFunction="notify"
namespace="editOwnerRepair"></vc:create>
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">报修类型</label>
<div class="col-sm-10">
<select class="custom-select" v-model="editOwnerRepairInfo.repairType">
<option selected disabled value="">必填,请选择报修类型</option>
<option value="10001">卧室报修</option>
<option value="10002">管道报修</option>
<option value="10003">客厅报修</option>
<option v-for="(item,index) in editOwnerRepairInfo.repairSettings"
:value="item.repairType">{{item.repairTypeName}}</option>
</select></div>
</div>
<div class="form-group row">
@ -31,13 +53,6 @@
class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">房屋编号</label>
<div class="col-sm-10">
<input v-model="editOwnerRepairInfo.roomName" readonly type="text" placeholder="必填,请填写房屋编号"
class="form-control">
</div>
</div>
<div class="form-group row">
<label class="col-sm-2 col-form-label">预约时间</label>
<div class="col-sm-10">

View File

@ -1,120 +1,126 @@
(function(vc,vm){
(function (vc, vm) {
vc.extends({
data:{
editOwnerRepairInfo:{
repairId:'',
repairType:'',
repairName:'',
tel:'',
roomId:'',
roomName:'',
appointmentTime:'',
context:'',
data: {
editOwnerRepairInfo: {
repairId: '',
repairType: '',
repairName: '',
tel: '',
roomId: '',
roomName: '',
appointmentTime: '',
context: '',
repairSettings: []
}
},
_initMethod:function(){
vc.component._initEditOwnerRepairInfo();
},
_initEvent:function(){
vc.on('editOwnerRepair','openEditOwnerRepairModal',function(_params){
_initMethod: function () {
vc.component._initEditOwnerRepairInfo();
},
_initEvent: function () {
vc.on('editOwnerRepair', 'notify', function (_param) {
console.log('notify', _param);
if (_param.hasOwnProperty('roomId')) {
$that.editOwnerRepairInfo.roomId = _param.roomId;
}
});
vc.on('editOwnerRepair', 'openEditOwnerRepairModal', function (_params) {
vc.component.refreshEditOwnerRepairInfo();
$('#editOwnerRepairModel').modal('show');
vc.copyObject(_params, vc.component.editOwnerRepairInfo );
vc.copyObject(_params, vc.component.editOwnerRepairInfo);
vc.component.editOwnerRepairInfo.communityId = vc.getCurrentCommunity().communityId;
});
},
methods:{
editOwnerRepairValidate:function(){
return vc.validate.validate({
editOwnerRepairInfo:vc.component.editOwnerRepairInfo
},{
'editOwnerRepairInfo.repairType':[
methods: {
editOwnerRepairValidate: function () {
return vc.validate.validate({
editOwnerRepairInfo: vc.component.editOwnerRepairInfo
}, {
'editOwnerRepairInfo.repairType': [
{
limit:"required",
param:"",
errInfo:"报修类型不能为空"
limit: "required",
param: "",
errInfo: "报修类型不能为空"
},
{
limit:"maxin",
param:"2,50",
errInfo:"报修类型错误"
limit: "maxin",
param: "2,50",
errInfo: "报修类型错误"
},
],
'editOwnerRepairInfo.repairName':[
'editOwnerRepairInfo.repairName': [
{
limit:"required",
param:"",
errInfo:"报修人不能为空"
limit: "required",
param: "",
errInfo: "报修人不能为空"
},
{
limit:"maxin",
param:"2,50",
errInfo:"报修人名称必须在2至50字符之间"
{
limit: "maxin",
param: "2,50",
errInfo: "报修人名称必须在2至50字符之间"
},
],
'editOwnerRepairInfo.tel':[
{
limit:"required",
param:"",
errInfo:"联系方式不能为空"
'editOwnerRepairInfo.tel': [
{
limit: "required",
param: "",
errInfo: "联系方式不能为空"
},
{
limit:"phone",
param:"",
errInfo:"联系方式格式不正确"
{
limit: "phone",
param: "",
errInfo: "联系方式格式不正确"
},
],
'editOwnerRepairInfo.roomId':[
{
limit:"required",
param:"",
errInfo:"房屋ID不能为空"
'editOwnerRepairInfo.roomId': [
{
limit: "required",
param: "",
errInfo: "房屋ID不能为空"
},
{
limit:"num",
param:"",
errInfo:"房屋ID错误"
{
limit: "num",
param: "",
errInfo: "房屋ID错误"
},
],
'editOwnerRepairInfo.appointmentTime':[
{
limit:"required",
param:"",
errInfo:"预约时间不能为空"
'editOwnerRepairInfo.appointmentTime': [
{
limit: "required",
param: "",
errInfo: "预约时间不能为空"
},
{
limit:"dateTime",
param:"",
errInfo:"预约时间格式错误"
{
limit: "dateTime",
param: "",
errInfo: "预约时间格式错误"
},
],
'editOwnerRepairInfo.context':[
{
limit:"required",
param:"",
errInfo:"报修内容不能为空"
'editOwnerRepairInfo.context': [
{
limit: "required",
param: "",
errInfo: "报修内容不能为空"
},
{
limit:"maxLength",
param:"2000",
errInfo:"报修内容不能超过2000"
{
limit: "maxLength",
param: "2000",
errInfo: "报修内容不能超过2000"
},
],
'editOwnerRepairInfo.repairId':[
{
limit:"required",
param:"",
errInfo:"报修ID不能为空"
'editOwnerRepairInfo.repairId': [
{
limit: "required",
param: "",
errInfo: "报修ID不能为空"
}]
});
},
editOwnerRepair:function(){
if(!vc.component.editOwnerRepairValidate()){
});
},
editOwnerRepair: function () {
if (!vc.component.editOwnerRepairValidate()) {
vc.toast(vc.validate.errInfo);
return ;
return;
}
vc.component.editOwnerRepairInfo.communityId = vc.getCurrentCommunity().communityId;
@ -123,57 +129,80 @@
'update',
JSON.stringify(vc.component.editOwnerRepairInfo),
{
emulateJSON:true
},
function(json,res){
emulateJSON: true
},
function (json, res) {
//vm.menus = vm.refreshMenuActive(JSON.parse(json),0);
if(res.status == 200){
if (res.status == 200) {
//关闭model
$('#editOwnerRepairModel').modal('hide');
vc.emit('ownerRepairManage','listOwnerRepair',{});
return ;
vc.emit('ownerRepairManage', 'listOwnerRepair', {});
return;
}
vc.toast(json);
},
function(errInfo,error){
},
function (errInfo, error) {
console.log('请求失败处理');
vc.toast(errInfo);
});
});
},
refreshEditOwnerRepairInfo:function(){
vc.component.editOwnerRepairInfo= {
repairId:'',
repairType:'',
repairName:'',
tel:'',
roomId:'',
roomName:'',
appointmentTime:'',
context:'',
refreshEditOwnerRepairInfo: function () {
vc.component.editOwnerRepairInfo = {
repairId: '',
repairType: '',
repairName: '',
tel: '',
roomId: '',
roomName: '',
appointmentTime: '',
context: '',
}
},
_initEditOwnerRepairInfo:function(){
//vc.component.editOwnerRepairInfo.startTime = vc.dateFormat(new Date().getTime());
$('.editAppointmentTime').datetimepicker({
language: 'zh-CN',
fontAwesome: 'fa',
format: 'yyyy-mm-dd hh:ii:ss',
initTime: true,
initialDate: new Date(),
autoClose: 1,
todayBtn: true
_initEditOwnerRepairInfo: function () {
//vc.component.editOwnerRepairInfo.startTime = vc.dateFormat(new Date().getTime());
$('.editAppointmentTime').datetimepicker({
language: 'zh-CN',
fontAwesome: 'fa',
format: 'yyyy-mm-dd hh:ii:ss',
initTime: true,
initialDate: new Date(),
autoClose: 1,
todayBtn: true
});
$('.editAppointmentTime').datetimepicker()
.on('changeDate', function (ev) {
var value = $(".editAppointmentTime").val();
vc.component.editOwnerRepairInfo.appointmentTime = value;
});
$('.editAppointmentTime').datetimepicker()
.on('changeDate', function (ev) {
var value = $(".editAppointmentTime").val();
vc.component.editOwnerRepairInfo.appointmentTime = value;
});
//加载报修类型
$that._listEditRepairSettings(1, 50);
},
_listEditRepairSettings: function (_page, _rows) {
var param = {
params: {
page: _page,
row: _rows,
communityId: vc.getCurrentCommunity().communityId
}
};
//发送get请求
vc.http.apiGet('repair.listRepairSettings',
param,
function (json, res) {
var _repairSettingManageInfo = JSON.parse(json);
vc.component.editOwnerRepairInfo.repairSettings = _repairSettingManageInfo.data;
}, function (errInfo, error) {
console.log('请求失败处理');
}
);
}
}
});
})(window.vc,window.vc.component);
})(window.vc, window.vc.component);

View File

@ -16,6 +16,7 @@
floorSelect2Info: {
deep: true,
handler: function () {
vc.emit($namespace,'unitSelect2', 'clearUnit',{});
vc.emit($namespace, 'unitSelect2', "transferFloor", this.floorSelect2Info);
}
}

View File

@ -33,6 +33,7 @@
})*/
vc.on('roomSelect2', "transferRoom", function (_param) {
vc.copyObject(_param, this.roomSelect2Info);
this._initRoomSelect2();
});
vc.on('roomSelect2', 'setRoom', function (_param) {
vc.copyObject(_param, this.roomSelect2Info);

View File

@ -21,6 +21,7 @@
handler: function () {
vc.emit($props.callBackListener, $props.callBackFunction, this.unitSelect2Info);
console.log('是否执行 watch', $props.callBackListener, $props.callBackFunction, this.unitSelect2Info);
vc.emit($namespace,'roomSelect2', 'clearRoom',{});
vc.emit($namespace, 'roomSelect2', "transferRoom", this.unitSelect2Info);
}
}
@ -35,6 +36,7 @@
})*/
vc.on('unitSelect2', "transferFloor", function (_param) {
vc.copyObject(_param, this.unitSelect2Info);
this._initUnitSelect2();
});
vc.on('unitSelect2', 'setUnit', function (_param) {
vc.copyObject(_param, this.unitSelect2Info);