视图样式自定义

o2web/source/x_component_cms_QueryViewDesigner/$View/view.html

@@ -235,19 +235,19 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -257,20 +257,27 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'block');}"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'none');}" checked/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
+                            }"/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
+                            }" checked/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.id}viewFilterRestrict" style="display: none" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -284,10 +291,10 @@
                     <tr>
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <input type="text" class="editTableInput valueTextInput" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
+                            <select class="valueBooleanInput" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -295,11 +302,11 @@
                     </tr>
                 </table>
             </div>
-            <div></div>
+            <div class="actionAreaNode"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_portal_PageDesigner/Module/View/view.html

@@ -123,19 +123,19 @@
 
 		<div style="background-color: #eeeeee; border-top:1px solid #999999; height: 24px; line-height: 24px; text-align: center; cursor:pointer">过滤</div>
 		<div class="MWFViewFilter">
-			<div>
-				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<div class="inputAreaNode">
+				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
 					<tr style="display:none">
 						<td class="editTableTitle">标题:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">路径:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">数据类型:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="datatypeInput">
 							<option value="textValue" selected>文本</option>
 							<option value="numberValue">数字</option>
 							<option value="dateTimeValue">日期</option>
@@ -145,20 +145,23 @@
 					<tr style="display:none">
 						<td class="editTableTitle"></td>
 						<td class="editTableValue">
-							<input type="radio" value="restrict" name="text{$.pid}viewFilterType" checked/>作为默认过滤条件<br>
-							<input type="radio" value="custom" name="text{$.pid}viewFilterType"/>作为自定义过滤数据
+							<input type="radio" class="restrictFilterInput" value="restrict" name="text{$.pid}viewFilterType" checked/>作为默认过滤条件<br>
+							<input type="radio" class="customFilterInput" value="custom" name="text{$.pid}viewFilterType"/>作为自定义过滤数据
 						</td>
 					</tr>
 				</table>
 				<table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
 					<tr>
 						<td class="editTableTitle">逻辑:</td>
-						<td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+						<td class="editTableValue"><select class="logicInput">
+							<option selected value="and">并且(and)</option>
+							<option value="or">或者(or)</option>
+						</select></td>
 					</tr>
 
 					<tr>
 						<td class="editTableTitle">比较:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="comparisonInput">
 							<option value="equals" selected>等于(==)</option>
 							<option value="notEquals">不等于(!=)</option>
 							<option value="greaterThan">大于(>)</option>
@@ -173,12 +176,12 @@
 					<tr style="display:none">
 						<td class="editTableTitle">值:</td>
 						<td class="editTableValue">
-							<input type="text" class="editTableInput" style="display: block"/>
-							<input type="number" class="editTableInput" style="display: none"/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueTextInput" style="display: block"/>
+							<input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+							<input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<select style="display: none">
+							<select class="valueBooleanInput" style="display: none">
 								<option value="true" selected>是(True)</option>
 								<option value="false">否(False)</option>
 							</select>
@@ -187,11 +190,11 @@
 				</table>
 				<div title="值" class="MWFFilterFormulaArea"></div>
 			</div>
-			<div></div>
+			<div class="actionAreaNode"></div>
 			<div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-			<div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 			<div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-			<div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="fieldListAreaNode" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 		</div>
 
 	</div>

o2web/source/x_component_process_FormDesigner/Module/View/view.html

@@ -184,19 +184,19 @@
 
 		<div style="background-color: #eeeeee; border-top:1px solid #999999; height: 24px; line-height: 24px; text-align: center; cursor:pointer">过滤</div>
 		<div class="MWFViewFilter">
-			<div>
-				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+			<div class="inputAreaNode">
+				<table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
 					<tr style="display:none">
 						<td class="editTableTitle">标题:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">路径:</td>
-						<td class="editTableValue"><input type="text" class="editTableInput"/></td>
+						<td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
 					</tr>
 					<tr>
 						<td class="editTableTitle">数据类型:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="datatypeInput">
 							<option value="textValue" selected>文本</option>
 							<option value="numberValue">数字</option>
 							<option value="dateTimeValue">日期</option>
@@ -206,20 +206,23 @@
 					<tr style="display:none">
 						<td class="editTableTitle"></td>
 						<td class="editTableValue">
-							<input type="radio" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
-							<input type="radio" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
+							<input type="radio" class="restrictFilterInput" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
+							<input type="radio" class="customFilterInput" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
 						</td>
 					</tr>
 				</table>
 				<table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
 					<tr>
 						<td class="editTableTitle">逻辑:</td>
-						<td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+						<td class="editTableValue"><select class="logicInput">
+							<option selected value="and">并且(and)</option>
+							<option value="or">或者(or)</option>
+						</select></td>
 					</tr>
 
 					<tr>
 						<td class="editTableTitle">比较:</td>
-						<td class="editTableValue"><select>
+						<td class="editTableValue"><select class="comparisonInput">
 							<option value="equals" selected>等于(==)</option>
 							<option value="notEquals">不等于(!=)</option>
 							<option value="greaterThan">大于(>)</option>
@@ -234,12 +237,12 @@
 					<tr style="display:none">
 						<td class="editTableTitle">值:</td>
 						<td class="editTableValue">
-							<input type="text" class="editTableInput" style="display: block"/>
-							<input type="number" class="editTableInput" style="display: none"/>
-							<input type="text" class="editTableInput" style="display: none" readonly/>
+							<input type="text" class="editTableInput valueTextInput" style="display: block"/>
+							<input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+							<input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
-							<select style="display: none">
+							<select class="valueBooleanInput" style="display: none">
 								<option value="true" selected>是(True)</option>
 								<option value="false">否(False)</option>
 							</select>
@@ -248,11 +251,11 @@
 				</table>
 				<div title="值" class="MWFFilterFormulaArea"></div>
 			</div>
-			<div></div>
+			<div class="actionAreaNode"></div>
 			<div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-			<div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 			<div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-			<div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+			<div class="fieldListAreaNode" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
 		</div>
 
 	</div>

o2web/source/x_component_process_FormDesigner/Module/ViewSelector/ViewSelector.html

@@ -110,19 +110,19 @@
 	</div>
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
                     <tr style="display:none">
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -132,20 +132,23 @@
                     <tr style="display:none">
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput" value="restrict" name="text{$.id}viewFilterType" checked/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput" value="custom" name="text{$.id}viewFilterType"/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.pid}viewFilterRestrict" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -160,12 +163,12 @@
                     <tr style="display:none">
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
+                            <input type="text" class="editTableInput valueTextInput" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
 							<input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <select class="valueBooleanInput" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -174,11 +177,11 @@
                 </table>
                 <div title="值" class="MWFFilterFormulaArea"></div>
             </div>
-            <div></div>
+            <div class="actionAreaNode"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="display:none; height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode" style="display:none; min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_process_ViewDesigner/$View/view.html

@@ -254,19 +254,19 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="datatypeInput">
                             <option value="textValue" selected>文本</option>
                             <option value="numberValue">数字</option>
                             <option value="dateTimeValue">日期</option>
@@ -276,20 +276,27 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'block');}"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){ $('text{$.id}viewFilterRestrict').setStyle('display', 'none');}" checked/>作为自定义过滤数据
+                            <input type="radio" class="restrictFilterInput" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
+                            }"/>作为默认过滤条件<br>
+                            <input type="radio" class="customFilterInput" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                                $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
+                            }" checked/>作为自定义过滤数据
                         </td>
                     </tr>
                 </table>
                 <table id="text{$.id}viewFilterRestrict" style="display: none" width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                     <tr>
                         <td class="editTableTitle">逻辑:</td>
-                        <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                        <td class="editTableValue"><select class="logicInput">
+                            <option selected value="and">并且(and)</option>
+                            <option value="or">或者(or)</option>
+                        </select></td>
                     </tr>
 
                     <tr>
                         <td class="editTableTitle">比较:</td>
-                        <td class="editTableValue"><select>
+                        <td class="editTableValue"><select class="comparisonInput">
                             <option value="equals" selected>等于(==)</option>
                             <option value="notEquals">不等于(!=)</option>
                             <option value="greaterThan">大于(>)</option>
@@ -303,10 +310,10 @@
                     <tr>
                         <td class="editTableTitle">值:</td>
                         <td class="editTableValue">
-                            <input type="text" class="editTableInput" style="display: block"/>
-                            <input type="number" class="editTableInput" style="display: none"/>
-                            <input type="text" class="editTableInput" style="display: none" readonly/>
-                            <select style="display: none">
+                            <input type="text" class="editTableInput valueTextInput" style="display: block"/>
+                            <input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+                            <input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
+                            <select class="valueBooleanInput" style="display: none">
                                 <option value="true" selected>是(True)</option>
                                 <option value="false">否(False)</option>
                             </select>
@@ -314,11 +321,11 @@
                     </tr>
                 </table>
             </div>
-            <div></div>
+            <div class="actionAreaNode"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>
 

o2web/source/x_component_process_ViewDesigner/widget/ViewFilter.js

@@ -67,34 +67,32 @@ MWF.xApplication.process.ViewDesigner.widget.ViewFilter = new Class({
     },
 
     getInputNodes: function(){
-        this.inputAreaNode = this.node.getFirst("div");
-        this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
-        this.listAreaNode = this.actionAreaNode.getNext().getNext();
-        this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
-        this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
+        this.inputAreaNode = this.node.getElement(".inputAreaNode");
+        this.actionAreaNode = this.node.getElement(".actionAreaNode");
+        this.actionAreaNode.setStyles( this.css.actionAreaNode );
+        this.listAreaNode = this.node.getElement(".listAreaNode");
+        this.fieldListAreaNode = this.node.getElement(".fieldListAreaNode");
 
-        var selects = this.inputAreaNode.getElements("select");
-        var inputs = this.inputAreaNode.getElements("input");
+        this.restrictViewFilterTable = this.node.getElement(".restrictViewFilterTable");
 
         var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
         if (scriptValueArea){
             this.createScriptArea(scriptValueArea);
         }
 
+        this.titleInput = this.inputAreaNode.getElement(".titleInput");
+        this.pathInput = this.inputAreaNode.getElement(".pathInput");
+        this.datatypeInput = this.inputAreaNode.getElement(".datatypeInput");
 
-        this.titleInput = inputs[0];
-        this.pathInput = inputs[1];
-        this.datatypeInput = selects[0];
+        this.restrictFilterInput = this.inputAreaNode.getElement(".restrictFilterInput");
+        this.customFilterInput = this.inputAreaNode.getElement(".customFilterInput");
 
-        this.restrictFilterInput = inputs[2];
-        this.customFilterInput = inputs[3];
-
-        this.logicInput = selects[1];
-        this.comparisonInput = selects[2];
-        this.valueTextInput = inputs[4];
-        this.valueNumberInput = inputs[5];
-        this.valueDatetimeInput = inputs[6];
-        this.valueBooleanInput = selects[3];
+        this.logicInput = this.inputAreaNode.getElement(".logicInput");
+        this.comparisonInput = this.inputAreaNode.getElement(".comparisonInput");
+        this.valueTextInput = this.inputAreaNode.getElement(".valueTextInput");
+        this.valueNumberInput = this.inputAreaNode.getElement(".valueNumberInput");
+        this.valueDatetimeInput = this.inputAreaNode.getElement(".valueDatetimeInput");
+        this.valueBooleanInput = this.inputAreaNode.getElement(".valueBooleanInput");
 
         MWF.require("MWF.widget.Calendar", function(){
             this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput, {
@@ -117,6 +115,58 @@ MWF.xApplication.process.ViewDesigner.widget.ViewFilter = new Class({
             if (e.code==13) this.modifyOrAddFilterItem();
         }.bind(this));
     },
+
+    // getInputNodes: function(){
+    //     this.inputAreaNode = this.node.getFirst("div");
+    //     this.actionAreaNode = this.inputAreaNode.getNext().setStyles(this.css.actionAreaNode);
+    //     this.listAreaNode = this.actionAreaNode.getNext().getNext();
+    //     this.fieldListAreaNode = this.listAreaNode.getNext().getNext();
+    //     this.restrictViewFilterTable = this.inputAreaNode.getLast("table");
+    //
+    //     var selects = this.inputAreaNode.getElements("select");
+    //     var inputs = this.inputAreaNode.getElements("input");
+    //
+    //     var scriptValueArea = this.node.getElement(".MWFFilterFormulaArea");
+    //     if (scriptValueArea){
+    //         this.createScriptArea(scriptValueArea);
+    //     }
+    //
+    //
+    //     this.titleInput = inputs[0];
+    //     this.pathInput = inputs[1];
+    //     this.datatypeInput = selects[0];
+    //
+    //     this.restrictFilterInput = inputs[2];
+    //     this.customFilterInput = inputs[3];
+    //
+    //     this.logicInput = selects[1];
+    //     this.comparisonInput = selects[2];
+    //     this.valueTextInput = inputs[4];
+    //     this.valueNumberInput = inputs[5];
+    //     this.valueDatetimeInput = inputs[6];
+    //     this.valueBooleanInput = selects[3];
+    //
+    //     MWF.require("MWF.widget.Calendar", function(){
+    //         this.calendar = new MWF.widget.Calendar(this.valueDatetimeInput, {
+    //             "style": "xform",
+    //             "isTime": true,
+    //             "secondEnable" : true,
+    //             "target": this.app.content,
+    //             "format": "db"
+    //         });
+    //     }.bind(this));
+    //
+    //     this.datatypeInput.addEvent("change", function(){
+    //         this.changeValueInput();
+    //     }.bind(this));
+    //
+    //     this.valueTextInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    //     this.valueNumberInput.addEvent("keydown", function(e){
+    //         if (e.code==13) this.modifyOrAddFilterItem();
+    //     }.bind(this));
+    // },
     changeValueInput: function(){
         var type = this.datatypeInput.options[this.datatypeInput.selectedIndex].value;
         switch (type){

o2web/source/x_component_query_ViewDesigner/$View/view.html

@@ -411,19 +411,19 @@
 
     <div title="过滤"  class="MWFTab">
         <div class="MWFViewFilter">
-            <div>
-                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
+            <div class="inputAreaNode">
+                <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable restrictViewFilterTable">
                     <tr>
                         <td class="editTableTitle">标题:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput titleInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">路径:</td>
-                        <td class="editTableValue"><input type="text" class="editTableInput"/></td>
+                        <td class="editTableValue"><input type="text" class="editTableInput pathInput"/></td>
                     </tr>
                     <tr>
                         <td class="editTableTitle">数据类型:</td>
-                        <td class="editTableValue"><select
+                        <td class="editTableValue"><select class="datatypeInput"
                                 onchange="if (this.selectedIndex==2){
                                     $('text{$.id}viewFilterDateFormulaSelector').setStyle('display', 'block');
                                     $('text{$.id}viewFilterDateFormulaSelector2').setStyle('display', 'block');
@@ -472,11 +472,11 @@
                     <tr>
                         <td class="editTableTitle"></td>
                         <td class="editTableValue">
-                            <input type="radio" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                            <input type="radio" class="restrictFilterInput" value="restrict" name="text{$.id}viewFilterType" onclick="if (this.checked){
                                 $('text{$.id}viewFilterRestrict').setStyle('display', 'block');
                                 $('text{$.id}viewCustomFilterRestrict').setStyle('display', 'none');
                             }"/>作为默认过滤条件<br>
-                            <input type="radio" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
+                            <input type="radio" class="customFilterInput" value="custom" name="text{$.id}viewFilterType" onclick="if (this.checked){
                                 $('text{$.id}viewFilterRestrict').setStyle('display', 'none');
                                 $('text{$.id}viewCustomFilterRestrict').setStyle('display', 'block');
                             }" checked/>作为自定义过滤数据
@@ -487,12 +487,22 @@
                     <table width="100%" border="0" cellpadding="5" cellspacing="0" class="editTable">
                         <tr>
                             <td class="editTableTitle">逻辑:</td>
-                            <td class="editTableValue"><select><option selected value="and">并且(and)</option><option value="or">或者(or)</option></select></td>
+                            <td class="editTableValue"><select class="logicInput">
+                                <option selected value="and">并且(and)</option>
+                                <option value="or">或者(or)</option>
+                            </select></td>
                         </tr>
 
                         <tr>
                             <td class="editTableTitle">比较:</td>
-                            <td class="editTableValue"><select onchange="if (this.selectedIndex==8){$('text{$.id}viewFilterValue2Area').setStyle('display', 'block'); $('text{$.id}viewFilterValueTitleArea').set('text', '从');}else{$('text{$.id}viewFilterValue2Area').setStyle('display', 'none'); $('text{$.id}viewFilterValueTitleArea').set('text', '值');}">
+                            <td class="editTableValue"><select class="comparisonInput" onchange="
+                                if (this.selectedIndex==8){
+                                    $('text{$.id}viewFilterValue2Area').setStyle('display', 'block');
+                                    $('text{$.id}viewFilterValueTitleArea').set('text', '从');
+                                }else{
+                                    $('text{$.id}viewFilterValue2Area').setStyle('display', 'none');
+                                    $('text{$.id}viewFilterValueTitleArea').set('text', '值');
+                                }">
                                 <option value="equals" selected>等于(==)</option>
                                 <option value="notEquals">不等于(!=)</option>
                                 <option value="greaterThan">大于(>)</option>
@@ -507,12 +517,12 @@
                         <tr>
                             <td class="editTableTitle" id="text{$.id}viewFilterValueTitleArea">值:</td>
                             <td class="editTableValue" id="text{$.id}viewFilterValueArea">
-                                <input type="text" class="editTableInput" style="display: block" onkeypress="$('text{$.id}viewFilterTextFormulaSelector').getElements('input').set('checked', false)"/>
-                                <input type="number" class="editTableInput" style="display: none"/>
-                                <input type="text" class="editTableInput" style="display: none" readonly/>
+                                <input type="text" class="editTableInput valueTextInput" style="display: block" onkeypress="$('text{$.id}viewFilterTextFormulaSelector').getElements('input').set('checked', false)"/>
+                                <input type="number" class="editTableInput valueNumberInput" style="display: none"/>
+                                <input type="text" class="editTableInput valueDatetimeInput" style="display: none" readonly/>
                                 <input type="text" class="editTableInput" style="display: none" readonly/>
                                 <input type="text" class="editTableInput" style="display: none" readonly/>
-                                <select style="display: none">
+                                <select class="valueBooleanInput" style="display: none">
                                     <option value="true" selected>是(True)</option>
                                     <option value="false">否(False)</option>
                                 </select>
@@ -669,11 +679,11 @@
                     </div>
                 </div>
             </div>
-            <div></div>
+            <div class="actionAreaNode"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">默认过滤条件</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="listAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
             <div style="height: 20px; line-height: 20px; text-align:center; background-color: #eeeeee">自定义过滤数据</div>
-            <div style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
+            <div class="fieldListAreaNode" style="min-height: 56px; border-bottom:1px solid #CCCCCC; overflow: hidden;"></div>
         </div>
     </div>