はじめに

個人の勉強用アプリで要望フォームを作ってみたので備忘録として残します。

概要

大まかな操作/イメージとしては以下のような感じです。

【要望フォーム(Vue.js)】

【要望通知(AzureFunctions + LINE Messaging API)】

ユーザが上記のフォームから要望を申請すると以下のように管理者へLINE通知が来ます。
※黒枠部分に上記の要望フォームで書かれた内容が入っています。

【管理者が承諾ボタンを押下した場合】
ユーザへ承諾された通知がいきます。

【管理者が却下ボタンを押下した場合】
却下理由を求められるので管理者が理由も書き終わるとまとめてユーザへ通知がいきます。

[管理者への通知]

[ユーザへの通知]

実装内容

要望フォームは単純に以下のような感じ。
入力された要望をAzureFunctions側へ送ってあげます。

<template>
  ～省略～
        <form>
          <v-row class="text-center">
            <v-col>
              <v-row>
                ～省略～
                <v-col cols="12">
                  <v-textarea
                    outlined
                    v-model="content"
                    label="要望を入力してください。"
                  ></v-textarea>
                </v-col>
                <v-col cols="12">
                  <v-btn block @click="postRequest" :disabled="content === ''"
                    >送信</v-btn
                  >
                </v-col>
              </v-row>
            </v-col>
          </v-row>
        </form>
      ～省略～
</template>

<script>
import axios from "axios";

export default {
  data() {
    return {
      content: "",
    };
  },
  methods: {
    postRequest: function () {
      let vm = this;
      axios
        .post("AzureFunctionsのURL", request)
        .then(function () {
          vm.content = "";
        })
        .catch(function(response){
          console.log(response)
        });
    },
  },
};
</script>

AzureFunctions側はHttp Triggerで構成し、要望をDBへ登録→LINE Messaging APIの確認テンプレートを用いて管理者へメッセージを送ります。

ここの構成については少し迷ったのですが、単に管理者へ流すだけだと「どの要望についての回答なのか」がその後の処理で判断が付きません。
そのため、Actionオブジェクトはポストバックアクションを用い、DB登録後にそのIdをpostback.dataへ持たせる実装にしました。
「承諾ボタン」「却下ボタン」のActionのDataにはそれぞれ"Id,承諾", "Id,却下"をセットしています。

その後の操作については承諾された場合は対象のユーザへOKされたことを通知し、上記で保管していたIdのレコードを承諾済みに更新します。却下された場合は"-Id-"始まりで理由を書くことでユーザに却下理由が飛ぶようにしました（ちょっと複雑になってきて上手く言葉にまとめられませんが...）。

※一応要望が来ていないのに"-id-"始まりで何かしらbotへテキストを送ったとしても、そのidのレコードが未確認状態として保管されているかはチェックしているので弾かれます。

// 対象データ取得部分
public async Task<Requests> UpdateRequestAsync(int requestId, string reply)
{
   // isConsentはvarchar(1)で"0"のものは管理者が未確認状態であるとしている
    var target = await _dbContext.Requests
        .SingleOrDefaultAsync(o => o.RequestId == requestId && o.IsConsent == "0");

    // 省略

    return target;
}

// 呼び出し部分
var result = await _resolveRequestsRepository.UpdateRequestAsync(requestId, reply);

// 管理者が未確認状態かつDBにレコードがないとそもそも動かないようにしている
if(result == null) return new BadRequestResult();