背景

• 項目中使用增值稅稅率, 需求原本是統一的指定稅率, 譬如3% 5% 等固定的. 隨著業務增加, 發現不同業務有不同的稅率, 一會加一個, 一下要改很多個界面. 就想著放到統一的地方.

技術背景

• 界面主要使用 Ext.NET方式構建, 引用js文件方式.

代碼實現

/// 定義一個Combobox 待會要使用的靜態數據源 base.js
var VTaxRatioCMB = Ext.create('Ext.data.Store', {
    id: 'VTaxRatioCMB',
    fields: ['value', 'name'],
    data : [
        {"value":0, "name":"0"},
        {"value":0.03, "name":"3%"},
        {"value":0.05, "name":"5%"},
        {"value":0.06,"name":"6%"}, 
        {"value":0.085, "name":"8.5%"},
        {"value":0.11, "name":"11%"},
        {"value":0.13, "name":"13%"},
        {"value":0.17, "name":"17%"}
     ]
  });

//使用到的界面引入上面js文件后, 使用. 測試加載都沒有問題.

<ext:ComboBox ID="TaxRatio"  StoreID="VTaxRatioCMB" AutoDataBind="true" ValueField="value"  DisplayField="name" runat="server" FieldLabel="稅率/征收率" Editable="false" LabelAlign="Right" AnchorHorizontal="90%" EmptyText="" TabIndex="24" IndicatorText="*" IndicatorCls="Indicator" AllowBlank="false">
                   <CustomConfig>
                   <ext:ConfigItem Name="tooltip" Value="稅率/征收率" />
                   </CustomConfig>
                   <Listeners>
                       <Select Handler="
                        ">
                     </Select>
                 </Listeners>
                   </ext:ComboBox>

題外話

• 界面表單加載 combobox時原本通過如下方式加載, 這種定義store方式 賦值combobox 不影響對應邏輯. 需要注意值類型

var initComboxByValue = function (comb) {
            var value = comb.getValue();
            // 此處value定義的類型需要為Int類型, 不然無法匹配類型

            var record = comb.findRecordByValue(value);
            if (record) {
            comb.setSelectedItems(record);
            } else {
            comb.setValue('');
            }
            
        }
/處理combox數據
        var combs = App.ValueAddedTaxPanel.queryBy(function (item) {
            return item.getXType() == 'combobox';
        });
        Ext.Array.each(combs, function (item) {
            initComboxByValue(item);
        });