バイト、正社員含めこれまで飲食・アパレル・美容と完全接客業しかしたことがないアラフォー女が、とあるきっかけで2023年、全くの未経験でITエンジニアに転職。
完全文系、理系的な思考が苦手。(この時点で完全向いてないw)
とあるIT会社で勉強しながら働いてますが、ほぼ独学。
自分の勉強記録、復習用として書いてます。
<勉強中>
PHP、VUE、JS
・VisualStudioCode
・laravel
・Mysql
バリデーションの種類(リクエストファイル)
「php artisan make:request ファイル名」 でリクエストファイルを作成した上で。
// 必須 ＆ 最大文字数
'sr_code' => ['required', 'max:6'],
// ７桁ピッタリ必須（nullable）とセットで！
'sr_code' => ['required', 'max:6'],
// ７桁ピッタリ必須（nullable）とセットで！
'sr_association_zip_code' => ['nullable','digits:7'],
// Companiesテーブルに同じアドレスがあったら登録させない
'email'=>['string','max:255',Rule::unique(Company::class)->ignore($this->route('company'))],
※ignore = 無視する
->ignore()を使うとその条件は無視できる。
今回の ->ignore($this->route('company'))], は編集中のform（Companiesテーブル）のIDを取得しそのIDは重複しても可。にしている。
Rule::unique(Company::class)だけだと、メアド以外の項目変更した際に「メアドが重複している」のエラーがでてしまうのでそれを避けるため。
【nova】基礎
NOVA
nove DB
リソース = テーブル
フィールド = カラム
Http/app/Novaの中に管理画面左側のメニュー分のファイルがある。
基本
①モデル+マイグレファイル作成→マイグレする
②php artisan nova:resource 【アッパーキャメルファイル名(Testと仮定)】
③Http/app/Novaの中にTest.phpファイルができる
左側のメニューラベル変更 → labelに書く
public static function label(){
return 'テスト用';
}
新規作成の中身作成 → fieldsに書く
public function fields(NovaRequest $request)
{
return [
ID::make()->sortable(), // IDメソッド
Text::make('名前','name'), // Textメソッド
DateTime::make('日付と時間','time') //DateTimeメソッド
->step(CarbonInterval::minute(5))
->sortable(),
];
}
];
}
Article.phpの中
public function fieldsForIndex(NovaRequest $request){
fieldsForIndex
このメソッドは、管理画面の一覧ページで表示されるものを定義
public function fieldsForDetail(NovaRequest $request){
fieldsForDetail
このメソッドは、管理画面の詳細ページ(👁マーククリック先)で表示されるものを定義
public function fields(NovaRequest $request)
fields
このメソッドは、新規作成で表示されるものを定義
※一覧ページや詳細ページなど、どのページでも共通して表示されるフィールドを定義
【よく使いそうなメソッドの種類】
Text::make('名前','name')
->hideFromIndex() // リストの時に隠す
->hideFromDetail() // 詳細の時に隠す
->hideWhenCreating() // 新規登録の時に隠す
->hideWhenUpdating() // 編集のときに隠す
->filterble() // フィルター検索
->sortable() // リストの時に並び替えできる
->dependsOn('category','notice'), // 選んだカテゴリー条件追加
->readonly() // 詳細しか見れない、編集も削除もできない
Textarea::make('営業種目', 'business_item')
->alwaysShow() //Textareaは詳細で「コンテンツを表示」になるので、これで普通に表示される
Text::make('代表者生年月日','representative.birthdate')
// DB「1970/02/20 生」のデータを、生を除外して「1970/02/20」で表示させる(get attributeでも可能)
// DB「1970/02/20 生」のデータを、生を除外して「1970/02/20」で表示させる(get attributeでも可能)
->onlyOnIndex(), // インデックスのみ表示
DateTime::make('公開日時設定','opened_at')
->step(CarbonInterval::minutes(1)) // 時間を1分単位で選べる
->rules('required') // 必須の赤※印の表示だが、バリデーションを手動で指定する為、独自のルールを決められる
->options(config('params.category'))
//インデックスと詳細ページでは、キーが表示されるので、=>右のvalue(ラベル)を表示する場合はこのオプションを使う
//インデックスと詳細ページでは、キーが表示されるので、=>右のvalue(ラベル)を表示する場合はこのオプションを使う
->displayUsingLabels()
->placeholder('選択してください') // 初期値
->options([ // 新規作成や編集時に選択可能なものを設定する
0 => '未処理', // 「未処理」を選択したらDBには０が登録される
1 => '電話済み', // 「電話済み」を選択したらDBには１が登録される
2 => 'DM済み', // 「DM済み」を選択したらDBには２が登録される
])
//インデックスと詳細ページでは、キー(0〜2)が表示されるので、=>右のラベルを表示する場合はこのオプションを使う
//インデックスと詳細ページでは、キー(0〜2)が表示されるので、=>右のラベルを表示する場合はこのオプションを使う
->displayUsingLabels()
->required(), // 必須の赤※印の表示
【ddやconsoleの代わりにデータの中身を確認する方法】
logを使う。
fieldsのreturnの前に
$data = Test::all(); // データベースからデータを取得
でlaravel.logで確認できる。
【リレーションの書き方】
// 引数の基本
BelongsToMany::make($name, $relationship, $resource)
// 書き方①
BelongsToMany::make('業種', 'industry', 'App\Nova\Industry'),
// 書き方②
BelongsToMany::make($name, $relationship, $resource)
// 書き方①
BelongsToMany::make('業種', 'industry', 'App\Nova\Industry'),
// 書き方②
BelongsToMany::make('Tags', 'tags', Tag::class),
$name:
表示されるリレーションフィールドの名前を指定。Novaのフォームに表示されるテキスト。
$relationship:
Eloquentモデルに定義されている多対多のリレーションメソッドを指定。これにより、Novaはどの関連データを取得するかを知ることができる。
$resource:
多対多のリレーションで関連付けられたリソースを指定。これにより、関連データが表示される際にどのNovaリソースを使用するかを定義。
// 引数の基本
BelongsTo::make($name, $attribute = null, $resource = null)
// 書き方①
BelongsTo::make('Company')->sortable()->filterable()->readonly(),
BelongsTo::make($name, $attribute = null, $resource = null)
// 書き方①
BelongsTo::make('Company')->sortable()->filterable()->readonly(),
// 書き方②
BelongsTo::make('User', 'user', User::class),
BelongsTo::make('User', 'user', User::class),
$name:
リレーションフィールドの名前を指定。Novaのフォームに表示されるテキスト。
$attribute:
リレーション先のモデルで、表示したい属性の名前を指定します。この属性が表示される。省略された場合、デフォルトではリレーション先のモデルの__toString メソッドが呼ばれる。
$resource:
リレーション先のリソースを指定。このリソースが関連するデータの詳細などの表示に使用される。省略された場合、Novaはリレーション先のモデルクラスから自動的にリソースを推定しようとする。
【コードの意味】
URL::make('記事タイトルリンク先','url')
->hide() // 初期状態では非表示
->dependsOn('category', // カテゴリによって表示、非表示の切り替え
function(Url $field,NovaRequest $request,FormData $formData){
// カテゴリが【重要なお知らせ】だったら表示させる
// カテゴリが【重要なお知らせ】だったら表示させる
if($formData->category == 'notice'){
$field->show();
}
// カテゴリが【レポート】だったら表示させる
// カテゴリが【レポート】だったら表示させる
elseif($formData->category == 'report'){
$field->show()->rules('required');
}
// カテゴリが【新着情報】または【チケット】だったら表示させる
// カテゴリが【新着情報】または【チケット】だったら表示させる
elseif($formData->category == 'new_information' || $formData->category == 'ticket'){
$field->show();
} // DBに登録されたurlを 詳細ページでのみ表示(＝一覧のリストにはurl表示されない)
})->displayUsing(fn() => $this->url)->showOnDetail(),
【vue】console.logでのデータの中身確認
defineProps({
office: {
type: Object
},
});
console.log(office);
この受け取り方だとconsoleで中身を確認できない。
const office = usePage().props.office;
console.log(office);
だと確認できる。
auth()->user()の色々な使い道
【単一データで取得】
$office = auth()->user()->office;
dump($office->toArray());
※userモデルにリレーション定義済
結果、以下のように単一データで取得できる
array:18 [▼ // app/Http/Controllers/User/OfficeController.php:71 "id" => 1 "code" => "11" "name" => "てすと事務所"
【配列データで取得】
$offices = Office::where('id',auth()->user()->office_id)->get();
dump($offices->toArray());
※userモデルにリレーション定義済
結果、以下のように配列のデータで取得できる
array:1 [▼ // app/Http/Controllers/User/OfficeController.php:74 0 => array:18 [▼ "id" => 1 "code" => "11" "name" => "てすと事務所"
正規表現・バリデーション
正規表現とは
・正規表現のパターンに一致する文字列を検索したり
・見つかった文字列を別の文字列に置換する場合に使われたり、
・入力された文字列が正規表現で表現されるパターンに一致するかどうかをチェックする時などに使われる。
※現状はvueのHTMLに組み込んでバリデーションとして使用のみ
<TextInput
id="basic_company_zip_code"
type="text"
pattern="[0-9]*" // patternで指定
title="ハイフンなしの半角数字を入力してください" // エラーメッセージ
class="mt-1 block"
v-model="form.basic_company_zip_code"
required
autocomplete="basic_company_zip_code"
<InputError class="mt-2" :message="form.errors.basic_company_zip_code" />
書いておくと、保存ボタン押す前に事前にチェック入り、正規表現に沿っていなければエラーメッセージが表示される。
【よく使いそうなパターン】
郵便番号
※半角数字のみOK
pattern="[0-9]*"
"title=""ハイフンなしの半角数字を入力してください"" "
住所フリガナ
※全角のカナ、数字、記号のみOK
pattern="[ァ-ヶ０-９々〆ー－ ]*"
title="全角カタカナ、数字を入力してください"
電話・FAX
※半角数字のハイフンありの電話番号(携帯もいけるが15桁以上になる国際電話等は無理)を許可
pattern="^0\d{1,4}-\d{1,4}-\d{1,4}$"
title="ﾊｲﾌﾝありの半角数字を入力してください"
メールアドレス
※半角英数字、@あり、@の後に最低ドット1つありを許可
pattern="[A-Za-z0-9]+@[A-Za-z0-9]+\.[A-Za-z]+"
title="半角英数字、@をつけて有効なアドレスを入力してください"
【その他】
全角カナ・全角スペースのみOK
pattern="[ァ-ヶ ]*"
title="カタカナを入力してください"
全角と半角カナ、全角&半角スペースのみOK
pattern="[ァ-ヶｦ-ﾟ ]*"
title="カタカナを入力してください"
半角カナ、半角スペースのみOK
pattern="[ｦ-ﾟ ]*"
title="半角ｶﾀｶﾅを入力してください"
全角・半角数字のみOK
pattern="[0-9０-９]*"
title="数字を入力してください"
カタカナ・数字・ハイフンのみOK
pattern="^[ァ-ンヴーｧ-ﾝﾞﾟ0-9０-９\- ]+$"
title="カタカナまたは数字を入力して下さい"
全角の漢字、ひらがな、カタカナ、英語、数字、記号を許可
pattern="[一-龠ァ-ヶぁ-んｦ-ﾟa-zA-Z0-9０-９Ａ-Ｚａ-ｚー！-／：-＠［-｀｛-～］]*"
title="全角で入力してください"
inertia⇔vueでのフラッシュメッセージの表示方法
コントローラーで
return redirect()->back()->with('success','保存しました');
と書き、リダイレクトするページのコントローラーで
$success_message = session()->get('success'); // 受け取る
return Inertia::render('Company/BasicInfo/BasicInfoForm', [
'success_message' => $success_message, // vueに渡す
]);
そのvueの<setup script>内で以下のどっちかで受取り、
const props = defineProps({
success_message: { // こっちの書き方でも
type: String
}
success_message:String // こっちの書き方でもどっちでも可で受け取る
});
テンプレ内で
{{ props.success_message }}
メッセージ表示できる。
ちなみに、const ●●は変数を指定していて、
const props = defineProps({
success_message: {
type: String
}
});
はpropsという変数を指定しているから、表示する時は
{{ props.success_message }}
になるが、もし値を受け取るだけの
defineProps({
success_message: {
type: String
}
});
にする場合は
{{ success_message }}
で表示できる。
