First, I think you should set the price to depend on the customer inputed.
with function setPrice of \Magento\Quote\Model\Quote\Address\RateResult\Method
The solution is plugin to Magento\Quote\Model\Quote\Address\RateResult\Method and change value of price before set to data['price'];
di.xml
<type name="Magento\Quote\Model\Quote\Address\RateResult\Method">
<plugin name="namespace_change_price_of_shipping_rate" type="NameSpace\Module\Plugin\Model\Quote\Address\RateResult\Method"/>
</type>
NameSpace\Module\Plugin\Model\Quote\Address\RateResult\Method
namespace NameSpace\Module\Plugin\Model\Quote\Address\RateResult;
class Method
{
protected $_customerSession;
public function __construct(
\Magento\Customer\Model\Session $customerSession)
{
$this->_customerSession = $customerSession;
}
/**
* Round shipping carrier's method price
*
* @param string|float|int $price
* @return $this
*/
public function beforeSetPrice($subject, $price)
{
// @TODO returun inputed price
return $price;
}
public function beforeSetCost($subject, $price)
{
// @TODO returun inputed price.
return $price;
}
public function beforeSetData($subject, $key, $value){
if('price' == $key || 'cost' == $key){
//@TODO set inputed price to value
}
return [$key, $value];
}
}
2: Edit your vendor/magento/module-checkout/view/frontend/web/template/shipping-address/shipping-method-item.html:16 file to Add an input for input custom price
<input type="text" attr="'value': customPrice "/>
3: Edit shipping javascript file vendor/magento/module-checkout/view/frontend/web/js/view/shipping.js to add a function that appends custom price to shipping data.
selectShippingMethod: function (shippingMethod) {
selectShippingMethodAction(shippingMethod);
checkoutData.setSelectedShippingRate(shippingMethod['carrier_code'] + '_' + shippingMethod['method_code']);
/** @TODO store custom input data to somewhere
* for NameSpace\Module\Plugin\Model\Quote\Address\RateResult\Method
* can get and set to value of variable **price** */
return true;
},