ui pro usr #39

ismism.ts/ui/bind.ts

@@ -1,5 +1,6 @@
 // deno-lint-ignore-file no-window-prefix
-import { DocU } from "../src/db.ts"
+import type { DocU } from "../src/db.ts"
+import type { Aut } from "../src/eid/typ.ts"
 import { adm } from "../src/ont/adm.ts"
 import { utc_medium } from "../src/ont/utc.ts"
 import type { Pas } from "../src/pra/pas.ts"
@@ -31,6 +32,30 @@ async function pos<T>(
 	return res.json() as T
 }
 
+function is_aut(
+	pas: Pas,
+	aut: Aut["p"][0],
+): boolean {
+	return pas.aut.includes(aut)
+}
+function not_aut(
+	pas: Pas,
+	aut: Aut["p"][0],
+) {
+	return !is_aut(pas, aut)
+}
+function is_pro(
+	{ rej, ref }: Pas,
+): boolean {
+	return rej.length < 2 && ref.length >= 2
+}
+function not_pro(
+	pas: Pas,
+) {
+	return !is_pro(pas)
+}
+
+
 function bind(
 	tid: string,
 	ecl: string[],
@@ -161,6 +186,7 @@ async function usr(
 		soc_e,
 		rec_e,
 		pos_e, put_e, pas_e,
+		pro_e, pro_rej_e, pro_ref_e,
 	]] = bind("usr", [
 		"idnam", "id", "nam",
 		"adm", "utc", "rej", "ref",
@@ -168,6 +194,7 @@ async function usr(
 		"soc",
 		"rec",
 		"pos", "put", "pas",
+		"pro", "pro_rej", "pro_ref",
 	]) as [DocumentFragment, [
 		HTMLAnchorElement, HTMLElement, HTMLElement,
 		HTMLElement, HTMLElement, HTMLElement, HTMLElement,
@@ -175,6 +202,7 @@ async function usr(
 		HTMLParagraphElement,
 		HTMLElement,
 		HTMLElement, HTMLButtonElement, HTMLButtonElement,
+		HTMLElement, HTMLButtonElement, HTMLButtonElement,
 	]]
 
 	idnam_e.href = `#${uid}`
@@ -191,23 +219,50 @@ async function usr(
 	if (u.ref.length < 2) ref_e.classList.add("red")
 	else if (u.ref.length === 0) ref_e.classList.add("gray")
 	idanchor(ref_e, "", u.ref, unam)
-	if (pas && pas.id.uid === u._id) {
-		pos_e.classList.remove("none")
-		put_e.addEventListener("click", () => usrput(u))
-		pas_e.addEventListener("click", async () => {
-			await pos("pas", { uid })
-			pas = null
-			pas_a.innerText = "用户登录"
-			pas_a.href = "#pas"
-			location.href = `#pas`
-		})
-	}
 	intro_e.innerText = `${u.intro.length > 0 ? u.intro : "无"}`
 	const snam = new Map(u.snam)
 	soc_e.innerText = `${u.snam.length > 0 ? "" : "无"}`
 	idanchor(soc_e, "s", [...u.snam.keys()], snam)
 	rec_e.innerText = JSON.stringify(u.nrec)
 
+	if (pas) {
+		if (pas.id.uid === uid) {
+			pos_e.classList.remove("none")
+			put_e.addEventListener("click", () => usrput(u))
+			pas_e.addEventListener("click", async () => {
+				await pos("pas", { uid })
+				pas = null
+				pas_a.innerText = "用户登录"
+				pas_a.href = "#pas"
+				location.href = `#pas`
+			})
+		} else pos_e.classList.add("none")
+		const pro_rej = !u.rej.includes(pas.id.uid)
+		const pro_ref = !u.ref.includes(pas.id.uid)
+		pro_rej_e.innerText = pro_rej ? "反对" : "取消反对"
+		pro_ref_e.innerText = pro_ref ? "推荐" : "取消推荐"
+		if (not_aut(pas, "pro_usr") || not_pro(pas) || pas.ref.includes(uid)) {
+			pro_rej_e.disabled = true
+			pro_ref_e.disabled = true
+		} else {
+			pro_rej_e.addEventListener("click", async () => {
+				pro_rej_e.disabled = true
+				const c = await pos<DocU>("pro", { re: "rej", uid, pro: pro_rej })
+				if (c && c > 0) usr(uid)
+				else pro_rej_e.disabled = false
+			})
+			pro_ref_e.addEventListener("click", async () => {
+				pro_ref_e.disabled = true
+				const c = await pos<DocU>("pro", { re: "ref", uid, pro: pro_ref })
+				if (c && c > 0) usr(uid)
+				else pro_ref_e.disabled = false
+			})
+		}
+	} else {
+		pos_e.classList.add("none")
+		pro_e.classList.add("none")
+	}
+
 	main.append(usr_t)
 }
 

ismism.ts/ui/index.html

@@ -172,7 +172,6 @@
 		background: var(--darkgray);
 		border: none;
 		border-radius: 8px;
-		max-width: 12ch;
 	}
 
 	section>button:disabled {
@@ -244,6 +243,7 @@
 
 	section.flex {
 		display: flex;
+		margin-top: 6px;
 		flex-wrap: wrap;
 		justify-content: center;
 		align-items: center;
@@ -256,6 +256,12 @@
 	section.flex>select {
 		box-sizing: border-box;
 		display: block;
+		justify-content: center;
+		align-items: center;
+	}
+
+	section.flex>label {
+		transform: translateY(1ch);
 	}
 
 	section.flex>input,
@@ -263,10 +269,6 @@
 		padding: 1ch;
 	}
 
-	section.flex>label {
-		transform: translateY(1ch);
-	}
-
 	section.flex>input {
 		flex: 10 1 10ch;
 		max-width: 36ch;
@@ -274,6 +276,7 @@
 
 	section.flex>button {
 		flex: 1 1 10ch;
+		max-width: 24ch;
 	}
 
 	section.flex>select {
@@ -414,7 +417,9 @@
 			反对者：<span class="rej"></span><br>
 			推荐人：<span class="ref"></span><br>
 			<hr>
-			反对者不少于两名，或推荐人少于两名时，用户权限将被冻结
+			反对者不少于两名，或推荐人少于两名时，用户权限将被冻结<br>
+			只有发起人和书记有权限反对或推荐用户<br>
+			不能反对或推荐自己的推荐人
 		</section>
 		<hr>
 		<section>
@@ -429,10 +434,14 @@
 		<hr>
 		<section class="rec"></section>
 		<hr>
-		<section class="pos flex none">
+		<section class="pos flex">
 			<button class="put">编辑</button>
 			<button class="pas">登出</button>
 		</section>
+		<section class="pro flex">
+			<button class="pro_rej">反对</button>
+			<button class="pro_ref">推荐</button>
+		</section>
 		<hr>
 	</article>
 </template>