FeHelper/apps/toolkit/radix/index.html

<!-- 进制转换工具 -->
<div id="containerRadix">

    <div class="row x-tips ui-mt-10">
        // 这里的进制转换的原理比较简单，其实就一行代码 <br/>
        let radixConvert = (num, fromRadix, toRadix) => parseInt(num, fromRadix).toString(toRadix);
    </div>

    <div class="row mod-radios">
        <template v-for="item in fromArray">
            <input type="radio" name="from" :id="getId('from',item)" :value="item"
                   :checked="item===fromSelected" @click="radixRadioClicked(1,item)">
            <label :for="getId('from',item)">{{item}}进制</label>
        </template>

        <select class="form-control x-select" v-model="fromSelected" @change="radixConvert">
            <option v-for="n in 36" v-if="n>1" :value="n" >{{n}}进制</option>
        </select>
    </div>

    <div class="row ui-mt-10 mod-value">
        <label for="srcValue">原始数字：</label>
        <input type="text" id="srcValue" class="form-control x-input" maxlength="32" v-model="srcValue"
               @input="radixConvert" placeholder="number here...">
    </div>

    <div class="ui-mt-20">
        <span class="radix-tips">// 转换结果就在下面了</span>
    </div>

    <div class="row mod-radios ui-mt-20">
        <template v-for="item in toArray">
            <input type="radio" name="to" :id="getId('to',item)" :value="item"
                   :checked="item==toSelected" @click="radixRadioClicked(2,item)">
            <label :for="getId('to',item)">{{item}}进制</label>
        </template>

        <select class="form-control x-select" v-model="toSelected" @change="radixConvert">
            <option v-for="n in 36" v-if="n>1" :value="n">{{n}}进制</option>
        </select>
    </div>

    <div class="row ui-mt-10 mod-value">
        <label for="rstValue">结果数字：</label>
        <input type="text" id="rstValue" class="form-control x-input" v-model="rstValue" readonly>
    </div>
</div>