127 lines
23 KiB
Vue
127 lines
23 KiB
Vue
<template>
|
|
<uni-tabbar class="myCustomTabbar uni-tabbar"
|
|
:style="{ flexDirection: direction === 'horizontal' ? 'row' : 'column' }">
|
|
<div class="uni-tabbar__item" v-for="(item, index) in tabItems" :key="index" @click="handleTabItemTap(item)"
|
|
:class="{ 'call-phone-item': item.phoneIcon }">
|
|
<div class="uni-tabbar__bd">
|
|
<div class="uni-tabbar__icon">
|
|
<template v-if="index === 0">
|
|
<svg v-if="selected !== 0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36" height="37.165863037109375" viewBox="0 0 36 37.165863037109375"><path d="M15.746513,0.6795578L1.7864151,10.056797C0.68031693,10.799778,0,12.055107,0,13.387577L0,33.190182C0,35.399319,1.753376,37.165852,3.962513,37.165852L32.037483,37.165852C34.246628,37.165852,35.999992,35.399319,35.999992,33.190174L36,13.387577C36,12.055107,35.319679,10.799778,34.213585,10.056797L20.253487,0.6795578C18.904587,-0.22652054,17.095413,-0.22652054,15.746513,0.6795578ZM11.509197,8.9468002L18,4.5868187L24.490803,8.9468002L31.5,13.654999L31.5,24.211292L31.499992,32.665852L4.5,32.665852L4.5,13.654999L11.509197,8.9468002Z" fill-rule="evenodd" fill="#0A0F16" fill-opacity="1" style="mix-blend-mode:passthrough"/></svg>
|
|
<svg v-else xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36" height="37.16583251953125" viewBox="0 0 36 37.16583251953125"><defs><linearGradient x1="-0.2894684672355652" y1="0.05263156071305275" x2="-0.2894684672355652" y2="0.9999999403953552" id="master_svg0_9_4369"><stop offset="0%" stop-color="#FFFFFF" stop-opacity="1"/><stop offset="100%" stop-color="#FFFFFF" stop-opacity="0"/></linearGradient></defs><path d="M15.746513,0.6795578C12.125664,3.1117439,5.0852432,7.8409157,1.7864151,10.056797C0.68031693,10.799778,0,12.055107,0,13.387577C0,17.722866,0,27.628902,0,33.190182C0,35.399319,1.753376,37.165852,3.962513,37.165852C10.887486,37.165852,25.112514,37.165852,32.037483,37.165852C34.246628,37.165852,35.999992,35.399319,35.999992,33.190174C36,27.628902,36,17.722866,36,13.387577C36,12.055107,35.319679,10.799778,34.213585,10.056797C30.914757,7.8409157,23.874336,3.1117439,20.253487,0.6795578C18.904587,-0.22652054,17.095413,-0.22652054,15.746513,0.6795578Z" fill="#F0282E" fill-opacity="1" style="mix-blend-mode:passthrough"/><path d="M15.746513,0.6795578L1.7864151,10.056797C0.68031693,10.799778,0,12.055107,0,13.387577L0,33.190182C0,35.399319,1.753376,37.165852,3.962513,37.165852L32.037483,37.165852C34.246628,37.165852,35.999992,35.399319,35.999992,33.190174L36,13.387577C36,12.055107,35.319679,10.799778,34.213585,10.056797L20.253487,0.6795578C18.904587,-0.22652054,17.095413,-0.22652054,15.746513,0.6795578ZM17.976913,3.9999962L11.2304,8.5317459L4.0168114,13.377235L4,13.387577L4,33.165852L31.999992,33.165852L32,24.211292L32,13.387577L31.983192,13.377235L18.023087,3.9999962Q18,3.9844894,17.976913,3.9999962Z" fill-rule="evenodd" fill="#F0282E" fill-opacity="1" style="mix-blend-mode:passthrough"/><path d="M15.75044631958,18.16585162729492Q15.75044631958,18.055339827294922,15.76128006,17.94535822729492Q15.7721138,17.83537672729492,15.793674469,17.726985927294923Q15.815231323,17.61859512729492,15.847312927,17.512840227294923Q15.87939453,17.407085427294923,15.92168427,17.304985027294922Q15.96397781,17.20288462729492,16.016071320000002,17.10542292729492Q16.06816864,17.007957427294922,16.12956619,16.91606902729492Q16.19096375,16.82418060729492,16.26107407,16.738750457294923Q16.33118057,16.653324127294923,16.40932465,16.575180057294922Q16.48746872,16.49703597729492,16.57289886,16.426925657294923Q16.6583252,16.356815337294922,16.7502136,16.295417787294923Q16.842102099999998,16.23402023729492,16.9395676,16.181926727294922Q17.0370331,16.12982940729492,17.1391335,16.08753967729492Q17.2412338,16.045246127294924,17.3469887,16.01316452029492Q17.4527435,15.981086731294923,17.5611343,15.959526062294922Q17.6695213,15.937965393294922,17.7795029,15.927135467294923Q17.8894844,15.916301727294922,17.9999962,15.916301727294922Q18.1105118,15.916301727294922,18.2204933,15.927135467294923Q18.3304749,15.937965393294922,18.4388618,15.959526062294922Q18.5472527,15.981086731294923,18.6530075,16.01316452029492Q18.758762400000002,16.045246127294924,18.8608627,16.08753967729492Q18.9629631,16.12982940729492,19.0604286,16.181926727294922Q19.1578941,16.23402023729492,19.2497826,16.295417787294923Q19.341670999999998,16.356815337294922,19.4270973,16.426925657294923Q19.5125275,16.49703597729492,19.5906715,16.575180057294922Q19.6688156,16.653324127294923,19.7389221,16.738750457294923Q19.8090324,16.82418060729492,19.87043,16.91606902729492Q19.9318275,17.007957427294922,19.983924899999998,17.10542292729492Q20.0360184,17.20288462729492,20.0783119,17.304985027294922Q20.1206017,17.407085427294923,20.1526833,17.512840227294923Q20.1847649,17.61859512729492,20.2063217,17.726985927294923Q20.2278824,17.83537672729492,20.2387161,17.94535822729492Q20.249549899999998,18.055339827294922,20.249549899999998,18.16585162729492L20.249549899999998,18.16585162729492L20.25,37.16585172729492L15.75,37.16585172729492L15.75044631958,18.16585162729492L15.75044631958,18.16585162729492Z" fill-rule="evenodd" fill="url(#master_svg0_9_4369)" fill-opacity="1" style="mix-blend-mode:passthrough"/></svg>
|
|
</template>
|
|
<template v-if="index === 1">
|
|
<svg v-if="selected !== 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36.5" height="38.5" viewBox="0 0 36.5 38.5"><rect x="2.25" y="2.25" width="32" height="34" rx="4" fill-opacity="0" stroke-opacity="1" stroke="#0A0F16" fill="none" stroke-width="4.5"/><path d="M11.25,24.5L20.25,24.5L20.25,24.4995501Q20.3605137,24.4995501,20.470495200000002,24.488718Q20.580475800000002,24.4778857,20.6888647,24.4563255Q20.797254600000002,24.4347656,20.903009400000002,24.4026852Q21.0087643,24.370605,21.1108646,24.3283131Q21.212966899999998,24.2860217,21.310431,24.2339261Q21.407895,24.1818304,21.499783,24.1204324Q21.591670999999998,24.0590346,21.677099,23.9889257Q21.762527,23.918816800000002,21.840671999999998,23.840672Q21.918818,23.7625275,21.988926,23.6770995Q22.059034,23.5916715,22.120432,23.4997829Q22.181829999999998,23.4078946,22.233926,23.3104305Q22.286020999999998,23.2129665,22.328312,23.11086547Q22.370604,23.00876451,22.402684,22.90300989Q22.434765,22.79725528,22.456325,22.68886542Q22.477885,22.58047563,22.488718,22.47049446Q22.49955,22.36051331,22.49955,22.25Q22.49955,22.13948669,22.488718,22.02950554Q22.477884,21.91952437,22.456324000000002,21.81113458Q22.434764,21.70274472,22.402683,21.59699011Q22.370604,21.49123549,22.328312,21.38913453Q22.286020999999998,21.2870335,22.233926,21.1895695Q22.181829999999998,21.0921054,22.120432,21.0002171Q22.059034,20.9083285,21.988926,20.8229005Q21.918818,20.7374725,21.840671999999998,20.659328Q21.762527,20.581183199999998,21.677099,20.5110743Q21.591670999999998,20.4409654,21.499783,20.3795677Q21.407895,20.3181698,21.310431,20.2660742Q21.212966899999998,20.2139785,21.1108646,20.1716871Q21.0087643,20.1293955,20.903009400000002,20.0973148Q20.797254600000002,20.0652347,20.6888647,20.0436745Q20.580475800000002,20.0221143,20.470495200000002,20.0112822Q20.3605137,20.0004499,20.25,20.0004499L20.25,20L11.25,20L11.25,20.0004499Q11.13948669,20.0004499,11.02950554,20.011282Q10.91952437,20.0221143,10.81113458,20.0436745Q10.70274472,20.0652344,10.59699011,20.0973148Q10.49123549,20.129395,10.38913453,20.1716869Q10.2870335,20.2139783,10.1895695,20.2660739Q10.0921054,20.3181696,10.0002171,20.3795676Q9.9083285,20.4409654,9.8229005,20.5110743Q9.737472499999999,20.581183199999998,9.659328,20.659328Q9.5811832,20.7374725,9.5110743,20.8229005Q9.4409654,20.9083285,9.379567699999999,21.0002171Q9.3181698,21.0921054,9.2660742,21.1895695Q9.2139785,21.2870335,9.1716871,21.38913453Q9.129395500000001,21.49123549,9.0973148,21.59699011Q9.0652347,21.70274472,9.0436745,21.81113458Q9.0221143,21.91952437,9.0112822,22.02950554Q9.0004499,22.13948669,9.0004499,22.25Q9.0004499,22.36051331,9.011282,22.47049446Q9.0221143,22.58047563,9.0436745,22.68886542Q9.0652344,22.79725528,9.0973148,22.90300989Q9.129395,23.00876451,9.171686900000001,23.11086547Q9.2139783,23.2129665,9.2660739,23.3104305Q9.318169600000001,23.4078946,9.3795676,23.4997829Q9.4409654,23.5916715,9.5110743,23.6770995Q9.5811832,23.7625275,9.659328,23.840672Q9.737472499999999,23.918816800000002,9.8229005,23.9889257Q9.9083285,24.0590346,10.0002171,24.1204323Q10.0921054,24.1818302,10.1895695,24.2339258Q10.2870335,24.2860215,10.38913453,24.3283129Q10.49123549,24.3706045,10.59699011,24.4026852Q10.70274472,24.4347653,10.81113458,24.4563255Q10.91952437,24.4778857,11.02950554,24.4887178Q11.13948669,24.4995501,11.25,24.4995501L11.25,24.5Z" fill-rule="evenodd" fill="#0A0F16" fill-opacity="1"/><path d="M11.25,14.5L25.25,14.5L25.25,14.4995501Q25.360514000000002,14.4995501,25.470494000000002,14.488718Q25.580476,14.4778857,25.688865,14.4563255Q25.797255,14.4347656,25.903010000000002,14.4026852Q26.008764,14.370605,26.110865,14.328313099999999Q26.212967,14.2860217,26.310431,14.2339261Q26.407894,14.181830399999999,26.499782,14.1204324Q26.591670999999998,14.0590346,26.677099,13.9889257Q26.762527,13.9188168,26.840671999999998,13.840672Q26.918818,13.762527500000001,26.988925000000002,13.6770995Q27.059034,13.5916715,27.120431,13.4997829Q27.181829,13.4078946,27.233925,13.3104305Q27.286022,13.2129665,27.328312,13.11086547Q27.370605,13.00876451,27.402685,12.90300989Q27.434767,12.79725528,27.456326,12.68886542Q27.477886,12.58047563,27.48872,12.47049446Q27.49955,12.36051331,27.49955,12.25Q27.49955,12.13948669,27.488718,12.02950554Q27.477886,11.91952437,27.456326,11.81113458Q27.434767,11.70274472,27.402687,11.59699011Q27.370605,11.49123549,27.328312,11.38913453Q27.28602,11.2870335,27.233924000000002,11.1895695Q27.181829,11.0921054,27.120431,11.0002171Q27.059033,10.9083285,26.988925000000002,10.8229005Q26.918816,10.737472499999999,26.840671,10.659328Q26.762526,10.5811832,26.677098,10.5110743Q26.591669,10.4409654,26.499781,10.379567699999999Q26.407893,10.3181698,26.310429,10.2660742Q26.212965,10.2139785,26.110864,10.1716871Q26.008764,10.129395500000001,25.903009,10.0973148Q25.797255,10.0652347,25.688865,10.0436745Q25.580476,10.0221143,25.470495,10.0112822Q25.360514000000002,10.0004499,25.25,10.0004499L25.25,10L11.25,10L11.25,10.0004499Q11.13948669,10.0004499,11.02950554,10.011282Q10.91952437,10.0221143,10.81113458,10.0436745Q10.70274472,10.0652344,10.59699011,10.0973148Q10.49123549,10.129395,10.38913453,10.171686900000001Q10.2870335,10.2139783,10.1895695,10.2660739Q10.0921054,10.318169600000001,10.0002171,10.3795676Q9.9083285,10.4409654,9.8229005,10.5110743Q9.737472499999999,10.5811832,9.659328,10.659328Q9.5811832,10.737472499999999,9.5110743,10.8229005Q9.4409654,10.9083285,9.379567699999999,11.0002171Q9.3181698,11.0921054,9.2660742,11.1895695Q9.2139785,11.2870335,9.1716871,11.38913453Q9.129395500000001,11.49123549,9.0973148,11.59699011Q9.0652347,11.70274472,9.0436745,11.81113458Q9.0221143,11.91952437,9.0112822,12.02950554Q9.0004499,12.13948669,9.0004499,12.25Q9.0004499,12.36051331,9.011282,12.47049446Q9.0221143,12.58047563,9.0436745,12.68886542Q9.0652344,12.79725528,9.0973148,12.90300989Q9.129395,13.00876451,9.171686900000001,13.11086547Q9.2139783,13.2129665,9.2660739,13.3104305Q9.318169600000001,13.4078946,9.3795676,13.4997829Q9.4409654,13.5916715,9.5110743,13.6770995Q9.5811832,13.762527500000001,9.659328,13.840672Q9.737472499999999,13.9188168,9.8229005,13.9889257Q9.9083285,14.0590346,10.0002171,14.120432300000001Q10.0921054,14.1818302,10.1895695,14.2339258Q10.2870335,14.2860215,10.38913453,14.3283129Q10.49123549,14.370604499999999,10.59699011,14.4026852Q10.70274472,14.4347653,10.81113458,14.4563255Q10.91952437,14.4778857,11.02950554,14.4887178Q11.13948669,14.4995501,11.25,14.4995501L11.25,14.5Z" fill-rule="evenodd" fill="#0A0F16" fill-opacity="1"/></svg>
|
|
<svg v-else xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="36.5" height="38.5" viewBox="0 0 36.5 38.5"><defs><linearGradient x1="1.1548548936843872" y1="0" x2="-0.07156175374984741" y2="-0.21790671348571777" id="master_svg0_9_6558"><stop offset="0%" stop-color="#FFFFFF" stop-opacity="0"/><stop offset="100%" stop-color="#FFFFFF" stop-opacity="1"/></linearGradient><linearGradient x1="1.3314998149871826" y1="0.20408163964748383" x2="0" y2="0.5" id="master_svg1_9_6562"><stop offset="0%" stop-color="#FFFFFF" stop-opacity="0"/><stop offset="100%" stop-color="#FFFFFF" stop-opacity="1"/></linearGradient></defs><rect x="2.25" y="2.25" width="32" height="34" rx="4" fill="#F0282E" fill-opacity="1"/><rect x="2.25" y="2.25" width="32" height="34" rx="4" fill-opacity="0" stroke-opacity="1" stroke="#F0282E" fill="none" stroke-width="4.5"/><path d="M10.25,15.5L28.25,15.5L28.25,15.4995501Q28.360516,15.4995501,28.470495,15.488718Q28.580477,15.4778857,28.688866,15.4563255Q28.797256,15.4347656,28.903011,15.4026852Q29.008766,15.370605,29.110865,15.328313099999999Q29.212967,15.2860217,29.310431,15.2339261Q29.407894,15.181830399999999,29.499783,15.1204324Q29.591671,15.0590346,29.677099,14.9889257Q29.762527,14.9188168,29.840672,14.840672Q29.918816,14.762527500000001,29.988926,14.6770995Q30.059032,14.5916715,30.12043,14.4997829Q30.181829,14.4078946,30.233925,14.3104305Q30.286022,14.2129665,30.328312,14.11086547Q30.370605,14.00876451,30.402687,13.90300989Q30.434767,13.79725528,30.456326,13.68886542Q30.477886,13.58047563,30.48872,13.47049446Q30.49955,13.36051331,30.49955,13.25Q30.49955,13.13948669,30.48872,13.02950554Q30.477886,12.91952437,30.456326,12.81113458Q30.434767,12.70274472,30.402685,12.59699011Q30.370605,12.49123549,30.328312,12.38913453Q30.286022,12.2870335,30.233925,12.1895695Q30.181829,12.0921054,30.12043,12.0002171Q30.059032,11.9083285,29.988926,11.8229005Q29.918816,11.737472499999999,29.840672,11.659328Q29.762527,11.5811832,29.677099,11.5110743Q29.591671,11.4409654,29.499781,11.379567699999999Q29.407894,11.3181698,29.310431,11.2660742Q29.212967,11.2139785,29.110865,11.1716871Q29.008766,11.129395500000001,28.903011,11.0973148Q28.797256,11.0652347,28.688866,11.0436745Q28.580477,11.0221143,28.470495,11.0112822Q28.360516,11.0004499,28.25,11.0004499L28.25,11L10.25,11L10.25,11.0004499Q10.13948669,11.0004499,10.02950554,11.011282Q9.91952437,11.0221143,9.81113458,11.0436745Q9.70274472,11.0652344,9.59699011,11.0973148Q9.49123549,11.129395,9.38913453,11.171686900000001Q9.2870335,11.2139783,9.1895695,11.2660739Q9.0921054,11.318169600000001,9.0002171,11.3795676Q8.9083285,11.4409654,8.8229005,11.5110743Q8.737472499999999,11.5811832,8.659328,11.659328Q8.5811832,11.737472499999999,8.5110743,11.8229005Q8.4409654,11.9083285,8.379567699999999,12.0002171Q8.3181698,12.0921054,8.2660742,12.1895695Q8.2139785,12.2870335,8.1716871,12.38913453Q8.129395500000001,12.49123549,8.0973148,12.59699011Q8.0652347,12.70274472,8.0436745,12.81113458Q8.0221143,12.91952437,8.0112822,13.02950554Q8.0004499,13.13948669,8.0004499,13.25Q8.0004499,13.36051331,8.011282,13.47049446Q8.0221143,13.58047563,8.0436745,13.68886542Q8.0652344,13.79725528,8.0973148,13.90300989Q8.129395,14.00876451,8.171686900000001,14.11086547Q8.2139783,14.2129665,8.2660739,14.3104305Q8.318169600000001,14.4078946,8.3795676,14.4997829Q8.4409654,14.5916715,8.5110743,14.6770995Q8.5811832,14.762527500000001,8.659328,14.840672Q8.737472499999999,14.9188168,8.8229005,14.9889257Q8.9083285,15.0590346,9.0002171,15.120432300000001Q9.0921054,15.1818302,9.1895695,15.2339258Q9.2870335,15.2860215,9.38913453,15.3283129Q9.49123549,15.370604499999999,9.59699011,15.4026852Q9.70274472,15.4347653,9.81113458,15.4563255Q9.91952437,15.4778857,10.02950554,15.4887178Q10.13948669,15.4995501,10.25,15.4995501L10.25,15.5Z" fill-rule="evenodd" fill="url(#master_svg0_9_6558)" fill-opacity="1" style="mix-blend-mode:passthrough"/><path d="M10.25,25.5L20.25,25.5L20.25,25.4995501Q20.360514000000002,25.4995501,20.470495,25.488718Q20.580476,25.4778857,20.688865,25.4563255Q20.797255,25.4347656,20.903009,25.4026852Q21.008763000000002,25.370605,21.110864,25.3283131Q21.212965,25.2860217,21.310429,25.2339261Q21.407892,25.1818304,21.499781,25.1204324Q21.591669,25.0590346,21.677097,24.9889257Q21.762526,24.918816800000002,21.840671,24.840672Q21.918816,24.7625275,21.988924,24.6770995Q22.059032000000002,24.5916715,22.12043,24.4997829Q22.181828,24.4078946,22.233925,24.3104305Q22.28602,24.2129665,22.328311,24.11086547Q22.370604,24.00876451,22.402684999999998,23.90300989Q22.434765,23.79725528,22.456325,23.68886542Q22.477885,23.58047563,22.488718,23.47049446Q22.49955,23.36051331,22.49955,23.25Q22.49955,23.13948669,22.488717,23.02950554Q22.477884,22.91952437,22.456324000000002,22.81113458Q22.434765,22.70274472,22.402684,22.59699011Q22.370604,22.49123549,22.328312,22.38913453Q22.286020999999998,22.2870335,22.233925,22.1895695Q22.181829,22.0921054,22.120431,22.0002171Q22.059034,21.9083285,21.988925000000002,21.8229005Q21.918817,21.7374725,21.840671999999998,21.659328Q21.762527,21.581183199999998,21.677099,21.5110743Q21.591670999999998,21.4409654,21.499782,21.3795677Q21.407894,21.3181698,21.31043,21.2660742Q21.212966,21.2139785,21.110865,21.1716871Q21.008764,21.1293955,20.903009,21.0973148Q20.797255,21.0652347,20.688865,21.0436745Q20.580476,21.0221143,20.470495,21.0112822Q20.360514000000002,21.0004499,20.25,21.0004499L20.25,21L10.25,21L10.25,21.0004499Q10.13948669,21.0004499,10.02950554,21.011282Q9.91952437,21.0221143,9.81113458,21.0436745Q9.70274472,21.0652344,9.59699011,21.0973148Q9.49123549,21.129395,9.38913453,21.1716869Q9.2870335,21.2139783,9.1895695,21.2660739Q9.0921054,21.3181696,9.0002171,21.3795676Q8.9083285,21.4409654,8.8229005,21.5110743Q8.737472499999999,21.581183199999998,8.659328,21.659328Q8.5811832,21.7374725,8.5110743,21.8229005Q8.4409654,21.9083285,8.379567699999999,22.0002171Q8.3181698,22.0921054,8.2660742,22.1895695Q8.2139785,22.2870335,8.1716871,22.38913453Q8.129395500000001,22.49123549,8.0973148,22.59699011Q8.0652347,22.70274472,8.0436745,22.81113458Q8.0221143,22.91952437,8.0112822,23.02950554Q8.0004499,23.13948669,8.0004499,23.25Q8.0004499,23.36051331,8.011282,23.47049446Q8.0221143,23.58047563,8.0436745,23.68886542Q8.0652344,23.79725528,8.0973148,23.90300989Q8.129395,24.00876451,8.171686900000001,24.11086547Q8.2139783,24.2129665,8.2660739,24.3104305Q8.318169600000001,24.4078946,8.3795676,24.4997829Q8.4409654,24.5916715,8.5110743,24.6770995Q8.5811832,24.7625275,8.659328,24.840672Q8.737472499999999,24.918816800000002,8.8229005,24.9889257Q8.9083285,25.0590346,9.0002171,25.1204323Q9.0921054,25.1818302,9.1895695,25.2339258Q9.2870335,25.2860215,9.38913453,25.3283129Q9.49123549,25.3706045,9.59699011,25.4026852Q9.70274472,25.4347653,9.81113458,25.4563255Q9.91952437,25.4778857,10.02950554,25.4887178Q10.13948669,25.4995501,10.25,25.4995501L10.25,25.5Z" fill-rule="evenodd" fill="url(#master_svg1_9_6562)" fill-opacity="1"/></svg>
|
|
</template>
|
|
<template v-if="index === 2">
|
|
<!-- <svg v-if="selected !== 2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="32.5" height="37.375" viewBox="0 0 32.5 37.375"><path d="M16.25,23.372879028320312Q9.959774,23.372879028320312,4.1986771,25.84192652832031L3.5757675,26.108886728320314Q1.9648666,26.79927062832031,0.9926796,28.23932642832031Q0,29.70973202832031,0,31.477073628320312L0,31.49911502832031Q0,33.927048028320314,1.7140579,35.64847602832031Q3.4331779,37.375000028320315,5.864624,37.375000028320315L16.25,37.375000028320315L26.635376,37.375000028320315Q29.066818,37.375000028320315,30.785942,35.64847602832031Q32.5,33.927048028320314,32.5,31.49911502832031L32.5,31.477073628320312Q32.499992,29.709724428320314,31.507317,28.23932642832031Q30.535133,26.79927062832031,28.924232,26.108886728320314L28.301323,25.84192652832031Q22.540222,23.372879028320312,16.25,23.372879028320312ZM5.3484077,30.245040928320314L5.9713211,29.97807312832031Q10.883438,27.872879028320312,16.25,27.872879028320312Q21.616562,27.872879028320312,26.528679,29.97807312832031L27.151588,30.245040928320314Q27.999992,30.608642528320313,28,31.477073628320312L28,31.49911502832031Q28,32.068740828320315,27.597137,32.47333522832031Q27.197197,32.875000028320315,26.635376,32.875000028320315L16.25,32.875000028320315L5.864624,32.875000028320315Q5.302803,32.875000028320315,4.9028625,32.47333522832031Q4.5,32.068740828320315,4.5,31.49911502832031L4.5,31.477073628320312Q4.5,30.608642528320313,5.3484077,30.245040928320314Z" fill-rule="evenodd" fill="#0A0F16" fill-opacity="1" style="mix-blend-mode:passthrough"/><ellipse cx="16.25" cy="13.125" rx="9.75" ry="9.75" fill-opacity="0" stroke-opacity="1" stroke="#0A0F16" fill="none" stroke-width="4.5" style="mix-blend-mode:passthrough"/></svg> -->
|
|
<image v-if="selected !== 2" src="/static/tabbar/user2.png"></image>
|
|
<image v-else src="/static/tabbar/user.png"></image>
|
|
</template>
|
|
|
|
<!-- <uv-icon v-if="showIcon" :name="item.icon" custom-prefix="custom-icon" :size="item.size || 20" :color="themeInfo.iconColor"></uv-icon> -->
|
|
</div>
|
|
<div class="uni-tabbar__label" :style="{ fontSize: '10px', color: selected === index ? '#fb322e' : '#000000' }">
|
|
{{ item.label }}</div>
|
|
</div>
|
|
</div>
|
|
</uni-tabbar>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, computed } from 'vue';
|
|
import { defineProps, defineEmits } from 'vue';
|
|
import { isXiaohongshu } from "@/config/index.js";
|
|
|
|
// 主题色配置
|
|
import { useMainStore } from "@/store/index.js"
|
|
const { themeInfo } = useMainStore();
|
|
import { useI18n } from 'vue-i18n';
|
|
const { t } = useI18n();
|
|
|
|
const props = defineProps({
|
|
direction: {
|
|
type: String,
|
|
default: 'horizontal',
|
|
},
|
|
showIcon: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
selected: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['onTabItemTap']);
|
|
|
|
const tabItems = computed(() => {
|
|
if (isXiaohongshu) {
|
|
return [
|
|
{ label: t('tabbar.home'), icon: 'home1', index: 0, pagePath: 'pages/index/index' },
|
|
{ label: '', icon: 'telephone', index: 2, pagePath: '', size: 34, phoneIcon: true },
|
|
{ label: t('tabbar.book'), icon: 'book', index: 1, pagePath: 'pages/book/index' },
|
|
]
|
|
} else {
|
|
return [
|
|
{ label: t('tabbar.home'), icon: '/static/tabbar/home.svg', index: 0, pagePath: 'pages/index/index' },
|
|
// { label: t('tabbar.book'), icon: 'book', index:1, pagePath:'pages/book/index'},
|
|
// { label: '', icon: 'telephone', index:2, pagePath:'', size: 34, phoneIcon: true },
|
|
{ label: "订单", icon: '/static/tabbar/order.svg', index: 3, pagePath: 'pages/unlock/index' },
|
|
{ label: t('tabbar.personal'), icon: '/static/tabbar/user.svg', index: 4, pagePath: 'pages/personal/index' },
|
|
]
|
|
}
|
|
});
|
|
|
|
const handleTabItemTap = (index) => {
|
|
emit('onTabItemTap', index);
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.myCustomTabbar {
|
|
display: flex;
|
|
}
|
|
|
|
.uni-tabbar {
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
z-index: 998;
|
|
}
|
|
|
|
.uni-tabbar__item {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
font-size: 0;
|
|
padding: 0;
|
|
text-align: center;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
|
|
.uni-tabbar__bd {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
font-size: 0;
|
|
text-align: center;
|
|
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
|
}
|
|
|
|
svg {
|
|
max-width: 100%;
|
|
height: 40rpx;
|
|
width: 40rpx;
|
|
}
|
|
image{
|
|
max-width: 100%;
|
|
height: 42rpx;
|
|
width: 38rpx;
|
|
}
|
|
</style>
|