该页面有 ah:panelGrid,其中包含两个 h:panelGroup 预计将显示在同一行中。
并且额外的要求是left panelGroup应该是总宽度的30%,另外70%。
我尝试了几种方法来实现这一点,但都失败了......
<h:form id="form">
<h:panelGrid id="pricePanel" columns="2" style="width:100%;" columnClasses="columnClazz" rowClasses="rowClazz">
<h:panelGroup>
<p:dataTable scrollHeight="250" id="priceData" var="item" value="#{accumByCustomerViewModel.quoteInfo}"
scrollable="true" rowIndexVar="rowInfo" rowKey="#{item.brand_code}" selection="#{accumByCustomerViewModel.selectedBrand}" selectionMode="single">
<p:ajax event="rowSelect" listener="#{accumByCustomerViewModel.onRowSelect}"
update=":form:custGrid"/>
<p:columnGroup id="columnGroup" type="header">
<p:row>
<p:column id="goldHeader" rendered="true" headerText="积存金" colspan="4"/>
</p:row>
<p:row>
<p:column id="brandHeader" rendered="true" headerText="品牌"/>
<p:column id="quoteDateHeader" rendered="true" headerText="报价日期"/>
<p:column id="salePriceHeader" rendered="true" headerText="卖出价"/>
<p:column id="redeemPriceHeader" rendered="true" headerText="赎回价"/>
</p:row>
</p:columnGroup>
<p:column id="brand_code" rendered="true">
#{item.brand_name}
</p:column>
<p:column id="quote_date" rendered="true">
#{item.quote_date}
</p:column>
<p:column id="salePrice" rendered="true">
#{item.entity_sale_price}
</p:column>.
<p:column id="redeemPrice" rendered="true">
#{item.entity_redeem_price}
</p:column>
</p:dataTable>
</h:panelGroup>
<h:panelGroup id="custGrid">
<p:fieldset legend="客户信息" id="custFieldset">
<h:panelGrid columns="2">
<h:outputText value="银行账号:"/>
<p:inputText value="#{accumByCustomerViewModel.custInfo.bank_acc}" style="color:red;font-weight:bold;"/>
<h:outputText value="证件类型: "/>
<h:outputText value="#{accumByCustomerViewModel.custInfo.cert_type}" style="color:red;font-weight:bold;"/>
<h:outputText value="证件号码: "/>
<h:outputText value="#{accumByCustomerViewModel.custInfo.cert_no}" style="color:red;font-weight:bold;"/>
</h:panelGrid>
</p:fieldset>
<p:fieldset legend="品牌" id="brandFieldset">
<h:panelGrid columns="2">
<h:outputText value="品牌名称:"/>
<h:outputText value="#{accumByCustomerViewModel.selectedBrand.brand_name}" style="color:red;font-weight:bold;"/>
<h:outputText value="金额: "/>
<p:inputText value="#{accumByCustomerViewModel.selectedBrand.entity_sale_price}" style="color:red;font-weight:bold;"/>
</h:panelGrid>
</p:fieldset>
</h:panelGroup>
</h:panelGrid>
</h:form>