Merge branch 'dev_vite' of ssh://18.167.251.121:10002/aidlab/aida_front into dev_vite

src/component/Administrator/SE/designDetailList/index.vue

@@ -2,11 +2,10 @@
 	<div class="test_cli admin_page">
 		<div class="admin_table_search">
 			<div class="admin_state">
-			
 				<div class="admin_state_item">
-					<span>{{ $t('admin.StartDate') }}:</span>
+					<span>{{ $t("admin.StartDate") }}:</span>
 					<a-range-picker
-						style="width:250px"
+						style="width: 250px"
 						class="range_picker"
 						v-model:value="rangePickerValue"
 						:placeholder="[
@@ -23,11 +22,20 @@
 					</a-range-picker>
 				</div>
 				<div class="admin_state_item">
-					<span>{{ $t('admin.StartTime') }}:</span>
+					<span>{{ $t("admin.StartTime") }}:</span>
-						<a-time-range-picker style="width:250px" :placeholder="[$t('admin.startTime'), $t('admin.endTime'),]" class="range_picker" valueFormat="HH:mm:ss" v-model:value="rangeTimeValue" />
+					<a-time-range-picker
+						style="width: 250px"
+						:placeholder="[
+							$t('admin.startTime'),
+							$t('admin.endTime'),
+						]"
+						class="range_picker"
+						valueFormat="HH:mm:ss"
+						v-model:value="rangeTimeValue"
+					/>
 				</div>
 				<div class="admin_state_item">
-                    <span>{{ $t('admin.Email') }}:</span>
+					<span>{{ $t("admin.Email") }}:</span>
 					<input
 						v-model="email"
 						:placeholder="$t('admin.enterEmail')"
@@ -37,7 +45,7 @@
 					/>
 				</div>
 				<div class="admin_state_item">
-                    <span>{{ $t('admin.UserName') }}:</span>
+					<span>{{ $t("admin.UserName") }}:</span>
 					<a-select
 						v-model:value="ids"
 						mode="multiple"
@@ -49,9 +57,21 @@
 						@keydown.enter="gettrialList"
 					></a-select>
 				</div>
+				<div class="admin_state_item">
+					<span>Organization Name:</span>
+					<input
+						v-model="organizationName"
+						placeholder="Please enter Organization Name"
+						@keydown.enter="gettrialList"
+						type="text"
+						style="width: 250px"
+					/>
+				</div>
 			</div>
 			<div class="admin_search">
-				<div class="admin_search_item" @click="searchHistoryList">{{ $t('admin.search') }}</div>
+				<div class="admin_search_item" @click="searchHistoryList">
+					{{ $t("admin.search") }}
+				</div>
 			</div>
 		</div>
 
@@ -76,44 +96,43 @@
 	</div>
 </template>
 <script lang="ts">
-import { defineComponent, ref, createVNode, computed } from "vue";
+	import { defineComponent, ref, createVNode, computed } from "vue";
-import { useStore } from "vuex";
+	import { useStore } from "vuex";
-import { Https } from "@/tool/https";
+	import { Https } from "@/tool/https";
-import { useI18n } from 'vue-i18n'
+	import { useI18n } from "vue-i18n";
-export default defineComponent({
+	export default defineComponent({
-    components: {
+		components: {},
-    },
 		setup() {
-        const store:any = useStore()
+			const store: any = useStore();
 			let rangePickerValue: any = ref([]);
 			let rangeTimeValue: any = ref([]);
 			let renameData: any = ref({}); //修改名字选中的数据
-		const {t} = useI18n()
+			const { t } = useI18n();
 			const columns: any = computed(() => {
 				return [
 					{
-                    title: t('admin.Email'),
+						title: t("admin.Email"),
 						align: "center",
 						dataIndex: "userEmail",
 						key: "userEmail",
-					width:200,
+						width: 200,
 						fixed: "left",
 					},
 					{
-                    title: t('admin.UserId'),
+						title: t("admin.UserId"),
 						align: "center",
 						ellipsis: true,
 						dataIndex: "accountId",
 						key: "accountId",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: t('admin.UserName'),
+						title: t("admin.UserName"),
 						align: "center",
 						ellipsis: 200,
 						dataIndex: "userName",
 						key: "userName",
-					width:100,
+						width: 100,
 						// customRender: (record: any) => {
 						//     let time = formatTime(
 						//         record.text / 1000,
@@ -123,15 +142,15 @@ export default defineComponent({
 						// },
 					},
 					{
-                    title: t('admin.Frequency'),
+						title: t("admin.Frequency"),
 						align: "center",
 						ellipsis: true,
 						dataIndex: "designTimes",
 						key: "designTimes",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: t('admin.CreateTime'),
+						title: t("admin.CreateTime"),
 						align: "center",
 						ellipsis: true,
 						// width: 150,
@@ -140,10 +159,10 @@ export default defineComponent({
 						// resizable: true,
 						dataIndex: "createTime",
 						key: "createTime",
-					width:200,
+						width: 200,
 					},
 					{
-                    title: t('admin.Credits'),
+						title: t("admin.Credits"),
 						align: "center",
 						ellipsis: true,
 						// width: 150,
@@ -152,18 +171,19 @@ export default defineComponent({
 						// resizable: true,
 						dataIndex: "credits",
 						key: "credits",
-					width:100,
+						width: 100,
 					},
 				];
 			});
 
-        let allUserList: any = computed(()=>{
+			let allUserList: any = computed(() => {
-				return store.state.adminPage.allUserList
+				return store.state.adminPage.allUserList;
-			})
+			});
-		let ids = ref([])
+			let ids = ref([]);
-		let email = ref('')
+			let email = ref("");
 			let dataList: any = ref([]);
 			let status: any = ref(0);
+			let organizationName: any = ref(""); 
 			let filterOption = (input: any, option: any) => {
 				// 使用 option.label 进行搜索
 				return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
@@ -179,6 +199,7 @@ export default defineComponent({
 				renameData,
 				status,
 				filterOption,
+				organizationName,
 			};
 		},
 		data() {
@@ -187,7 +208,7 @@ export default defineComponent({
 				pageSize: 10,
 				total: 0,
 				historyTableHeight: 0,
-			handleResizeColumn: (w:any, col:any) => {
+				handleResizeColumn: (w: any, col: any) => {
 					col.width = w;
 				},
 			};
@@ -215,29 +236,32 @@ export default defineComponent({
 			gettrialList() {
 				let startTime: any = this.rangeTimeValue?.[0]
 					? this.rangeTimeValue[0]
-                : '00:00:00';
+					: "00:00:00";
 				let endTime: any = this.rangeTimeValue?.[1]
 					? this.rangeTimeValue[1]
-                : '23:59:59';
+					: "23:59:59";
 				let startDate: any = this.rangePickerValue?.[0]
-                ? this.rangePickerValue[0]+' '+startTime
+					? this.rangePickerValue[0] + " " + startTime
 					: "";
 				let endDate: any = this.rangePickerValue?.[1]
-                ? this.rangePickerValue[1]+' '+endTime
+					? this.rangePickerValue[1] + " " + endTime
 					: "";
-			let ids = this.ids.join(',')
+				let ids = this.ids.join(",");
 				let data = {
-				endTime:endDate,
+					endTime: endDate,
-				startTime:startDate,
+					startTime: startDate,
-				ids:ids,
+					ids: ids,
-				email:this.email.trim(),
+					email: this.email.trim(),
-			}
+					organizationName: this.organizationName,
-			Https.axiosGet(Https.httpUrls.getDesignStatistic,{params:data}).then((rv: any) => {
+				};
+				Https.axiosGet(Https.httpUrls.getDesignStatistic, {
+					params: data,
+				}).then((rv: any) => {
 					if (rv) {
-					this.dataList = rv
+						this.dataList = rv;
 						// this.workspaceItem.position = this.singleTypeList[0].label
 					}
-			})
+				});
 			},
 
 			//删除分组
@@ -264,14 +288,12 @@ export default defineComponent({
 			//         },
 			//     });
 			// },
-		
-		
 		},
-});
+	});
 </script>
 <style lang="less" scoped>
-.admin_page .admin_table_search .admin_state {
+	.admin_page .admin_table_search .admin_state {
 		display: flex;
 		flex-wrap: wrap;
-}
+	}
 </style>

src/component/Administrator/TestClickData.vue

@@ -2,11 +2,10 @@
 	<div class="test_cli admin_page">
 		<div class="admin_table_search">
 			<div class="admin_state">
-			
 				<div class="admin_state_item">
 					<span>Start Date:</span>
 					<a-range-picker
-						style="width:250px"
+						style="width: 250px"
 						class="range_picker"
 						v-model:value="rangePickerValue"
 						:placeholder="[
@@ -24,7 +23,12 @@
 				</div>
 				<div class="admin_state_item">
 					<span>Start Time:</span>
-						<a-time-range-picker style="width:250px" class="range_picker" valueFormat="HH:mm:ss" v-model:value="rangeTimeValue" />
+					<a-time-range-picker
+						style="width: 250px"
+						class="range_picker"
+						valueFormat="HH:mm:ss"
+						v-model:value="rangeTimeValue"
+					/>
 				</div>
 				<div class="admin_state_item">
 					<span>Email:</span>
@@ -49,9 +53,21 @@
 						@keydown.enter="gettrialList"
 					></a-select>
 				</div>
+				<div class="admin_state_item">
+					<span>Organization Name:</span>
+					<input
+						v-model="organizationName"
+						placeholder="Please enter Organization Name"
+						@keydown.enter="gettrialList"
+						type="text"
+						style="width: 250px"
+					/>
+				</div>
 			</div>
 			<div class="admin_search">
-				<div class="admin_search_item" @click="searchHistoryList">Search</div>
+				<div class="admin_search_item" @click="searchHistoryList">
+					Search
+				</div>
 			</div>
 		</div>
 
@@ -76,42 +92,42 @@
 	</div>
 </template>
 <script lang="ts">
-import { defineComponent, ref, createVNode, computed } from "vue";
+	import { defineComponent, ref, createVNode, computed } from "vue";
-import { useStore } from "vuex";
+	import { useStore } from "vuex";
-import { Https } from "@/tool/https";
+	import { Https } from "@/tool/https";
-export default defineComponent({
+	export default defineComponent({
-    components: {
+		components: {},
-    },
 		setup() {
-        const store:any = useStore()
+			const store: any = useStore();
 			let rangePickerValue: any = ref([]);
 			let rangeTimeValue: any = ref([]);
 			let renameData: any = ref({}); //修改名字选中的数据
+			let organizationName: any = ref(""); 
 			const columns: any = computed(() => {
 				return [
 					{
-                    title: 'Email',
+						title: "Email",
 						align: "center",
 						dataIndex: "userEmail",
 						key: "userEmail",
-					width:200,
+						width: 200,
 						fixed: "left",
 					},
 					{
-                    title: 'User Id',
+						title: "User Id",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "accountId",
 						key: "accountId",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'User Name',
+						title: "User Name",
 						align: "center",
 						ellipsis: 200,
 						dataIndex: "userName",
 						key: "userName",
-					width:100,
+						width: 100,
 						// customRender: (record: any) => {
 						//     let time = formatTime(
 						//         record.text / 1000,
@@ -121,72 +137,72 @@ export default defineComponent({
 						// },
 					},
 					{
-                    title: 'isTrial',
+						title: "isTrial",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "isTrial",
 						key: "isTrial",
-					width:100,
+						width: 100,
 						customRender: (record: any) => {
-                        let str
+							let str;
-						if(record.value == 1){
+							if (record.value == 1) {
-							str ='Yes'
+								str = "Yes";
-						}else{
+							} else {
-							str ='No'
+								str = "No";
 							}
 							return str;
 						},
 					},
 					{
-                    title: 'Frequency',
+						title: "Frequency",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "designTimes",
 						key: "designTimes",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'Country',
+						title: "Country",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "country",
 						key: "country",
-					width:200,
+						width: 200,
 					},
 					{
-                    title: 'Title',
+						title: "Title",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "title",
 						key: "title",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'Surname',
+						title: "Surname",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "surname",
 						key: "surname",
-					width:150,
+						width: 150,
 					},
 					{
-                    title: 'Given Name',
+						title: "Given Name",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "givenName",
 						key: "givenName",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'Create Time',
+						title: "Create Time",
 						align: "center",
 						ellipsis: true,
 						dataIndex: "createTime",
 						key: "createTime",
-					width:200,
+						width: 200,
 					},
 					{
-                    title: 'Credits',
+						title: "Credits",
 						align: "center",
 						ellipsis: true,
 						// width: 150,
@@ -195,10 +211,10 @@ export default defineComponent({
 						// resizable: true,
 						dataIndex: "credits",
 						key: "credits",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'Occupation',
+						title: "Occupation",
 						align: "center",
 						ellipsis: true,
 						// width: 150,
@@ -207,26 +223,26 @@ export default defineComponent({
 						// resizable: true,
 						dataIndex: "occupation",
 						key: "occupation",
-					width:100,
+						width: 100,
 					},
 					{
-                    title: 'Trial Order Id',
+						title: "Trial Order Id",
 						align: "center",
 						ellipsis: true,
 						// width: 150,
 						// resizable: true,
 						dataIndex: "trialOrderId",
 						key: "trialOrderId",
-					width:100,
+						width: 100,
 					},
 				];
 			});
 
-        let allUserList: any = computed(()=>{
+			let allUserList: any = computed(() => {
-				return store.state.adminPage.allUserList
+				return store.state.adminPage.allUserList;
-			})
+			});
-		let ids = ref([])
+			let ids = ref([]);
-		let email = ref('')
+			let email = ref("");
 			let dataList: any = ref([]);
 			let status: any = ref(0);
 			let filterOption = (input: any, option: any) => {
@@ -235,6 +251,7 @@ export default defineComponent({
 			};
 			return {
 				rangePickerValue,
+				organizationName,
 				rangeTimeValue,
 				columns,
 				dataList,
@@ -252,7 +269,7 @@ export default defineComponent({
 				pageSize: 10,
 				total: 0,
 				historyTableHeight: 0,
-			handleResizeColumn: (w:any, col:any) => {
+				handleResizeColumn: (w: any, col: any) => {
 					col.width = w;
 				},
 			};
@@ -280,29 +297,32 @@ export default defineComponent({
 			gettrialList() {
 				let startTime: any = this.rangeTimeValue?.[0]
 					? this.rangeTimeValue?.[0]
-                : '00:00:00';
+					: "00:00:00";
 				let endTime: any = this.rangeTimeValue[1]
 					? this.rangeTimeValue[1]
-                : '23:59:59';
+					: "23:59:59";
 				let startDate: any = this.rangePickerValue[0]
-                ? this.rangePickerValue[0]+' '+startTime
+					? this.rangePickerValue[0] + " " + startTime
 					: "";
 				let endDate: any = this.rangePickerValue[1]
-                ? this.rangePickerValue[1]+' '+endTime
+					? this.rangePickerValue[1] + " " + endTime
 					: "";
-			let ids = this.ids.join(',')
+				let ids = this.ids.join(",");
 				let data = {
-				endTime:endDate,
+					endTime: endDate,
-				startTime:startDate,
+					startTime: startDate,
-				ids:ids,
+					ids: ids,
-				email:this.email.trim(),
+					email: this.email.trim(),
-			}
+					organizationName: this.organizationName,
-			Https.axiosGet(Https.httpUrls.getDesignStatistic,{params:data}).then((rv: any) => {
+				};
+				Https.axiosGet(Https.httpUrls.getDesignStatistic, {
+					params: data,
+				}).then((rv: any) => {
 					if (rv) {
-					this.dataList = rv
+						this.dataList = rv;
 						// this.workspaceItem.position = this.singleTypeList[0].label
 					}
-			})
+				});
 			},
 
 			//删除分组
@@ -329,14 +349,12 @@ export default defineComponent({
 			//         },
 			//     });
 			// },
-		
-		
 		},
-});
+	});
 </script>
 <style lang="less" scoped>
-.admin_page .admin_table_search .admin_state {
+	.admin_page .admin_table_search .admin_state {
 		display: flex;
 		flex-wrap: wrap;
-}
+	}
 </style>

src/component/Administrator/organization/organization.vue

@@ -1,7 +1,26 @@
 <template>
 	<div class="admin_page">
-        <div class="admin_table_search" >
+		<div class="admin_table_search">
 			<div class="admin_state">
+				<div class="admin_state_item">
+					<span>Create Time:</span>
+					<a-range-picker
+						style="width: 250px"
+						class="range_picker"
+						v-model:value="rangePickerValue"
+						:placeholder="[
+							$t('HistoryPage.StartDate'),
+							$t('HistoryPage.EndDate'),
+						]"
+						valueFormat="YYYY-MM-DD"
+					>
+						<template #suffixIcon>
+							<span
+								class="icon iconfont range_picker_icon icon-rili"
+							></span>
+						</template>
+					</a-range-picker>
+				</div>
 				<div class="admin_state_item">
 					<span>Status:</span>
 					<a-select
@@ -11,10 +30,25 @@
 						optionFilterProp="label"
 						:options="statusList"
 						placeholder="Please select"
+						@change="changeStatus"
 						allowClear
 						show-search
 					></a-select>
 				</div>
+				<div class="admin_state_item">
+					<span>School:</span>
+					<a-select
+						v-model:value="school"
+						size="large"
+						style="width: 250px"
+						optionFilterProp="label"
+						:options="schoolList"
+						placeholder="Please select"
+						allowClear
+						show-search
+						@focus="handleFocus"
+					></a-select>
+				</div>
 			</div>
 			<div class="admin_search">
 				<div class="admin_search_item" @click="searchHistoryList">
@@ -33,7 +67,7 @@
 				:data-source="dataList"
 				:scroll="{ y: historyTableHeight }"
 				@change="changePage"
-				:showSorterTooltip='false'
+				:showSorterTooltip="false"
 				:pagination="{
 					showSizeChanger: true,
 					current: currentPage,
@@ -49,7 +83,7 @@
 	</div>
 </template>
 <script lang="ts">
-import {
+	import {
 		defineComponent,
 		ref,
 		createVNode,
@@ -57,24 +91,23 @@ import {
 		reactive,
 		toRefs,
 		onMounted,
-} from "vue";
+	} from "vue";
-import { formatTime } from "@/tool/util";
+	import { formatTime } from "@/tool/util";
-import { useStore } from "vuex";
+	import { useStore } from "vuex";
-import { Https } from "@/tool/https";
+	import { Https } from "@/tool/https";
-import {getCookie,clonAllCookie} from '@/tool/cookie'
+	import { getCookie, clonAllCookie } from "@/tool/cookie";
-import add from './add.vue'
+	import add from "./add.vue";
-export default defineComponent({
+	export default defineComponent({
-    components: {add},
+		components: { add },
 		setup() {
-        const store:any = useStore()
+			const store: any = useStore();
 			let filter: any = reactive({
 				dataList: [],
 				tableLoading: false,
-			countryList: computed(()=>{
+				countryList: computed(() => {
-				return store.state.adminPage.country
+					return store.state.adminPage.country;
 				}),
-			add:null as any,
+				add: null as any,
-			status:'',
 			});
 			let filterData: any = reactive({
 				currentPage: 1,
@@ -82,24 +115,26 @@ export default defineComponent({
 				total: 0,
 				country: "",
 				status: "",
-			type: "",
+				school: "",
+				rangePickerValue: [],
 			});
-		let selectList=reactive({
+			let selectList = reactive({
-			statusList:[
+				statusList: [
 					{
 						label: "all",
 						value: "",
 					},
 					{
-					label:'Enterprise',
+						label: "Enterprise",
-					value:'Enterprise',
+						value: "Enterprise",
 					},
 					{
-					label:'Education',
+						label: "Education",
-					value:'Education',
+						value: "Education",
 					},
 				],
-		})
+				schoolList: [],
+			});
 			let renameData: any = ref({}); //修改名字选中的数据
 			const columns: any = computed(() => {
 				return [
@@ -108,42 +143,62 @@ export default defineComponent({
 						align: "center",
 						dataIndex: "id",
 						key: "id",
-					width:150,
+						width: 150,
-					ellipsis:true
+						ellipsis: true,
 					},
 					{
 						title: "Name",
 						align: "center",
 						dataIndex: "name",
 						key: "name",
-					width:150,
+						width: 150,
-					ellipsis:true
+						ellipsis: true,
 					},
 					{
 						title: "Create Time",
 						align: "center",
 						dataIndex: "createTime",
 						key: "createTime",
-					width:150,
+						width: 150,
-					ellipsis:true
+						ellipsis: true,
 					},
 					{
 						title: "Type",
 						align: "center",
 						dataIndex: "type",
 						key: "type",
-					width:150,
+						width: 150,
-					ellipsis:true,
+						ellipsis: true,
 					},
 				];
 			});
 			//改变页码
-        let changePage = (e: any, filters:any, sorter:any) => {
+			let changePage = (e: any, filters: any, sorter: any) => {
 				filterData.currentPage = e.current;
 				filterData.pageSize = e.pageSize;
 				gettrialList();
 			};
-
+			const filterOption = (e: any) => {
+				let type = filterData.status;
+				if (type == "Education") type = "School";
+				let params = {
+					name: e,
+					type,
+				};
+				Https.axiosPost(
+					Https.httpUrls.organizationNameSearch,
+					{},
+					{ params: params }
+				).then((rv: any) => {
+					if (rv.length == 0) return (selectList.schoolList = []);
+					selectList.schoolList = rv.map((item: any) => {
+						return {
+							label: item,
+							value: item,
+						};
+					});
+				});
+			};
 			//查询列表
 			let searchHistoryList = () => {
 				filterData.currentPage = 1;
@@ -152,22 +207,42 @@ export default defineComponent({
 			//获取列表
 			let gettrialList = () => {
 				filter.tableLoading = true;
-            Https.axiosGet(Https.httpUrls.queryOrganization, {params:{type:'Enterprise'}}).then(
+				const dateArr = filterData.rangePickerValue;
+				const startDate = dateArr?.[0] ? dateArr[0] + " " + "00:00:00" : "";
+				const endDate = dateArr?.[1] ? dateArr[1] + " " + "23:59:59" : "";
+				const params = {
+					startTime: startDate,
+					endTime: endDate,
+					id: "",
+					name: filterData.school,
+					type: filterData.status,
+					size: filterData.pageSize,
+					page: filterData.currentPage,
+				}; //type: "Enterprise"
+				Https.axiosPost(Https.httpUrls.queryOrganization, params).then(
 					(rv: any) => {
 						if (rv) {
-						console.log(rv)
+							console.log(rv);
-                        filter.dataList = rv
+							// filter.dataList = rv;
-                        // filter.dataList = rv.content;
+							filter.dataList = rv.records;
-                        // filterData.total = rv.total;
+							filterData.total = rv.total;
 							filter.tableLoading = false;
-
 							// this.workspaceItem.position = this.singleTypeList[0].label
 						}
 					}
 				);
 			};
 			let addhHistoryList = () => {
-			filter.add.init('Add','')
+				filter.add.init("Add", "");
+			};
+			const handleFocus = () => {
+				if (selectList.schoolList.length == 0) {
+					filterOption("");
+				}
+			};
+			const changeStatus = () => {
+				filterData.school = "";
+				selectList.schoolList = [];
 			};
 			onMounted(() => {
 				gettrialList();
@@ -182,6 +257,8 @@ export default defineComponent({
 				searchHistoryList,
 				gettrialList,
 				addhHistoryList,
+				handleFocus,
+				changeStatus,
 			};
 		},
 		data() {
@@ -197,32 +274,32 @@ export default defineComponent({
 			this.historyTableHeight = historyTable.clientHeight - 200;
 		},
 		methods: {},
-});
+	});
 </script>
 <style lang="less" scoped>
-.admin_page .admin_table_search .admin_state {
+	.admin_page .admin_table_search .admin_state {
 		display: flex;
 		flex-wrap: wrap;
-}
+	}
-:deep(.operate_list){
+	:deep(.operate_list) {
-	.fi{
+		.fi {
 			font-size: 2rem;
 			margin-right: 1rem;
 		}
-	.success{
+		.success {
-		.fi-ss-check-circle{
+			.fi-ss-check-circle {
 				color: #3ab45c;
 			}
 		}
-	.pending{
+		.pending {
-		.fi-ss-check-circle{
+			.fi-ss-check-circle {
 				color: #ffc628;
 			}
 		}
-	.fail{
+		.fail {
-		.fi-ss-check-circle{
+			.fi-ss-check-circle {
 				color: #ff0000;
 			}
 		}
-}
+	}
 </style>