JSFiddle - React, Tailwind, and code Playground

HTML

<label style="display:none;" ><input type="radio" id="p1" name="type" onchange="calc(this.value);" value="1" checked="checked"></label>
	<div class="calc_sp">
  
  	<div class="block_sp_2">
	<input id="amount" onkeyup="calc(this.value);" class="calc_inp" value="50">
	</div>
  
	<div class="slider_sp block_sp_1">
	<div id="slider" class="ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all" aria-disabled="false">
	<div class="ui-slider-range ui-widget-header ui-corner-all ui-slider-range-min" style="width: 0%;"></div>
	</div>
	<div class="calc_sp_min-max">
	<font class="left">мин.</font><font class="left" id="mins">5</font>
	<font class="right" id="maxs">100</font><font class="right">мак.</font>
	<div class="clear"></div>
	</div>
	</div>


<div>
<div class="left" style="margin-top: 21px;margin-left:15px;">
<font id="num" style="display:none;"></font>		
</div>


	<p style="padding-top:1px; padding-bottom:20px;">
	от <font style=" font-family:Arial, Helvetica, sans-serif; font-size:36px; color:#1989ca;" id="summ">6900.00</font> руб.
    	до	<font style=" font-family:Arial, Helvetica, sans-serif; font-size:36px; color:#1989ca;" id="summ2">9290.00</font> руб.
		<span style=" font-family:Arial, Helvetica, sans-serif; font-size:16px; color:#9a9a9a;"></span>
	</p>
</div>



	<div class="clear"></div>
</div>


<div class="clear"></div>

CSS

* {margin: 0px;padding: 0px;}

.calc_inp {-moz-border-bottom-colors: none;-moz-border-image: none;-moz-border-left-colors: none;-moz-border-right-colors: none;-moz-border-top-colors: none;-moz-box-sizing: border-box;background: #FFFFFF;border-color: #bababa;-moz-border-radius: 3px;-webkit-border-radius: 3px;border-radius: 3px;border-style: solid;border-width: 1px;-webkit-box-shadow: 0px 1px 0px 0px #ffffff, inset 0px 1px 3px 0px #d6d7d7 ;-moz-box-shadow: 0px 1px 0px 0px #ffffff, inset 0px 1px 3px 0px #d6d7d7 ;box-shadow: 0px 1px 0px 0px #ffffff, inset 0px 1px 3px 0px #d6d7d7 ;display: block;text-align:center;width:50px;height:35px;line-height:35px;font-family: 'Open Sans', sans-serif;color:#000000;font-size:16px;}
#slider{border-radius: 2px;width: 390px;position: absolute;height: 2px;background-color: #8e8d8d;background: #9a9a9a;box-shadow: inset 0 1px 2px 0px rgba(0, 0, 0, .5),0 1px 0 0px rgba(250, 250, 250, .5);left: 5px;}
.ui-slider-handle {position: absolute;z-index: 2;width: 10px;height: 10px;cursor: pointer;outline: none;top: -6px;margin-left: -12px;}
.ui-slider-range {background: #0A95CA;position: absolute;border: 0;top: 0;height: 100%;border-radius: 2px;}

.calc_sp {margin-top:10px;margin-left:15px;border-bottom: 1px solid #ddd;padding-bottom: 10px;width: 920px;}
.calc_sp_min-max {position: relative;top: 16px;width: 385px;}
.left {float:left;}
.right {float:right;}
.clear {clear:both;}
.slider_sp {margin-left: 0;position: relative;}
.block_sp_1 {float: left;position: relative;width: 400px;margin-top: 5px;margin-right: 10px;    padding: 0px 0px 0px 10px;}
.block_sp_2 {float:left;    padding: 0px 0px 0px 10px;}

JavaScript

jQuery(document).ready(function () {
		if (jQuery("#p1").prop('checked')) {
			slid();
		}
		jQuery("input[name=type]:radio").change(function() {
		if (jQuery("#p1").prop('checked')) {
			slide();
		}
	})

	});

	function slid() {


	$( "#slider" ).slider({
			range: "min",
			min: 5,
			max: 100,
			value: 10,
			slide: function( event, ui ) {
				$( "#amount" ).val( ui.value );
				calc();
			}
		});
		$( "#amount" ).val( $( "#slider" ).slider( "value" ) );

		$('#amount').keyup(function() {
			var val = $(this).val();
			$('#slider').slider("value",val);
		});


	};
	function calc(par){

		var radios = document.getElementsByTagName('input');
        var value;
        for (var i = 0; i < radios.length; i++) {
        if (radios[i].type === 'radio' && radios[i].checked && radios[i].name === 'type') {
        //
        type = radios[i].value;
		    }
		}

	if(Number(type) == 1){
		num = 5;
		mins = 5;
		maxs = 100;
	}

	if ( par ) {
		amount = mins;
	} else {
		amount = $('#amount').val();
	}
	//var summ;

	dep = Number(amount) - Number(amount) * 2 / 100 ;

	if(Number(type) == 1){
	summ = Number(amount) ;
  summ2 = Number(amount) ;
	summ = summ * 690;
	summ2 = summ2 * 929;
	}
	document.getElementById("mins").innerHTML=mins;
	document.getElementById("maxs").innerHTML=maxs;
	document.getElementById("summ").innerHTML=summ.toFixed(2);
  document.getElementById("summ2").innerHTML=summ2.toFixed(2);
	document.getElementById("num").innerHTML=num.toFixed(0);
	return false;
	}