add Rule Control
This commit is contained in:
parent
f0b60d145e
commit
628e279363
40
src/lib/components/RuleControl.svelte
Normal file
40
src/lib/components/RuleControl.svelte
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
<script>
|
||||||
|
import { createEventDispatcher } from 'svelte';
|
||||||
|
|
||||||
|
export let ruleName;
|
||||||
|
export let title
|
||||||
|
export let value;
|
||||||
|
export let min;
|
||||||
|
export let max;
|
||||||
|
export let step;
|
||||||
|
export let condition;
|
||||||
|
|
||||||
|
const dispatch = createEventDispatcher();
|
||||||
|
|
||||||
|
function changeRuleCondition(newCondition) {
|
||||||
|
dispatch('changeCondition', { rule: ruleName, condition: newCondition });
|
||||||
|
}
|
||||||
|
|
||||||
|
function changeValue(event) {
|
||||||
|
dispatch('changeValue', { rule: ruleName, value: Number(event.target.value) });
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
||||||
|
{title} {condition} {value}
|
||||||
|
|
||||||
|
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
||||||
|
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2"
|
||||||
|
checked={condition === 'below'} name={ruleName} />
|
||||||
|
<span class="label-text text-white">Below</span>
|
||||||
|
</label>
|
||||||
|
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
||||||
|
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2"
|
||||||
|
checked={condition === 'above'} name={ruleName} />
|
||||||
|
<span class="label-text text-white">Above</span>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="w-full pt-5">
|
||||||
|
<input type="range" min={min} max={max} step={step} bind:value on:input={changeValue} class="range range-secondary" />
|
||||||
|
</div>
|
||||||
@ -4,7 +4,7 @@
|
|||||||
import { screenWidth, strategyId, numberOfUnreadNotification, getCache, setCache} from '$lib/store';
|
import { screenWidth, strategyId, numberOfUnreadNotification, getCache, setCache} from '$lib/store';
|
||||||
import toast from 'svelte-french-toast';
|
import toast from 'svelte-french-toast';
|
||||||
import { abbreviateNumber, formatRuleValue } from '$lib/utils';
|
import { abbreviateNumber, formatRuleValue } from '$lib/utils';
|
||||||
|
import RuleControl from '$lib/components/RuleControl.svelte';
|
||||||
|
|
||||||
//const userConfirmation = confirm('Unsaved changes detected. Leaving now will discard your strategy. Continue?');
|
//const userConfirmation = confirm('Unsaved changes detected. Leaving now will discard your strategy. Continue?');
|
||||||
|
|
||||||
@ -128,16 +128,16 @@ const getStockScreenerData = async (rules) => {
|
|||||||
|
|
||||||
|
|
||||||
let allRows = [
|
let allRows = [
|
||||||
{ rule: 'avgVolume', label: 'Average Volume',category: 'fund' },
|
{ rule: 'avgVolume', label: 'Avg Volume', category: 'fund' },
|
||||||
{ rule: 'rsi', label: 'Relative Strength Index (RSI)',category: 'ta' },
|
{ rule: 'rsi', label: 'Relative Strength Index (RSI)',category: 'ta' },
|
||||||
{ rule: 'stochRSI', label: 'Stochastic RSI Fast',category: 'ta' },
|
{ rule: 'stochRSI', label: 'Stochastic RSI Fast',category: 'ta' },
|
||||||
{ rule: 'mfi', label: 'Money Flow Index',category: 'ta' },
|
{ rule: 'mfi', label: 'Money Flow Index',category: 'ta' },
|
||||||
{ rule: 'cci', label: 'Commodity Channel Index',category: 'ta' },
|
{ rule: 'cci', label: 'Commodity Channel Index',category: 'ta' },
|
||||||
{ rule: 'atr', label: 'Average True Range (ATR)',category: 'ta' },
|
{ rule: 'atr', label: 'Average True Range (ATR)',category: 'ta' },
|
||||||
{ rule: 'sma50', label: '50-Day Simple Moving Average (SMA-50)',category: 'ta' },
|
{ rule: 'sma50', label: 'SMA-50', max: "500", min:"0", step:"10", category: 'ta' },
|
||||||
{ rule: 'sma200', label: '200-Day Simple Moving Average (SMA-200)',category: 'ta' },
|
{ rule: 'sma200', label: 'SMA-200', max: "500", min:"0", step:"10", category: 'ta' },
|
||||||
{ rule: 'ema50', label: '50-Day Exponential Moving Average (EMA-50)',category: 'ta' },
|
{ rule: 'ema50', label: 'EMA-50', max: "500", min:"0", step:"10", category: 'ta' },
|
||||||
{ rule: 'ema200', label: '200-Day Exponential Moving Average (EMA-200)',category: 'ta' },
|
{ rule: 'ema200', label: 'EMA-200', max: "500", min:"0", step:"10",category: 'ta' },
|
||||||
{ rule: 'change1W', label: 'Price Change 1W [%]',category: 'ta' },
|
{ rule: 'change1W', label: 'Price Change 1W [%]',category: 'ta' },
|
||||||
{ rule: 'change1M', label: 'Price Change 1M [%]',category: 'ta' },
|
{ rule: 'change1M', label: 'Price Change 1M [%]',category: 'ta' },
|
||||||
{ rule: 'change3M', label: 'Price Change 3M [%]',category: 'ta' },
|
{ rule: 'change3M', label: 'Price Change 3M [%]',category: 'ta' },
|
||||||
@ -188,9 +188,9 @@ const getStockScreenerData = async (rules) => {
|
|||||||
{ rule: 'returnOnAssets', label: 'Return on Assets',category: 'fund' },
|
{ rule: 'returnOnAssets', label: 'Return on Assets',category: 'fund' },
|
||||||
{ rule: 'returnOnEquity', label: 'Return on Equity',category: 'fund' },
|
{ rule: 'returnOnEquity', label: 'Return on Equity',category: 'fund' },
|
||||||
{ rule: 'enterpriseValue', label: 'Enterprise Value',category: 'fund' },
|
{ rule: 'enterpriseValue', label: 'Enterprise Value',category: 'fund' },
|
||||||
{ rule: 'freeCashFlowPerShare', label: 'FCF / Share', category: 'fund' },
|
{ rule: 'freeCashFlowPerShare', label: 'FCF / Share', max: "20", min:"-20", step:"0.5",category: 'fund' },
|
||||||
{ rule: 'cashPerShare', label: 'Cash / Share', category: 'fund' },
|
{ rule: 'cashPerShare', label: 'Cash / Share', max: "50", min:"-50", step:"1", category: 'fund' },
|
||||||
{ rule: 'priceToFreeCashFlowsRatio', label: 'Price / FCF', category: 'fund' },
|
{ rule: 'priceToFreeCashFlowsRatio', label: 'Price / FCF', max: "100", min:"-100", step:"2", category: 'fund' },
|
||||||
|
|
||||||
];
|
];
|
||||||
|
|
||||||
@ -819,6 +819,8 @@ const sortByMarketCap = (tickerList) => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$: {
|
$: {
|
||||||
if(order)
|
if(order)
|
||||||
{
|
{
|
||||||
@ -850,6 +852,209 @@ $: isSaved = !ruleOfList;
|
|||||||
$: charNumber = $screenWidth < 640 ? 20 : 40;
|
$: charNumber = $screenWidth < 640 ? 20 : 40;
|
||||||
|
|
||||||
|
|
||||||
|
function handleChangeCondition(event) {
|
||||||
|
ruleCondition[event.detail.rule] = event.detail.condition;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleChangeValue(event) {
|
||||||
|
const { rule, value } = event.detail;
|
||||||
|
if (rule in valueMappings) {
|
||||||
|
valueMappings[rule] = value;
|
||||||
|
// If you need to keep the separate variables in sync:
|
||||||
|
switch (rule) {
|
||||||
|
case 'payoutRatio':
|
||||||
|
valuePayoutRatio;
|
||||||
|
break;
|
||||||
|
case 'dividendGrowth':
|
||||||
|
valueDividendGrowth = value;
|
||||||
|
break;
|
||||||
|
case 'dividendYield':
|
||||||
|
valueDividendYield = value;
|
||||||
|
break;
|
||||||
|
case 'annualDividend':
|
||||||
|
valueAnnualDividend = value;
|
||||||
|
break;
|
||||||
|
case 'eps':
|
||||||
|
valueEPS = value;
|
||||||
|
break;
|
||||||
|
case 'growthEPS':
|
||||||
|
valueGrowthEPS = value;
|
||||||
|
break;
|
||||||
|
case 'marketCap':
|
||||||
|
valueMarketCap = value;
|
||||||
|
break;
|
||||||
|
case 'beta':
|
||||||
|
valueBeta = value;
|
||||||
|
break;
|
||||||
|
case 'pe':
|
||||||
|
valuePE = value;
|
||||||
|
break;
|
||||||
|
case 'forwardPE':
|
||||||
|
valueForwardPE = value;
|
||||||
|
break;
|
||||||
|
case 'priceToBookRatio':
|
||||||
|
valuePriceToBookRatio = value;
|
||||||
|
break;
|
||||||
|
case 'priceToSalesRatio':
|
||||||
|
valuePriceToSalesRatio = value;
|
||||||
|
break;
|
||||||
|
case 'interestIncome':
|
||||||
|
valueInterestIncome = value;
|
||||||
|
break;
|
||||||
|
case 'esgScore':
|
||||||
|
valueESGScore = value;
|
||||||
|
break;
|
||||||
|
case 'ratingRecommendation':
|
||||||
|
valueAnalyst //ruleTrend[ruleName] = value;
|
||||||
|
break;
|
||||||
|
case 'revenue':
|
||||||
|
valueRevenue = value;
|
||||||
|
break;
|
||||||
|
case 'growthRevenue':
|
||||||
|
valueGrowthRevenue = value;
|
||||||
|
break;
|
||||||
|
case 'ebitda':
|
||||||
|
valueEBITDA = value;
|
||||||
|
break;
|
||||||
|
case 'growthEBITDA':
|
||||||
|
valueGrowthEBITDA = value;
|
||||||
|
break;
|
||||||
|
case 'operatingExpenses':
|
||||||
|
valueOperatingExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'growthOperatingExpenses':
|
||||||
|
valueGrowthOperatingExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'costOfRevenue':
|
||||||
|
valueCostOfRevenue = value;
|
||||||
|
break;
|
||||||
|
case 'growthCostOfRevenue':
|
||||||
|
valueGrowthCostOfRevenue = value;
|
||||||
|
break;
|
||||||
|
case 'costAndExpenses':
|
||||||
|
valueCostAndExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'growthCostAndExpenses':
|
||||||
|
valueGrowthCostAndExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'netIncome':
|
||||||
|
valueNetIncome = value;
|
||||||
|
break;
|
||||||
|
case 'growthNetIncome':
|
||||||
|
valueGrowthNetIncome = value;
|
||||||
|
break;
|
||||||
|
case 'grossProfit':
|
||||||
|
valueGrossProfit = value;
|
||||||
|
break;
|
||||||
|
case 'growthGrossProfit':
|
||||||
|
valueGrowthGrossProfit = value;
|
||||||
|
break;
|
||||||
|
case 'researchAndDevelopmentExpenses':
|
||||||
|
valueResearchAndDevelopmentExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'growthResearchAndDevelopmentExpenses':
|
||||||
|
valueGrowthResearchAndDevelopmentExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'interestExpense':
|
||||||
|
valueInterestExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'growthInterestExpense':
|
||||||
|
valueGrowthInterestExpenses = value;
|
||||||
|
break;
|
||||||
|
case 'operatingIncome':
|
||||||
|
valueOperatingIncome = value;
|
||||||
|
break;
|
||||||
|
case 'growthOperatingIncome':
|
||||||
|
valueGrowthOperatingIncome = value;
|
||||||
|
break;
|
||||||
|
case 'rsi':
|
||||||
|
valueRSI = value;
|
||||||
|
break;
|
||||||
|
case 'stochRSI':
|
||||||
|
valueStochRSI = value;
|
||||||
|
break;
|
||||||
|
case 'mfi':
|
||||||
|
valueMFI = value;
|
||||||
|
break;
|
||||||
|
case 'cci':
|
||||||
|
valueCCI = value;
|
||||||
|
break;
|
||||||
|
case 'atr':
|
||||||
|
valueATR = value;
|
||||||
|
break;
|
||||||
|
case 'sma50':
|
||||||
|
valueSMA50 = value;
|
||||||
|
break;
|
||||||
|
case 'sma200':
|
||||||
|
valueSMA200 = value;
|
||||||
|
break;
|
||||||
|
case 'ema50':
|
||||||
|
valueEMA50 = value;
|
||||||
|
break;
|
||||||
|
case 'ema200':
|
||||||
|
valueEMA200 = value;
|
||||||
|
break;
|
||||||
|
case 'change1W':
|
||||||
|
valueChange1W = value;
|
||||||
|
break;
|
||||||
|
case 'change1M':
|
||||||
|
valueChange1M = value;
|
||||||
|
break;
|
||||||
|
case 'change3M':
|
||||||
|
valueChange3M = value;
|
||||||
|
break;
|
||||||
|
case 'change6M':
|
||||||
|
valueChange6M = value;
|
||||||
|
break;
|
||||||
|
case 'change1Y':
|
||||||
|
valueChange1Y = value;
|
||||||
|
break;
|
||||||
|
case 'change3Y':
|
||||||
|
valueChange3Y = value;
|
||||||
|
case 'avgVolume':
|
||||||
|
valueAvgVolume = value;
|
||||||
|
break;
|
||||||
|
case 'var':
|
||||||
|
valueVaR = value;
|
||||||
|
break;
|
||||||
|
case 'trendAnalysis':
|
||||||
|
valueTrendAnalysis = value;
|
||||||
|
break;
|
||||||
|
case 'fundamentalAnalysis':
|
||||||
|
valueFundamentalAnalysis = value;
|
||||||
|
break;
|
||||||
|
case 'currentRatio':
|
||||||
|
valueCurrentRatio = value;
|
||||||
|
break;
|
||||||
|
case 'quickRatio':
|
||||||
|
valueQuickRatio = value;
|
||||||
|
break;
|
||||||
|
case 'debtEquityRatio':
|
||||||
|
valueDebtEquityRatio = value;
|
||||||
|
break;
|
||||||
|
case 'debtRatio':
|
||||||
|
valueDebtRatio = value;
|
||||||
|
break;
|
||||||
|
case 'returnOnAssets':
|
||||||
|
valueReturnOnAssets = value;
|
||||||
|
break;
|
||||||
|
case 'returnOnEquity':
|
||||||
|
valueReturnOnEquity = value;
|
||||||
|
break;
|
||||||
|
case 'freeCashFlowPerShare':
|
||||||
|
valueFCFShare = value;
|
||||||
|
break;
|
||||||
|
case 'cashPerShare':
|
||||||
|
valueCashShare = value;
|
||||||
|
break;
|
||||||
|
case 'priceToFreeCashFlowsRatio':
|
||||||
|
valuePriceFCF = value;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
console.warn(`Unhandled rule: ${rule}`);
|
||||||
|
// Optionally handle unknown rules here
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
||||||
@ -983,74 +1188,7 @@ $: charNumber = $screenWidth < 640 ? 20 : 40;
|
|||||||
{/if}
|
{/if}
|
||||||
<!--End AI Trend Analysis Rule-->
|
<!--End AI Trend Analysis Rule-->
|
||||||
|
|
||||||
{#if ruleName === 'freeCashFlowPerShare'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
FCF / Share {ruleCondition[ruleName]} {valueFCFShare}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-below" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-above" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="-20" max="20" step="0.5" bind:value={valueFCFShare} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
{#if ruleName === 'cashPerShare'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
Cash / Share {ruleCondition[ruleName]} {valueCashShare}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-below" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-above" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="-50" max="50" step="1" bind:value={valueCashShare} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
{#if ruleName === 'priceToFreeCashFlowsRatio'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
Price / FCF {ruleCondition[ruleName]} {valuePriceFCF}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-below" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" name="radio-revenue-above" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="-100" max="100" step="2" bind:value={valuePriceFCF} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
|
|
||||||
|
|
||||||
{#if ruleName === 'revenue'}
|
{#if ruleName === 'revenue'}
|
||||||
@ -2234,106 +2372,27 @@ $: charNumber = $screenWidth < 640 ? 20 : 40;
|
|||||||
{/if}
|
{/if}
|
||||||
<!--End ATR Rule-->
|
<!--End ATR Rule-->
|
||||||
|
|
||||||
<!--Start SMA-50 Rule-->
|
|
||||||
{#if ruleName === 'sma50'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
SMA-50 {ruleCondition[ruleName]} {valueSMA50}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
{#if allRows.some(row => row.rule === ruleName)}
|
||||||
<input type="range" min="0" max="500" step="10" bind:value={valueSMA50} class="range range-secondary" />
|
{#each allRows as row (row.rule)}
|
||||||
</div>
|
{#if ruleName === row.rule}
|
||||||
|
<RuleControl
|
||||||
|
ruleName={row.rule}
|
||||||
|
title={row.label}
|
||||||
|
min={row.min}
|
||||||
|
max={row.max}
|
||||||
|
step={row.step}
|
||||||
|
bind:value={valueMappings[row.rule]}
|
||||||
|
bind:condition={conditions[row.rule]}
|
||||||
|
on:changeCondition={handleChangeCondition}
|
||||||
|
on:changeValue={handleChangeValue}
|
||||||
|
/>
|
||||||
{/if}
|
{/if}
|
||||||
<!--End SMA-50 Rule-->
|
{/each}
|
||||||
|
|
||||||
<!--Start SMA-200 Rule-->
|
|
||||||
{#if ruleName === 'sma200'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
SMA-200 {ruleCondition[ruleName]} {valueSMA200}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="0" max="500" step="10" bind:value={valueSMA200} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
{/if}
|
||||||
<!--End SMA-200 Rule-->
|
|
||||||
|
|
||||||
|
|
||||||
<!--Start EMA-50 Rule-->
|
|
||||||
{#if ruleName === 'ema50'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
EMA-50 {ruleCondition[ruleName]} {valueEMA50}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="0" max="500" step="10" bind:value={valueEMA50} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
<!--End SMA-50 Rule-->
|
|
||||||
|
|
||||||
<!--Start SMA-200 Rule-->
|
|
||||||
{#if ruleName === 'ema200'}
|
|
||||||
|
|
||||||
<div class="w-full max-w-xl text-white font-medium text-sm sm:text-[1rem] flex flex-row justify-center items-center">
|
|
||||||
EMA-200 {ruleCondition[ruleName]} {valueEMA200}
|
|
||||||
|
|
||||||
<label on:click={() => changeRuleCondition('below')} class="ml-5 cursor-pointer flex flex-row mr-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'below'} />
|
|
||||||
<span class="label-text text-white">Below</span>
|
|
||||||
</label>
|
|
||||||
<label on:click={() => changeRuleCondition('above')} class="cursor-pointer flex flex-row ml-2 justify-center items-center">
|
|
||||||
<input type="radio" class="radio checked:bg-purple-600 bg-[#09090B] border border-slate-800 mr-2" checked={ruleCondition[ruleName] === 'above'} />
|
|
||||||
<span class="label-text text-white">Above</span>
|
|
||||||
</label>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div class="w-full pt-5">
|
|
||||||
<input type="range" min="0" max="500" step="10" bind:value={valueEMA200} class="range range-secondary" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/if}
|
|
||||||
<!--End SMA-200 Rule-->
|
|
||||||
|
|
||||||
<!--Start Change 1W Rule-->
|
<!--Start Change 1W Rule-->
|
||||||
{#if ruleName === 'change1W'}
|
{#if ruleName === 'change1W'}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user