|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>Cementing Job Calculator</title> |
|
|
<script src="https://cdn.tailwindcss.com"></script> |
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
|
|
<style> |
|
|
.tab-content { |
|
|
display: none; |
|
|
} |
|
|
.tab-content.active { |
|
|
display: block; |
|
|
} |
|
|
.tab-btn.active { |
|
|
background-color: #3b82f6; |
|
|
color: white; |
|
|
} |
|
|
.input-highlight { |
|
|
background-color: #f0f9ff; |
|
|
border-left: 4px solid #3b82f6; |
|
|
} |
|
|
.result-box { |
|
|
background-color: #f8fafc; |
|
|
border-left: 4px solid #10b981; |
|
|
} |
|
|
.risk-high { |
|
|
background-color: #fee2e2; |
|
|
} |
|
|
.risk-medium { |
|
|
background-color: #fef3c7; |
|
|
} |
|
|
.risk-low { |
|
|
background-color: #dcfce7; |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body class="bg-gray-50 min-h-screen"> |
|
|
<div class="container mx-auto px-4 py-8 max-w-6xl"> |
|
|
<header class="mb-8 text-center"> |
|
|
<h1 class="text-3xl font-bold text-blue-800 mb-2">Cementing Job Calculator</h1> |
|
|
<p class="text-gray-600">Comprehensive tool for cementing operation planning and analysis</p> |
|
|
</header> |
|
|
|
|
|
<div class="bg-white rounded-lg shadow-lg overflow-hidden mb-8"> |
|
|
<div class="flex flex-wrap border-b border-gray-200"> |
|
|
<button class="tab-btn active px-6 py-3 font-medium text-sm" data-tab="calculation">Calculation Methods</button> |
|
|
<button class="tab-btn px-6 py-3 font-medium text-sm" data-tab="economic">Economic Analysis</button> |
|
|
<button class="tab-btn px-6 py-3 font-medium text-sm" data-tab="probability">Probability Analysis</button> |
|
|
<button class="tab-btn px-6 py-3 font-medium text-sm" data-tab="mitigation">Mitigation Strategies</button> |
|
|
<button class="tab-btn px-6 py-3 font-medium text-sm" data-tab="references">References</button> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="calculation" class="tab-content active p-6"> |
|
|
<div class="mb-6"> |
|
|
<h2 class="text-xl font-semibold mb-4 text-blue-700">Cementing Method Selection</h2> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6"> |
|
|
<div class="p-4 border rounded-lg cursor-pointer method-option hover:bg-blue-50" data-method="balance"> |
|
|
<h3 class="font-medium text-lg mb-2">Balance Plug Method</h3> |
|
|
<p class="text-gray-600 text-sm">Calculates cement volume needed to balance hydrostatic pressure in the wellbore.</p> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg cursor-pointer method-option hover:bg-blue-50" data-method="bullhead"> |
|
|
<h3 class="font-medium text-lg mb-2">Bullhead Method</h3> |
|
|
<p class="text-gray-600 text-sm">Forces cement into the formation by pumping at high pressure.</p> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg cursor-pointer method-option hover:bg-blue-50" data-method="two-stage"> |
|
|
<h3 class="font-medium text-lg mb-2">Two-Stage Cementing</h3> |
|
|
<p class="text-gray-600 text-sm">Performs cementing in two separate stages with a mechanical plug between them.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="balance-form" class="method-form"> |
|
|
<h3 class="text-lg font-medium mb-4 text-blue-700">Balance Plug Method Calculation</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Hole Diameter (inches)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 8.5"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Casing OD (inches)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 7"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Plug Length (ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 500"> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Mud Weight (ppg)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 10.5"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Cement Weight (ppg)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 15.8"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Excess Factor (%)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 20"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg mt-4 calculate-btn">Calculate</button> |
|
|
|
|
|
<div class="result-box p-4 rounded-lg mt-6 hidden"> |
|
|
<h4 class="font-medium text-lg mb-2 text-green-700">Calculation Results</h4> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Annular Volume</p> |
|
|
<p class="font-bold" id="annular-vol">0 bbl</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Cement Volume</p> |
|
|
<p class="font-bold" id="cement-vol">0 bbl</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Displacement Volume</p> |
|
|
<p class="font-bold" id="displacement-vol">0 bbl</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-4 p-3 bg-blue-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Hydrostatic Balance Check</p> |
|
|
<p class="font-bold" id="balance-check">Balanced</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="bullhead-form" class="method-form hidden"> |
|
|
<h3 class="text-lg font-medium mb-4 text-blue-700">Bullhead Method Calculation</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Casing Capacity (bbl/ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 0.038"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Cement Height (ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 1000"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Fracture Gradient (psi/ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 0.78"> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Mud Weight (ppg)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 10.5"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Cement Weight (ppg)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 15.8"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Pump Rate (bbl/min)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 5"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg mt-4 calculate-btn">Calculate</button> |
|
|
|
|
|
<div class="result-box p-4 rounded-lg mt-6 hidden"> |
|
|
<h4 class="font-medium text-lg mb-2 text-green-700">Calculation Results</h4> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4"> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Cement Volume</p> |
|
|
<p class="font-bold" id="bh-cement-vol">0 bbl</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Maximum Pressure</p> |
|
|
<p class="font-bold" id="max-pressure">0 psi</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Pumping Time</p> |
|
|
<p class="font-bold" id="pump-time">0 min</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mt-4 p-3 bg-blue-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Fracture Risk</p> |
|
|
<p class="font-bold" id="fracture-risk">Low</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="two-stage-form" class="method-form hidden"> |
|
|
<h3 class="text-lg font-medium mb-4 text-blue-700">Two-Stage Cementing Calculation</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6"> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">First Stage Height (ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 2000"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Second Stage Height (ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 1500"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Annular Capacity (bbl/ft)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 0.045"> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">First Stage Slurry Yield (ft³/sack)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 1.15"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Second Stage Slurry Yield (ft³/sack)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 1.08"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Excess Factor (%)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" placeholder="e.g., 25"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg mt-4 calculate-btn">Calculate</button> |
|
|
|
|
|
<div class="result-box p-4 rounded-lg mt-6 hidden"> |
|
|
<h4 class="font-medium text-lg mb-2 text-green-700">Calculation Results</h4> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">First Stage Volume</p> |
|
|
<p class="font-bold" id="first-stage-vol">0 bbl</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Second Stage Volume</p> |
|
|
<p class="font-bold" id="second-stage-vol">0 bbl</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">First Stage Sacks</p> |
|
|
<p class="font-bold" id="first-stage-sacks">0</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Second Stage Sacks</p> |
|
|
<p class="font-bold" id="second-stage-sacks">0</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="economic" class="tab-content p-6"> |
|
|
<h2 class="text-xl font-semibold mb-4 text-blue-700">Economic Analysis</h2> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6"> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium mb-4">Cost Inputs</h3> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Cement Cost ($/sack)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="cement-cost" placeholder="e.g., 25"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Additives Cost ($/sack)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="additives-cost" placeholder="e.g., 5"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Rig Time Cost ($/hour)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="rig-time-cost" placeholder="e.g., 5000"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Service Company Cost ($)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="service-cost" placeholder="e.g., 15000"> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium mb-4">Time Estimates</h3> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Mixing & Pumping Time (hours)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="pumping-time" placeholder="e.g., 4"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Waiting on Cement (hours)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="woc-time" placeholder="e.g., 12"> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Contingency Time (hours)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg input-field" id="contingency-time" placeholder="e.g., 2"> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg mt-4" id="calculate-cost">Calculate Costs</button> |
|
|
|
|
|
<div class="result-box p-4 rounded-lg mt-6 hidden" id="economic-results"> |
|
|
<h4 class="font-medium text-lg mb-4 text-green-700">Economic Analysis Results</h4> |
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4"> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Total Cement Cost</p> |
|
|
<p class="font-bold" id="total-cement-cost">$0</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Total Additives Cost</p> |
|
|
<p class="font-bold" id="total-additives-cost">$0</p> |
|
|
</div> |
|
|
<div class="p-3 bg-gray-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Total Rig Time Cost</p> |
|
|
<p class="font-bold" id="total-rig-cost">$0</p> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 bg-blue-50 rounded"> |
|
|
<p class="text-sm text-gray-600">Total Estimated Cost</p> |
|
|
<p class="font-bold text-xl" id="total-cost">$0</p> |
|
|
</div> |
|
|
<div class="mt-4"> |
|
|
<h5 class="font-medium mb-2">Cost Breakdown</h5> |
|
|
<div class="w-full bg-gray-200 rounded-full h-4 mb-2"> |
|
|
<div class="bg-blue-600 h-4 rounded-full" id="cement-cost-bar" style="width: 0%"></div> |
|
|
</div> |
|
|
<div class="flex justify-between text-sm mb-4"> |
|
|
<span>Cement Materials</span> |
|
|
<span id="cement-percent">0%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-4 mb-2"> |
|
|
<div class="bg-green-500 h-4 rounded-full" id="rig-cost-bar" style="width: 0%"></div> |
|
|
</div> |
|
|
<div class="flex justify-between text-sm mb-4"> |
|
|
<span>Rig Time</span> |
|
|
<span id="rig-percent">0%</span> |
|
|
</div> |
|
|
<div class="w-full bg-gray-200 rounded-full h-4 mb-2"> |
|
|
<div class="bg-yellow-500 h-4 rounded-full" id="service-cost-bar" style="width: 0%"></div> |
|
|
</div> |
|
|
<div class="flex justify-between text-sm"> |
|
|
<span>Services</span> |
|
|
<span id="service-percent">0%</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="probability" class="tab-content p-6"> |
|
|
<h2 class="text-xl font-semibold mb-4 text-blue-700">Probability Analysis</h2> |
|
|
<div class="mb-6"> |
|
|
<h3 class="text-lg font-medium mb-4">Risk Factors</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<label class="block text-gray-700 mb-2">Lost Circulation Risk (%)</label> |
|
|
<input type="range" min="0" max="100" value="30" class="w-full risk-slider" id="lost-circ-risk"> |
|
|
<div class="flex justify-between text-sm text-gray-600 mt-1"> |
|
|
<span>0%</span> |
|
|
<span id="lost-circ-value">30%</span> |
|
|
<span>100%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<label class="block text-gray-700 mb-2">Channeling Risk (%)</label> |
|
|
<input type="range" min="0" max="100" value="25" class="w-full risk-slider" id="channeling-risk"> |
|
|
<div class="flex justify-between text-sm text-gray-600 mt-1"> |
|
|
<span>0%</span> |
|
|
<span id="channeling-value">25%</span> |
|
|
<span>100%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<label class="block text-gray-700 mb-2">Contamination Risk (%)</label> |
|
|
<input type="range" min="0" max="100" value="20" class="w-full risk-slider" id="contamination-risk"> |
|
|
<div class="flex justify-between text-sm text-gray-600 mt-1"> |
|
|
<span>0%</span> |
|
|
<span id="contamination-value">20%</span> |
|
|
<span>100%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<label class="block text-gray-700 mb-2">Equipment Failure Risk (%)</label> |
|
|
<input type="range" min="0" max="100" value="15" class="w-full risk-slider" id="equipment-risk"> |
|
|
<div class="flex justify-between text-sm text-gray-600 mt-1"> |
|
|
<span>0%</span> |
|
|
<span id="equipment-value">15%</span> |
|
|
<span>100%</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg mt-4" id="calculate-risk">Calculate Risk Probability</button> |
|
|
|
|
|
<div class="result-box p-4 rounded-lg mt-6 hidden" id="risk-results"> |
|
|
<h4 class="font-medium text-lg mb-4 text-green-700">Risk Analysis Results</h4> |
|
|
<div class="mb-4"> |
|
|
<h5 class="font-medium mb-2">Overall Success Probability</h5> |
|
|
<div class="w-full bg-gray-200 rounded-full h-6"> |
|
|
<div class="bg-green-600 h-6 rounded-full flex items-center justify-center text-white text-sm font-medium" id="success-bar" style="width: 0%">0%</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
|
<div> |
|
|
<h5 class="font-medium mb-2">Risk Factors</h5> |
|
|
<div class="space-y-2"> |
|
|
<div class="p-2 rounded risk-high"> |
|
|
<div class="flex justify-between"> |
|
|
<span>Lost Circulation</span> |
|
|
<span class="font-medium" id="lost-circ-result">30%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-2 rounded risk-medium"> |
|
|
<div class="flex justify-between"> |
|
|
<span>Channeling</span> |
|
|
<span class="font-medium" id="channeling-result">25%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-2 rounded risk-low"> |
|
|
<div class="flex justify-between"> |
|
|
<span>Contamination</span> |
|
|
<span class="font-medium" id="contamination-result">20%</span> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-2 rounded risk-low"> |
|
|
<div class="flex justify-between"> |
|
|
<span>Equipment Failure</span> |
|
|
<span class="font-medium" id="equipment-result">15%</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h5 class="font-medium mb-2">Risk Impact</h5> |
|
|
<div class="bg-blue-50 p-4 rounded-lg"> |
|
|
<p class="text-sm mb-2" id="risk-impact-text">Based on your inputs, the cement job has a high probability of success with moderate risks that can be mitigated with proper planning.</p> |
|
|
<div class="mt-2"> |
|
|
<span class="inline-block px-2 py-1 text-xs font-medium rounded bg-blue-100 text-blue-800">Recommendation:</span> |
|
|
<span class="text-sm" id="risk-recommendation">Consider using lost circulation materials and centralizers to improve success rate.</span> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="mitigation" class="tab-content p-6"> |
|
|
<h2 class="text-xl font-semibold mb-4 text-blue-700">Mitigation Strategies</h2> |
|
|
<div class="mb-6"> |
|
|
<h3 class="text-lg font-medium mb-4">Common Cementing Challenges</h3> |
|
|
<div class="space-y-4"> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<div class="flex items-start"> |
|
|
<div class="flex-shrink-0 bg-red-100 p-2 rounded-full mr-4"> |
|
|
<i class="fas fa-exclamation-triangle text-red-600"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-medium">Lost Circulation</h4> |
|
|
<p class="text-sm text-gray-600 mt-1">Occurs when cement enters formation fractures instead of filling annulus.</p> |
|
|
<div class="mt-2"> |
|
|
<span class="inline-block bg-red-100 text-red-800 text-xs px-2 py-1 rounded">Mitigation:</span> |
|
|
<ul class="list-disc list-inside text-sm mt-1 ml-4"> |
|
|
<li>Use lost circulation materials (LCM) in cement slurry</li> |
|
|
<li>Reduce pumping rates and pressures</li> |
|
|
<li>Consider staged cementing operations</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<div class="flex items-start"> |
|
|
<div class="flex-shrink-0 bg-yellow-100 p-2 rounded-full mr-4"> |
|
|
<i class="fas fa-random text-yellow-600"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-medium">Channeling</h4> |
|
|
<p class="text-sm text-gray-600 mt-1">Poor cement distribution due to incomplete mud displacement.</p> |
|
|
<div class="mt-2"> |
|
|
<span class="inline-block bg-yellow-100 text-yellow-800 text-xs px-2 py-1 rounded">Mitigation:</span> |
|
|
<ul class="list-disc list-inside text-sm mt-1 ml-4"> |
|
|
<li>Use proper centralizers and scratchers</li> |
|
|
<li>Optimize mud removal techniques</li> |
|
|
<li>Use turbulent flow regime during cementing</li> |
|
|
<li>Consider spacer fluids</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<div class="flex items-start"> |
|
|
<div class="flex-shrink-0 bg-blue-100 p-2 rounded-full mr-4"> |
|
|
<i class="fas fa-tint-slash text-blue-600"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-medium">Contamination</h4> |
|
|
<p class="text-sm text-gray-600 mt-1">Mixing of cement with drilling fluid reduces cement strength.</p> |
|
|
<div class="mt-2"> |
|
|
<span class="inline-block bg-blue-100 text-blue-800 text-xs px-2 py-1 rounded">Mitigation:</span> |
|
|
<ul class="list-disc list-inside text-sm mt-1 ml-4"> |
|
|
<li>Use adequate spacer volumes</li> |
|
|
<li>Ensure proper displacement efficiency</li> |
|
|
<li>Monitor returns during cementing</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="p-4 border rounded-lg"> |
|
|
<div class="flex items-start"> |
|
|
<div class="flex-shrink-0 bg-purple-100 p-2 rounded-full mr-4"> |
|
|
<i class="fas fa-tools text-purple-600"></i> |
|
|
</div> |
|
|
<div> |
|
|
<h4 class="font-medium">Equipment Failure</h4> |
|
|
<p class="text-sm text-gray-600 mt-1">Pump failures, plug malfunctions, or surface equipment issues.</p> |
|
|
<div class="mt-2"> |
|
|
<span class="inline-block bg-purple-100 text-purple-800 text-xs px-2 py-1 rounded">Mitigation:</span> |
|
|
<ul class="list-disc list-inside text-sm mt-1 ml-4"> |
|
|
<li>Perform thorough equipment checks before job</li> |
|
|
<li>Have backup equipment available</li> |
|
|
<li>Train personnel on emergency procedures</li> |
|
|
</ul> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium mb-4">Custom Mitigation Plan</h3> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Select Primary Risk to Address</label> |
|
|
<select class="w-full px-3 py-2 border rounded-lg" id="risk-select"> |
|
|
<option value="lost-circ">Lost Circulation</option> |
|
|
<option value="channeling">Channeling</option> |
|
|
<option value="contamination">Contamination</option> |
|
|
<option value="equipment">Equipment Failure</option> |
|
|
</select> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Mitigation Strategy</label> |
|
|
<textarea class="w-full px-3 py-2 border rounded-lg" rows="3" id="mitigation-strategy" placeholder="Describe your mitigation approach..."></textarea> |
|
|
</div> |
|
|
<div class="mb-4"> |
|
|
<label class="block text-gray-700 mb-2">Estimated Cost Impact ($)</label> |
|
|
<input type="number" class="w-full px-3 py-2 border rounded-lg" id="mitigation-cost" placeholder="e.g., 5000"> |
|
|
</div> |
|
|
<button class="bg-blue-600 hover:bg-blue-700 text-white px-6 py-2 rounded-lg" id="add-mitigation">Add to Plan</button> |
|
|
|
|
|
<div class="mt-6 border rounded-lg p-4 hidden" id="mitigation-plan"> |
|
|
<h4 class="font-medium mb-3">Your Mitigation Plan</h4> |
|
|
<div class="space-y-3" id="plan-items"> |
|
|
|
|
|
</div> |
|
|
<button class="bg-green-600 hover:bg-green-700 text-white px-4 py-1 rounded-lg text-sm mt-3" id="save-plan">Save Plan</button> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<div id="references" class="tab-content p-6"> |
|
|
<h2 class="text-xl font-semibold mb-4 text-blue-700">References & Resources</h2> |
|
|
<div class="mb-6"> |
|
|
<h3 class="text-lg font-medium mb-4">Cementing Calculation Methods</h3> |
|
|
<div class="space-y-3"> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<a href="https://www.drillingformulas.com/balanced-plug-cementing-calculation/" class="text-blue-600 hover:underline font-medium" target="_blank">Balanced Plug Cementing Calculation</a> |
|
|
<p class="text-sm text-gray-600 mt-1">Detailed explanation of balanced plug method with example calculations.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<a href="https://www.drillingformulas.com/bullheading-calculation/" class="text-blue-600 hover:underline font-medium" target="_blank">Bullheading Calculation</a> |
|
|
<p class="text-sm text-gray-600 mt-1">Procedure and formulas for bullhead cementing operations.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<a href="https://www.drillingformulas.com/two-stage-cementing-calculation/" class="text-blue-600 hover:underline font-medium" target="_blank">Two-Stage Cementing Calculation</a> |
|
|
<p class="text-sm text-gray-600 mt-1">Step-by-step guide for planning two-stage cement jobs.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div class="mb-6"> |
|
|
<h3 class="text-lg font-medium mb-4">Industry Standards</h3> |
|
|
<div class="space-y-3"> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<a href="https://www.api.org/" class="text-blue-600 hover:underline font-medium" target="_blank">API Standards for Well Cementing</a> |
|
|
<p class="text-sm text-gray-600 mt-1">API 10A, 10B, and other relevant standards for cementing operations.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<a href="https://www.spe.org/" class="text-blue-600 hover:underline font-medium" target="_blank">SPE Cementing Papers</a> |
|
|
<p class="text-sm text-gray-600 mt-1">Technical papers on cementing best practices and innovations.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div> |
|
|
<h3 class="text-lg font-medium mb-4">Additional Resources</h3> |
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4"> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<div class="flex items-center mb-2"> |
|
|
<i class="fas fa-file-pdf text-red-500 mr-2"></i> |
|
|
<a href="https://www.slb.com/resource-library/oilfield-review/defining-series/cementing" class="text-blue-600 hover:underline font-medium" target="_blank">Cementing Fundamentals (Schlumberger)</a> |
|
|
</div> |
|
|
<p class="text-sm text-gray-600">Comprehensive guide to cementing principles and practices.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<div class="flex items-center mb-2"> |
|
|
<i class="fas fa-video text-blue-500 mr-2"></i> |
|
|
<a href="https://www.youtube.com/watch?v=example" class="text-blue-600 hover:underline font-medium" target="_blank">Cementing Operations Video</a> |
|
|
</div> |
|
|
<p class="text-sm text-gray-600">Visual demonstration of cementing equipment and procedures.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<div class="flex items-center mb-2"> |
|
|
<i class="fas fa-calculator text-green-500 mr-2"></i> |
|
|
<a href="https://www.drillingformulas.com/cementing-calculations/" class="text-blue-600 hover:underline font-medium" target="_blank">Cementing Calculations Collection</a> |
|
|
</div> |
|
|
<p class="text-sm text-gray-600">Various cementing calculations and formulas.</p> |
|
|
</div> |
|
|
<div class="p-3 border rounded-lg hover:bg-gray-50"> |
|
|
<div class="flex items-center mb-2"> |
|
|
<i class="fas fa-book text-purple-500 mr-2"></i> |
|
|
<a href="https://www.worldcat.org/title/well-cemetioning/oclc/example" class="text-blue-600 hover:underline font-medium" target="_blank">Well Cementing Textbook</a> |
|
|
</div> |
|
|
<p class="text-sm text-gray-600">Comprehensive reference book on cementing technology.</p> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<footer class="text-center text-gray-500 text-sm mt-8"> |
|
|
<p>Cementing Job Calculator v1.0 | Data references from <a href="https://www.drillingformulas.com" class="text-blue-600 hover:underline" target="_blank">DrillingFormulas.com</a></p> |
|
|
<p class="mt-1">For educational and planning purposes only</p> |
|
|
</footer> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
|
|
|
document.querySelectorAll('.tab-btn').forEach(button => { |
|
|
button.addEventListener('click', () => { |
|
|
|
|
|
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active')); |
|
|
document.querySelectorAll('.tab-content').forEach(tab => tab.classList.remove('active')); |
|
|
|
|
|
|
|
|
button.classList.add('active'); |
|
|
const tabId = button.getAttribute('data-tab'); |
|
|
document.getElementById(tabId).classList.add('active'); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.method-option').forEach(option => { |
|
|
option.addEventListener('click', () => { |
|
|
|
|
|
document.querySelectorAll('.method-option').forEach(opt => { |
|
|
opt.classList.remove('border-blue-500', 'bg-blue-50'); |
|
|
}); |
|
|
|
|
|
|
|
|
option.classList.add('border-blue-500', 'bg-blue-50'); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.method-form').forEach(form => { |
|
|
form.classList.add('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
const method = option.getAttribute('data-method'); |
|
|
document.getElementById(`${method}-form`).classList.remove('hidden'); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.input-field').forEach(input => { |
|
|
input.addEventListener('focus', () => { |
|
|
input.classList.add('input-highlight'); |
|
|
}); |
|
|
|
|
|
input.addEventListener('blur', () => { |
|
|
input.classList.remove('input-highlight'); |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('#balance-form .calculate-btn').addEventListener('click', () => { |
|
|
|
|
|
const holeDia = parseFloat(document.querySelector('#balance-form input:nth-child(1)').value) || 0; |
|
|
const casingOD = parseFloat(document.querySelector('#balance-form input:nth-child(2)').value) || 0; |
|
|
const plugLength = parseFloat(document.querySelector('#balance-form input:nth-child(3)').value) || 0; |
|
|
const mudWeight = parseFloat(document.querySelector('#balance-form input:nth-child(4)').value) || 0; |
|
|
const cementWeight = parseFloat(document.querySelector('#balance-form input:nth-child(5)').value) || 0; |
|
|
const excessFactor = parseFloat(document.querySelector('#balance-form input:nth-child(6)').value) || 0; |
|
|
|
|
|
|
|
|
const annularCapacity = (Math.PI * Math.pow(holeDia, 2) / 4 - Math.PI * Math.pow(casingOD, 2) / 4) / 1029.4; |
|
|
const annularVolume = annularCapacity * plugLength; |
|
|
const cementVolume = annularVolume * (1 + excessFactor/100); |
|
|
const displacementVolume = annularVolume * mudWeight / cementWeight; |
|
|
|
|
|
|
|
|
document.getElementById('annular-vol').textContent = annularVolume.toFixed(2) + ' bbl'; |
|
|
document.getElementById('cement-vol').textContent = cementVolume.toFixed(2) + ' bbl'; |
|
|
document.getElementById('displacement-vol').textContent = displacementVolume.toFixed(2) + ' bbl'; |
|
|
|
|
|
|
|
|
const balanceCheck = Math.abs(mudWeight - cementWeight) < 2 ? 'Balanced' : 'Unbalanced'; |
|
|
document.getElementById('balance-check').textContent = balanceCheck; |
|
|
|
|
|
|
|
|
document.querySelector('#balance-form .result-box').classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('#bullhead-form .calculate-btn').addEventListener('click', () => { |
|
|
|
|
|
const casingCap = parseFloat(document.querySelector('#bullhead-form input:nth-child(1)').value) || 0; |
|
|
const cementHeight = parseFloat(document.querySelector('#bullhead-form input:nth-child(2)').value) || 0; |
|
|
const fracGradient = parseFloat(document.querySelector('#bullhead-form input:nth-child(3)').value) || 0; |
|
|
const mudWeight = parseFloat(document.querySelector('#bullhead-form input:nth-child(4)').value) || 0; |
|
|
const cementWeight = parseFloat(document.querySelector('#bullhead-form input:nth-child(5)').value) || 0; |
|
|
const pumpRate = parseFloat(document.querySelector('#bullhead-form input:nth-child(6)').value) || 0; |
|
|
|
|
|
|
|
|
const cementVolume = casingCap * cementHeight; |
|
|
const maxPressure = fracGradient * cementHeight - 0.052 * mudWeight * cementHeight; |
|
|
const pumpTime = cementVolume / pumpRate; |
|
|
|
|
|
|
|
|
let fractureRisk = 'Low'; |
|
|
if (maxPressure > fracGradient * cementHeight * 0.9) { |
|
|
fractureRisk = 'High'; |
|
|
} else if (maxPressure > fracGradient * cementHeight * 0.7) { |
|
|
fractureRisk = 'Medium'; |
|
|
} |
|
|
|
|
|
|
|
|
document.getElementById('bh-cement-vol').textContent = cementVolume.toFixed(2) + ' bbl'; |
|
|
document.getElementById('max-pressure').textContent = maxPressure.toFixed(0) + ' psi'; |
|
|
document.getElementById('pump-time').textContent = pumpTime.toFixed(1) + ' min'; |
|
|
document.getElementById('fracture-risk').textContent = fractureRisk; |
|
|
|
|
|
|
|
|
document.querySelector('#bullhead-form .result-box').classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelector('#two-stage-form .calculate-btn').addEventListener('click', () => { |
|
|
|
|
|
const firstStageHeight = parseFloat(document.querySelector('#two-stage-form input:nth-child(1)').value) || 0; |
|
|
const secondStageHeight = parseFloat(document.querySelector('#two-stage-form input:nth-child(2)').value) || 0; |
|
|
const annularCap = parseFloat(document.querySelector('#two-stage-form input:nth-child(3)').value) || 0; |
|
|
const firstStageYield = parseFloat(document.querySelector('#two-stage-form input:nth-child(4)').value) || 0; |
|
|
const secondStageYield = parseFloat(document.querySelector('#two-stage-form input:nth-child(5)').value) || 0; |
|
|
const excessFactor = parseFloat(document.querySelector('#two-stage-form input:nth-child(6)').value) || 0; |
|
|
|
|
|
|
|
|
const firstStageVol = annularCap * firstStageHeight * (1 + excessFactor/100); |
|
|
const secondStageVol = annularCap * secondStageHeight * (1 + excessFactor/100); |
|
|
const firstStageSacks = (firstStageVol * 5.6146) / firstStageYield; |
|
|
const secondStageSacks = (secondStageVol * 5.6146) / secondStageYield; |
|
|
|
|
|
|
|
|
document.getElementById('first-stage-vol').textContent = firstStageVol.toFixed(2) + ' bbl'; |
|
|
document.getElementById('second-stage-vol').textContent = secondStageVol.toFixed(2) + ' bbl'; |
|
|
document.getElementById('first-stage-sacks').textContent = Math.ceil(firstStageSacks); |
|
|
document.getElementById('second-stage-sacks').textContent = Math.ceil(secondStageSacks); |
|
|
|
|
|
|
|
|
document.querySelector('#two-stage-form .result-box').classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('calculate-cost').addEventListener('click', () => { |
|
|
|
|
|
const cementCost = parseFloat(document.getElementById('cement-cost').value) || 0; |
|
|
const additivesCost = parseFloat(document.getElementById('additives-cost').value) || 0; |
|
|
const rigTimeCost = parseFloat(document.getElementById('rig-time-cost').value) || 0; |
|
|
const serviceCost = parseFloat(document.getElementById('service-cost').value) || 0; |
|
|
const pumpingTime = parseFloat(document.getElementById('pumping-time').value) || 0; |
|
|
const wocTime = parseFloat(document.getElementById('woc-time').value) || 0; |
|
|
const contingencyTime = parseFloat(document.getElementById('contingency-time').value) || 0; |
|
|
|
|
|
|
|
|
let cementSacks = 100; |
|
|
if (!document.querySelector('#balance-form .result-box').classList.contains('hidden')) { |
|
|
cementSacks = parseFloat(document.getElementById('cement-vol').textContent) * 5.6146 / 1.15 * 1.2; |
|
|
} else if (!document.querySelector('#bullhead-form .result-box').classList.contains('hidden')) { |
|
|
cementSacks = parseFloat(document.getElementById('bh-cement-vol').textContent) * 5.6146 / 1.15 * 1.2; |
|
|
} else if (!document.querySelector('#two-stage-form .result-box').classList.contains('hidden')) { |
|
|
cementSacks = parseFloat(document.getElementById('first-stage-sacks').textContent) + |
|
|
parseFloat(document.getElementById('second-stage-sacks').textContent); |
|
|
} |
|
|
|
|
|
|
|
|
const totalCementCost = cementSacks * cementCost; |
|
|
const totalAdditivesCost = cementSacks * additivesCost; |
|
|
const totalRigCost = (pumpingTime + wocTime + contingencyTime) * rigTimeCost; |
|
|
const totalCost = totalCementCost + totalAdditivesCost + totalRigCost + serviceCost; |
|
|
|
|
|
|
|
|
const cementPercent = Math.round((totalCementCost + totalAdditivesCost) / totalCost * 100); |
|
|
const rigPercent = Math.round(totalRigCost / totalCost * 100); |
|
|
const servicePercent = Math.round(serviceCost / totalCost * 100); |
|
|
|
|
|
|
|
|
document.getElementById('total-cement-cost').textContent = '$' + totalCementCost.toFixed(0); |
|
|
document.getElementById('total-additives-cost').textContent = '$' + totalAdditivesCost.toFixed(0); |
|
|
document.getElementById('total-rig-cost').textContent = '$' + totalRigCost.toFixed(0); |
|
|
document.getElementById('total-cost').textContent = '$' + totalCost.toFixed(0); |
|
|
|
|
|
|
|
|
document.getElementById('cement-cost-bar').style.width = cementPercent + '%'; |
|
|
document.getElementById('rig-cost-bar').style.width = rigPercent + '%'; |
|
|
document.getElementById('service-cost-bar').style.width = servicePercent + '%'; |
|
|
|
|
|
|
|
|
document.getElementById('cement-percent').textContent = cementPercent + '%'; |
|
|
document.getElementById('rig-percent').textContent = rigPercent + '%'; |
|
|
document.getElementById('service-percent').textContent = servicePercent + '%'; |
|
|
|
|
|
|
|
|
document.getElementById('economic-results').classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('calculate-risk').addEventListener('click', () => { |
|
|
|
|
|
const lostCircRisk = parseInt(document.getElementById('lost-circ-risk').value); |
|
|
const channelingRisk = parseInt(document.getElementById('channeling-risk').value); |
|
|
const contaminationRisk = parseInt(document.getElementById('contamination-risk').value); |
|
|
const equipmentRisk = parseInt(document.getElementById('equipment-risk').value); |
|
|
|
|
|
|
|
|
const successProbability = 100 - Math.max( |
|
|
lostCircRisk * 0.7, |
|
|
channelingRisk * 0.5, |
|
|
contaminationRisk * 0.3, |
|
|
equipmentRisk * 0.4 |
|
|
); |
|
|
|
|
|
|
|
|
document.getElementById('success-bar').style.width = successProbability + '%'; |
|
|
document.getElementById('success-bar').textContent = successProbability + '%'; |
|
|
|
|
|
document.getElementById('lost-circ-result').textContent = lostCircRisk + '%'; |
|
|
document.getElementById('channeling-result').textContent = channelingRisk + '%'; |
|
|
document.getElementById('contamination-result').textContent = contaminationRisk + '%'; |
|
|
document.getElementById('equipment-result').textContent = equipmentRisk + '%'; |
|
|
|
|
|
|
|
|
let impactText = ''; |
|
|
let recommendation = ''; |
|
|
|
|
|
if (successProbability > 80) { |
|
|
impactText = 'The cement job has a very high probability of success with minimal risks.'; |
|
|
recommendation = 'Proceed with standard procedures while maintaining vigilance.'; |
|
|
} else if (successProbability > 60) { |
|
|
impactText = 'The cement job has a good probability of success with manageable risks.'; |
|
|
recommendation = 'Consider additional mitigation measures for the highest risk factors.'; |
|
|
} else if (successProbability > 40) { |
|
|
impactText = 'The cement job has moderate risks that could significantly impact success.'; |
|
|
recommendation = 'Implement robust mitigation strategies and have contingency plans ready.'; |
|
|
} else { |
|
|
impactText = 'The cement job has high risks that may lead to failure.'; |
|
|
recommendation = 'Re-evaluate the cementing plan and consider alternative approaches.'; |
|
|
} |
|
|
|
|
|
document.getElementById('risk-impact-text').textContent = impactText; |
|
|
document.getElementById('risk-recommendation').textContent = recommendation; |
|
|
|
|
|
|
|
|
document.getElementById('risk-results').classList.remove('hidden'); |
|
|
}); |
|
|
|
|
|
|
|
|
document.querySelectorAll('.risk-slider').forEach(slider => { |
|
|
slider.addEventListener('input', function() { |
|
|
const valueId = this.id.replace('-risk', '-value'); |
|
|
document.getElementById(valueId).textContent = this.value + '%'; |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('add-mitigation').addEventListener('click', () => { |
|
|
const riskSelect = document.getElementById('risk-select'); |
|
|
const strategy = document.getElementById('mitigation-strategy').value; |
|
|
const cost = document.getElementById('mitigation-cost').value || 0; |
|
|
|
|
|
if (!strategy) { |
|
|
alert('Please enter a mitigation strategy'); |
|
|
return; |
|
|
} |
|
|
|
|
|
const riskText = riskSelect.options[riskSelect.selectedIndex].text; |
|
|
|
|
|
|
|
|
const planItem = document.createElement('div'); |
|
|
planItem.className = 'p-3 border rounded-lg bg-gray-50'; |
|
|
planItem.innerHTML = ` |
|
|
<div class="flex justify-between items-start"> |
|
|
<div> |
|
|
<h5 class="font-medium">${riskText}</h5> |
|
|
<p class="text-sm text-gray-600 mt-1">${strategy}</p> |
|
|
</div> |
|
|
<div class="text-right"> |
|
|
<span class="text-sm font-medium">$${cost}</span> |
|
|
<button class="ml-2 text-red-500 text-sm remove-plan-item">×</button> |
|
|
</div> |
|
|
</div> |
|
|
`; |
|
|
|
|
|
|
|
|
document.getElementById('plan-items').appendChild(planItem); |
|
|
|
|
|
|
|
|
document.getElementById('mitigation-plan').classList.remove('hidden'); |
|
|
|
|
|
|
|
|
document.getElementById('mitigation-strategy').value = ''; |
|
|
document.getElementById('mitigation-cost').value = ''; |
|
|
|
|
|
|
|
|
planItem.querySelector('.remove-plan-item').addEventListener('click', function() { |
|
|
planItem.remove(); |
|
|
if (document.getElementById('plan-items').children.length === 0) { |
|
|
document.getElementById('mitigation-plan').classList.add('hidden'); |
|
|
} |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
document.getElementById('save-plan').addEventListener('click', function() { |
|
|
alert('Mitigation plan saved!'); |
|
|
}); |
|
|
</script> |
|
|
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=alterzick/cementing" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
|
|
</html> |