mahdi
/
sameh
1
0
Fork 0
Code Issues 4 Pull Requests Projects Releases Wiki Activity

update src/components/CustomSelectBox/index.js, src/components/RadioButton/index.js and src/components/Settingss/index.js

Browse Source
master
mahdi 2 years ago
parent fa0d709565
commit 3efe399fe8
3 changed files with 112 additions and 61 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/components/CustomSelectBox/index.js
  2. 51
      src/components/RadioButton/index.js
  3. 120
      src/components/Settingss/index.js

2
src/components/CustomSelectBox/index.js
Unescape View File

@ -2,7 +2,7 @@ import React from "react";
const CustomSelectBox = ({ options }) => {
return (
<select className="customizeSelect rounded text-xs text-[#00253A] py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent">
<select className="customizeSelect w-full rounded text-xs text-[#00253A] py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent">
{options.map((option, index) => (
<option className="text-black" key={index}>
{option.title}

51
src/components/RadioButton/index.js
Unescape View File

@ -2,30 +2,33 @@ import React from "react";
const RadioButton = () => {
return (
<div className="relative flex items-center justify-between rounded py-4 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex items-center justify-center flex-1 pl-5">
<input
id="default-radio-1"
type="radio"
value=""
name="default-radio"
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label for="default-radio-1" class="mr-2 text-xs text-[#00253A]">
بله
</label>
</div>
<div className="flex items-center justify-center flex-1 pl-5">
<input
id="default-radio-2"
type="radio"
value=""
name="default-radio"
class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
/>
<label for="default-radio-2" class="mr-2 text-xs text-[#00253A]">
خیر
</label>
<div className="relative">
<div className="flex items-center justify-between rounded py-4 bg-[#FBFBFB] focus:bg-[#f5f5f5] border border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex items-center justify-center flex-1 pl-5">
<input
id="default-radio-1"
type="radio"
value=""
name="default-radio"
class="w-4 h-4 cursor-pointer"
checked="checked"
/>
<label for="default-radio-1" class="mr-2 text-xs text-[#00253A]">
بله
</label>
</div>
<div className="flex items-center justify-center flex-1 pl-5">
<input
id="default-radio-2"
type="radio"
value=""
name="default-radio"
class="w-4 h-4 cursor-pointer"
/>
<label for="default-radio-2" class="mr-2 text-xs text-[#00253A]">
خیر
</label>
</div>
</div>
<div class="absolute top-0 transform -translate-y-2.5 -translate-x-2 px-2 z-10 bg-white">
<p className="text-xs text-[#00253A]">آیا قابلیت ارجاع دارد؟</p>

120
src/components/Settingss/index.js
Unescape View File

@ -10,26 +10,88 @@ const Settingss = ({ status }) => {
const { register, getValues } = useForm();
return (
<div className="w-full flex flex-row items-start justify-between mx-auto rounded-sm shadow-sm divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex-grow flex-1 flex flex-col pl-5">
<div className="flex flex-col gap-y-7">
<CustomSelectBox
options={[
{ title: "نام فرآیند" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<Input
register={register("lastName")}
label="توضیحات"
type="textarea"
borderClassname={`border border-red-[#E3E3E3] `}
/>
<div className="w-full flex flex-row items-start justify-between mx-auto divide-x-2 divide-[#E3E3E3] divide-x-reverse">
<div className="flex-grow flex-1 flex flex-col gap-y-7 pl-5">
<CustomSelectBox
options={[
{ title: "نام فرآیند" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<Input
register={register("lastName")}
label="توضیحات"
type="textarea"
borderClassname={`border border-red-[#E3E3E3] `}
/>
<CustomSelectBox
options={[
{ title: "اولویت دهی" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "نوع فرآیند" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<div className="flex items-center justify-between rounded py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent">
<p className="text-xs text-[#00253A] mr-5">وضیعت</p>
<div className="ml-1">
<CircleInCircle
parentClassName={`w-5 h-5 ${
status ? "bg-green-600" : "bg-red-600"
}`}
childClassName={false}
/>
</div>
</div>
<RadioButton />
<CustomSelectBox
options={[
{ title: "انتخاب نقش های قابل ارجاع" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "انتخاب نقش انجام دهنده" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
</div>
<div className="flex-grow flex-1 flex flex-col pr-5 gap-y-7">
<CustomSelectBox
options={[
{ title: "فرآیند مرجع" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<CustomSelectBox
options={[
{ title: "فرآیندهای لینک" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<div className="w-full flex items-center gap-x-3">
<CustomSelectBox
options={[
{ title: "اولویت دهی" },
{ title: "زمان تاخیر" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
@ -37,31 +99,17 @@ const Settingss = ({ status }) => {
/>
<CustomSelectBox
options={[
{ title: "نوع فرآیند" },
{ title: "مهلت انجام" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
]}
/>
<div className="flex items-center justify-between rounded py-2 bg-[#FBFBFB] border focus:bg-[#f5f5f5] border-[#DBDBDB] focus:border-[#DBDBDB] focus:ring-transparent">
<p className="text-xs text-[#00253A] mr-5">وضیعت</p>
<div className="ml-1">
<CircleInCircle
parentClassName={`w-5 h-5 ${
status ? "bg-green-600" : "bg-red-600"
}`}
childClassName={false}
/>
</div>
</div>
<RadioButton />
</div>
</div>
<div className="flex-grow flex-1 flex flex-col pr-5">
<div className="flex flex-col gap-y-7">
<div className="w-full flex items-center gap-x-3">
<CustomSelectBox
options={[
{ title: "انتخاب سرویس" },
{ title: "تایید خودکار" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },
@ -69,7 +117,7 @@ const Settingss = ({ status }) => {
/>
<CustomSelectBox
options={[
{ title: "انتخاب تابع" },
{ title: "انقضا" },
{ title: "شماره 1" },
{ title: "شماره 2" },
{ title: "شماره 3" },

Write Preview
Loading…
Cancel
Save