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

master
mahdi 2 years ago
parent fa0d709565
commit 3efe399fe8
  1. 2
      src/components/CustomSelectBox/index.js
  2. 51
      src/components/RadioButton/index.js
  3. 120
      src/components/Settingss/index.js

@ -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}

@ -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>

@ -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" },

Loading…
Cancel
Save