sange-bridge/pages/formula/anytriangle.vue

<template>
    <view class="math-container">
        <view class="header">
            <u-image width="100%" height="300rpx" :src="mathImgs[name].big" mode="aspectFit" @click="handleBigImage"></u-image>
        </view>
        <view class="main dir-top-wrap cross-center">
            <view class="form">
                <u-form-item label="边长a" label-width="160">
                    <u-input type="number" v-model="formData.lengtha" :placeholder="lengthAInput.placeholder" :disabled="lengthAInput.disabled"/>
                </u-form-item>
                <u-form-item label="边长b" label-width="160">
                    <u-input type="number" v-model="formData.lengthb" :placeholder="lengthBInput.placeholder" :disabled="lengthBInput.disabled"/>
                </u-form-item>
                <u-form-item label="边长c" label-width="160">
                    <u-input type="number" v-model="formData.lengthc" :placeholder="lengthCInput.placeholder" :disabled="lengthCInput.disabled"/>
                </u-form-item>
                <u-form-item label="角度A" label-width="160">
                    <u-input type="number" v-model="formData.anglea" :placeholder="angleAInput.placeholder" :disabled="angleAInput.disabled"/>
                </u-form-item>
                <u-form-item label="角度B" label-width="160">
                    <u-input type="number" v-model="formData.angleb" :placeholder="angleBInput.placeholder" :disabled="angleBInput.disabled"/>
                </u-form-item>
                <u-form-item label="角度C" label-width="160">
                    <u-input type="number" v-model="formData.anglec" :placeholder="angleCInput.placeholder" :disabled="angleCInput.disabled"/>
                </u-form-item>
            </view>
            <view class="btn-group main-left cross-center">
                <u-button :ripple="true" @click="handelCalc" :custom-style="{backgroundColor: $u.color['mainBgColor'],color:'#ffffff',width: '260rpx',marginRight:'30rpx'}">计算</u-button>
                <u-button :ripple="true" @click="handleClear">清空</u-button>
            </view>
        </view>
        <div class="footer">
            <view class="result dir-top-wrap cross-center" v-if="showResult">
                <view v-for="item in rules" v-if="item.value && item.show">
                    <text>{{item.name}}=</text>{{item.value}}{{item.unit}}
                </view>
            </view>
        </div>
    </view>
</template>

<script>
    import mathImgs from "@/core/math-imgs"
    // 万能公式
    export default {
        data() {
            return {
                name: 'anytriangle',
                mathImgs: mathImgs,
                formData: {
                    lengtha: '',
                    lengthb: '',
                    lengthc: '',
                    anglea: '',
                    angleb: '',
                    anglec: '',
                },
                // 用来验证 输入
                rules: {
                    lengtha: {name:'a', value:'',unit:'cm',show: true},
                    lengthb:{name:'b', value:'',unit:'cm',show: true},
                    lengthc: {name:'c', value:'',unit:'cm',show: true},
                    anglea:{name:'角度A', value:'',unit:'°',show: true},
                    angleb:{name:'角度B', value:'',unit:'°',show: true},
                    anglec:{name:'角度C', value:'',unit:'°',show: true},
                }
            }
        },
        methods: {
            handleBigImage(){
                uni.previewImage({
                    urls: [mathImgs[this.name].big],
                });
            },
            handelCalc(){
                this.initRules();
                let validate = [];
                for (const itemKey in this.formData) {
                    validate.push(this.formData[itemKey]);
                }

                let lengtha = 0;
                let lengthb = 0;
                let lengthc = 0;
                let anglea = 0;
                let angleb = 0;
                let anglec = 0;

                lengtha = parseFloat( this.formData.lengtha)?parseFloat(this.formData.lengtha):0;
                lengthb = parseFloat(this.formData.lengthb)?parseFloat(this.formData.lengthb):0;
                lengthc = parseFloat(this.formData.lengthc)?parseFloat(this.formData.lengthc):0;
                anglea = parseFloat(this.formData.anglea)?parseFloat(this.formData.anglea):0;
                angleb = parseFloat(this.formData.angleb)?parseFloat(this.formData.angleb):0;
                anglec = parseFloat(this.formData.anglec)?parseFloat(this.formData.anglec):0;

                if(anglea && anglea > 180){
                    this.$u.toast('角度A不能大于180');
                    return;
                }

                if(angleb && angleb > 180){
                    this.$u.toast('角度B不能大于180');
                    return;
                }

                if(anglec && anglec > 180){
                    this.$u.toast('角度C不能大于180');
                    return;
                }

                if((anglea + angleb + anglec) > 180){
                    this.$u.toast('内角之和不能大于180');
                    return;
                }

                if(!this.$util.checkArrayNotNullNumber(validate,3)){
                    this.$u.toast('至少输入三个参数');
                    return;
                }


                /**1、 已知a、b、c
                 * cosA=（b²+c²-a²）÷（2bc）
                 * cosB=（a²+c²-b²）÷（2ac）
                 * cosC =（a²+b²-c²）÷（2ab）
                 */

                if(lengtha && lengthb && lengthc){
                    if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                        this.$u.toast('两边之后要大于第三边');
                        return;
                    }
                    anglea = this.$util.acos((Math.pow(lengthb,2) + Math.pow(lengthc,2) - Math.pow(lengtha,2)) / (2 * lengthb * lengthc))
                    angleb = this.$util.acos((Math.pow(lengtha,2) + Math.pow(lengthc,2) - Math.pow(lengthb,2)) / (2 * lengtha * lengthc))
                    anglec = this.$util.acos((Math.pow(lengtha,2) + Math.pow(lengthb,2) - Math.pow(lengthc,2)) / (2 * lengtha * lengthb))
                }
                /**	2、 已知a、b、A（a、b、B；a、c、A；a、c、C；b、c、B；b、c、C）：
                 * sinB=（b×sinA）÷a
                 * c：a²=b²+c²-2bccosA
                 * sinC=（c×sinA）÷a
                 *
                 */
                else if(lengtha && lengthb){
                    //let c1 = ((2 * b * Math.cos(A)) + Math.sqrt(Math.pow(2 * b * Math.cos(A), 2) - 4 * (Math.pow(b, 2) - Math.pow(a, 2)))) / 2
                    if(anglea){
                        angleb = this.$util.asin((lengthb * this.$util.sin(anglea)) / lengtha)
                        lengthc = ((2 * lengthb * this.$util.cos(anglea)) + Math.sqrt(Math.pow(2 * lengthb * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthb, 2) - Math.pow(lengtha, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengthc = ((2 * lengthb * this.$util.cos(anglea)) - Math.sqrt(Math.pow(2 * lengthb * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthb, 2) - Math.pow(lengtha, 2)))) / 2
                        }
                        anglec = 180 - angleb - anglea
                    }else if(angleb){
                        anglea = this.$util.asin((lengtha * this.$util.sin(angleb)) / lengthb)
                        lengthc = ((2 * lengtha * this.$util.cos(angleb)) + Math.sqrt(Math.pow(2 * lengtha * this.$util.cos(angleb), 2) - 4 * (Math.pow(lengtha, 2) - Math.pow(lengthb, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengthc = ((2 * lengtha * this.$util.cos(angleb)) - Math.sqrt(Math.pow(2 * lengtha * this.$util.cos(angleb), 2) - 4 * (Math.pow(lengtha, 2) - Math.pow(lengthb, 2)))) / 2
                        }
                        anglec = 180 - angleb - anglea
                    }else if(anglec){
                        // sinA=（a×sinC）÷c
                        // c²=a²+b²-2ab cosC
                        lengthc = Math.sqrt(Math.pow(lengtha, 2) + Math.pow(lengthb, 2) - 2 * lengtha * lengthb * this.$util.cos(anglec))
                        anglea = this.$util.asin((lengtha * this.$util.sin(anglec)) / lengthc)
                        angleb = 180 - anglec - anglea
                    }
                }else if(lengtha && lengthc){
                    if(anglea){
                        anglec = this.$util.asin((lengthc * this.$util.sin(anglea)) / lengtha)
                        lengthb = ((2 * lengthc * this.$util.cos(anglea)) + Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengtha, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengthb = ((2 * lengthc * this.$util.cos(anglea)) - Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengtha, 2)))) / 2
                        }
                        angleb = 180 - anglec - anglea
                    }else if(angleb){
                        // sinA=（a×sinB）÷b
                        // b²=a²+c²-2ac cosC
                        lengthb = Math.sqrt(Math.pow(lengtha, 2) + Math.pow(lengthc, 2) - 2 * lengtha * lengthc * this.$util.cos(angleb))
                        anglea = this.$util.asin((lengtha * this.$util.sin(angleb)) / lengthb)
                        anglec = 180 - anglea - angleb
                    }else if(anglec){
                        anglea = this.$util.asin((lengtha * this.$util.sin(anglec)) / lengthc)
                        lengthb = ((2 * lengthc * this.$util.cos(anglea)) + Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengtha, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengthb = ((2 * lengthc * this.$util.cos(anglea)) - Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(anglea), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengtha, 2)))) / 2
                        }
                        angleb = 180 - anglec - anglea
                    }
                }else if(lengthb && lengthc){
                    if(anglea){
                        lengtha = Math.sqrt(Math.pow(lengthb, 2) + Math.pow(lengthc, 2) - 2 * lengthb * lengthc * this.$util.cos(anglea))
                        angleb = this.$util.asin((lengthb * this.$util.sin(anglea)) / lengtha)
                        anglec = 180 - anglea - angleb
                    }else if(angleb){
                        // sinA=（a×sinC）÷c
                        anglec = this.$util.asin((lengthc * this.$util.sin(angleb)) / lengthb)
                        lengtha = ((2 * lengthc * this.$util.cos(angleb)) + Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(angleb), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengthb, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengtha = ((2 * lengthc * this.$util.cos(angleb)) - Math.sqrt(Math.pow(2 * lengthc * this.$util.cos(angleb), 2) - 4 * (Math.pow(lengthc, 2) - Math.pow(lengthb, 2)))) / 2
                        }
                        anglea = 180 - angleb - anglec
                    }else if(anglec){
                        lengtha = ((2 * lengthb * this.$util.cos(anglec)) + Math.sqrt(Math.pow(2 * lengthb * this.$util.cos(anglec), 2) - 4 * (Math.pow(lengthb, 2) - Math.pow(lengthc, 2)))) / 2
                        if(!this.$util.checkTriangle(lengtha, lengthb, lengthc)){
                            lengtha = ((2 * lengthb * this.$util.cos(anglec)) - Math.sqrt(Math.pow(2 * lengthb * this.$util.cos(anglec), 2) - 4 * (Math.pow(lengthb, 2) - Math.pow(lengthc, 2)))) / 2
                        }
                        angleb = this.$util.asin((lengthb * this.$util.sin(anglec)) / lengthc)
                        anglea = 180 - anglec - angleb
                    }
                } else if(anglea && angleb){
                    anglec = 180 - anglea - angleb
                    if(lengtha){
                        lengthb = (lengtha * this.$util.sin(angleb)) / this.$util.sin(anglea)
                        lengthc = (lengtha * this.$util.sin(anglec)) / this.$util.sin(anglea)
                    }else if(lengthb){
                        lengtha = (lengthb * this.$util.sin(anglea)) / this.$util.sin(angleb)
                        lengthc = (lengthb * this.$util.sin(anglec)) / this.$util.sin(angleb)
                    }else if(lengthc){
                        lengtha = (lengthc * this.$util.sin(anglea)) / this.$util.sin(anglec)
                        lengthb = (lengthc * this.$util.sin(angleb)) / this.$util.sin(anglec)
                    }
                }else if(anglea && anglec){
                    angleb = 180 - anglea - anglec
                    if(lengtha){
                        lengthb = (lengtha * this.$util.sin(angleb)) / this.$util.sin(anglea)
                        lengthc = (lengtha * this.$util.sin(anglec)) / this.$util.sin(anglea)
                    }else if(lengthb){
                        lengtha = (lengthb * this.$util.sin(anglea)) / this.$util.sin(angleb)
                        lengthc = (lengthb * this.$util.sin(anglec)) / this.$util.sin(angleb)
                    }else if(lengthc){
                        lengtha = (lengthc * this.$util.sin(anglea)) / this.$util.sin(anglec)
                        lengthb = (lengthc * this.$util.sin(angleb)) / this.$util.sin(anglec)
                    }
                }else if(angleb && anglec){
                    anglea = 180 - angleb - anglec
                    if(lengtha){
                        lengthb = (lengtha * this.$util.sin(angleb)) / this.$util.sin(anglea)
                        lengthc = (lengtha * this.$util.sin(anglec)) / this.$util.sin(anglea)
                    }else if(lengthb){
                        lengtha = (lengthb * this.$util.sin(anglea)) / this.$util.sin(angleb)
                        lengthc = (lengthb * this.$util.sin(anglec)) / this.$util.sin(angleb)
                    }else if(lengthc){
                        lengtha = (lengthc * this.$util.sin(anglea)) / this.$util.sin(anglec)
                        lengthb = (lengthc * this.$util.sin(angleb)) / this.$util.sin(anglec)
                    }
                }


                this.rules.lengtha.value = lengtha;
                this.rules.lengthb.value = lengthb;
                this.rules.lengthc.value = lengthc;
                this.rules.anglea.value = anglea;
                this.rules.angleb.value = angleb;
                this.rules.anglec.value = anglec;
                this.roundRules()
            },
            roundRules(){
                for (const itemKey in this.rules) {
                    this.rules[itemKey].value = this.$util.round(this.rules[itemKey].value,2);
                }
            },
            initRules(){
                for (const itemKey in this.rules) {
                    this.rules[itemKey].value = "";
                }
            },
            getInputItem(item){
                let validate = [];
                let placeholder = `请输入${this.rules[item].name}`;
                let disabled = false;
                for (const itemKey in this.rules) {
                    if(item !== itemKey  && typeof this.formData[itemKey] !== "undefined")
                        validate.push(this.formData[itemKey]);
                }

                if(item.indexOf('angle') !== -1 && !this.$util.checkArrayNotNullNumber(validate,3)){
                    validate = [];
                    for (const itemKey in this.rules) {
                        if(itemKey.indexOf('angle') !== -1 && itemKey !== item && typeof this.formData[itemKey] !== "undefined"){
                            validate.push(this.formData[itemKey]);
                        }
                    }
                    if(this.$util.checkArrayNotNullNumber(validate)){
                        disabled = true;
                        placeholder = '无需输入';
                    }
                }else{
                    if(this.$util.checkArrayNotNullNumber(validate,3)){
                        disabled = true;
                        placeholder = '无需输入';
                    }
                }

                return {placeholder: placeholder,disabled:disabled};

            },
            handleClear() {
                this.initRules();
                this.formData = {
                    lengtha: '',
                    lengthb: '',
                    lengthc: '',
                    anglea: '',
                    angleb: '',
                    anglec: '',
                };
            }
        },
        computed:{
            lengthAInput(){
                return this.getInputItem('lengtha')
            },
            lengthBInput(){
                return this.getInputItem('lengthb')
            },
            lengthCInput(){
                return this.getInputItem('lengthc')
            },
            angleAInput(){
                return this.getInputItem('anglea')
            },
            angleBInput(){
                return this.getInputItem('angleb')
            },
            angleCInput(){
                return this.getInputItem('anglec')
            },
            showResult(){
                let validate = [];
                for (const itemKey in this.rules) {
                    validate.push(this.rules[itemKey].value);
                }
                return this.$util.checkArrayNotNullNumber(validate,3)
            }
        }
    }
</script>

<style lang="scss" scoped>
    @import "@/static/css/math.scss";
</style>