added click editing to calendar vue

Management.Web/Shared/Components/AssignmentForm/AssignmentDescriptionEditor.razor

@@ -0,0 +1,145 @@
+@using Markdig
+
+@inject CoursePlanner planner
+
+@code 
+{
+  [Parameter]
+  public string Description { get; set; } = default!;
+  [Parameter]
+  public bool UseTemplate { get; set; }
+  [Parameter]
+  public string? TemplateId { get; set; }
+  [Parameter]
+  public Dictionary<string, string> VariableValues { get; set; } = new Dictionary<string, string>();
+
+  [Parameter]
+  public EventCallback<string> DescriptionChanged { get; set; }
+
+  [Parameter]
+  public EventCallback<bool> UseTemplateChanged { get; set; }
+
+  [Parameter]
+  public EventCallback<string?> TemplateIdChanged { get; set; }
+
+  [Parameter]
+  public EventCallback<Dictionary<string, string>> VariableValuesChanged { get; set; }
+
+  private AssignmentTemplate? selectedTemplate => 
+    planner
+    .LocalCourse?
+    .AssignmentTemplates
+    .FirstOrDefault(t => t.Id == TemplateId);
+  public string Preview => Markdown.ToHtml(Description);
+
+}
+
+
+<div class="form-check form-switch">
+  <input 
+    class="form-check-input" 
+    type="checkbox"
+    role="switch" 
+    id="useTemplateForDescription"
+    checked="@UseTemplate"
+    @onchange="async (e) => 
+      await UseTemplateChanged.InvokeAsync((bool)(e.Value ?? false))"
+  >
+  <label 
+    class="form-check-label" 
+    for="useTemplateForDescription"
+  >
+    use template for description
+  </label>
+</div>
+
+@if(UseTemplate)
+{
+  @if(planner.LocalCourse != null)
+  {
+    <div class="row justify-content-around">
+      <div class="col-auto text-center">
+        <form @onsubmit:preventDefault="true">
+          <label for="templateSelect">Templates</label>
+          <select 
+            id="templateSelect" 
+            class="form-select" 
+            value="@TemplateId"
+            @onchange="async (e) =>
+              await TemplateIdChanged.InvokeAsync(e.Value?.ToString())"
+          >
+            <option value=""></option>
+            @foreach (var template in planner.LocalCourse.AssignmentTemplates)
+            {
+              <option value="@template.Id">@template.Name</option>
+            }
+          </select>
+        </form>
+      </div>
+      <div class="col-auto">
+        VARIABLES:
+        @if(selectedTemplate != null)
+        {
+          var variables = AssignmentTemplate.GetVariables(selectedTemplate.Markdown);
+          @foreach(var variable in variables)
+          {
+            <div class="my-1">
+              <label
+                class="form-label"
+              >
+                @variable
+              </label>
+              <input
+                class="form-control"
+                value="@VariableValues.GetValueOrDefault(variable, String.Empty)"
+                @oninput="async (e) => 
+                  {
+                    var newValue = e.Value?.ToString() ?? String.Empty;
+                    var newDictionary = new Dictionary<string, string>(VariableValues);
+                    newDictionary[variable] = newValue;
+                    
+                    await VariableValuesChanged.InvokeAsync(newDictionary);
+                  }
+                "
+              />
+            </div>
+          }
+        }
+      </div>
+    </div>
+  }
+}
+else
+{
+  
+  <div class="row">
+    <div class="col">
+      <label 
+        for="description"
+        class="form-label"
+      >
+        Description
+      </label>
+    </div>
+    <div class="col">
+      HTML Preview
+
+    </div>
+  </div>
+  <div class="row">
+    <div class="col">
+      <textarea 
+        id="description" 
+        class="form-control"
+        value="@Description"
+        rows=12
+        @oninput="async (e) => 
+          await DescriptionChanged.InvokeAsync(e.Value?.ToString() ?? String.Empty)"
+      />
+    </div>
+    <div class="col">
+      @((MarkupString) Preview)
+
+    </div>
+  </div>
+}