1.1.0

src/api/sop.js

@@ -265,3 +265,10 @@ export const deviceGotoEditHandleApi = (data) =>
     data,
     loading: true,
   });
+
+//获取sop的快捷查询或列显示的信息
+export const getSopFastOptionsApi = (params) =>
+  request({
+    url: '/api/admin/sop/quick/list',
+    params,
+  });

src/components/global/tag-list/index.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="tag-list-box">
+    <p class="tip pt-15px p-l-5px p-r-5px p-b-5px"
+      >将上述条件设为快捷显示（最多5条）</p
+    >
+    <div class="flex items-center">
+      <div class="flex-1">
+        <t-form :data="formData" :rules="rules" ref="formRef">
+          <t-form-item label="" :labelWidth="0" name="name">
+            <t-input v-model="formData.name" />
+          </t-form-item>
+        </t-form>
+      </div>
+      <t-button type="primary" class="m-l-10px" @click="save">保存</t-button>
+    </div>
+    <div class="tag-list flex">
+      <div class="fast-tag" v-for="item in list" :key="item.id">
+        <span class="title">{{ item.name }}</span>
+        <MultiplyIcon class="icon" />
+      </div>
+    </div>
+  </div>
+</template>
+<script name="TagList" setup>
+import { MultiplyIcon } from 'tdesign-icons-vue-next';
+import { ref, onMounted, reactive } from 'vue';
+import { getSopFastOptionsApi } from '@/api/sop';
+const formRef = ref();
+const emit = defineEmits(['saveFastOption']);
+const props = defineProps({
+  type: String,
+  contentType: String,
+  // content: {
+  //   type: Object,
+  //   default: () => ({}),
+  // },
+});
+const formData = reactive({
+  name: '',
+});
+const rules = {
+  name: [{ required: true, message: '请输入想要保存的快捷选项的名称' }],
+};
+const list = ref([]);
+const getList = () => {
+  getSopFastOptionsApi({
+    type: props.type,
+    contentType: props.contentType,
+  }).then((res) => {
+    list.value = res || [];
+  });
+};
+onMounted(() => {
+  getList();
+});
+const save = async () => {
+  const valid = await formRef.value?.validate();
+  if (valid !== true) return;
+  emit('saveFastOption', formData.name);
+};
+</script>
+<style lang="less" scoped>
+.tag-list-box {
+  padding-bottom: 15px;
+}
+.tag-list {
+  padding: 5px 0;
+  flex-wrap: wrap;
+  * {
+    transition: all 0.2s;
+  }
+  .fast-tag {
+    background-color: #e5e5e5;
+    border-radius: 3px;
+    padding: 3px 3px 3px 8px;
+    margin-bottom: 6px;
+    &:not(:last-child) {
+      margin-right: 4px;
+    }
+    span.title {
+      font-size: 12px;
+      color: #262626;
+    }
+    .icon {
+      color: #666;
+      font-size: 22px;
+      margin-left: 5px;
+      cursor: pointer;
+      &:hover {
+        color: #262626;
+      }
+    }
+  }
+}
+</style>

src/views/sop/components/select-metadata.vue

@@ -33,6 +33,13 @@
             :label="item.fieldTitle"
             :value="item.fieldId"
           />
+          <template #panelBottomContent>
+            <tag-list
+              :type="type"
+              :contentType="contentType"
+              @saveFastOption="saveFastOption"
+            ></tag-list>
+          </template>
         </t-select>
       </div>
     </template>
@@ -44,11 +51,12 @@ import { onMounted, ref, useAttrs, watch, computed } from 'vue';
 import { cloneDeep } from 'lodash-es';
 import { metadataListApi } from '@/api/sop';
 
-const emit = defineEmits(['update:modelValue', 'change']);
+const emit = defineEmits(['update:modelValue', 'change', 'saveFastOption']);
 const props = defineProps({
   modelValue: { type: Array },
   type: { type: String, default: 'OFFICE_SOP_FLOW' },
   originColumns: { type: Array, default: [] },
+  contentType: { type: String },
 });
 
 const attrs = useAttrs();
@@ -103,6 +111,9 @@ watch(
     immediate: true,
   }
 );
+const saveFastOption = (name) => {
+  emit('saveFastOption', name);
+};
 </script>
 
 <style lang="less" scoped>
@@ -116,6 +127,12 @@ watch(
   :deep(.t-popup__content) {
     box-shadow: none !important;
     margin: 0 !important;
+    overflow-y: hidden;
+    max-height: 100vh;
+    .t-select__dropdown-inner {
+      max-height: 290px;
+      overflow-y: auto;
+    }
   }
   :deep(.t-input__wrap + div) {
     position: static !important;

src/views/sop/sop-manage/student-sop/index.vue

@@ -15,6 +15,8 @@
         type="CLOUD_MARK_SOP_FLOW"
         @change="metadataChange"
         :originColumns="originColumns"
+        contentType="VIEW"
+        @saveFastOption="saveFastOption"
       ></select-metadata>
       <t-button variant="outline" @click="handleRefresh">
         <template #icon><svg-icon name="refresh" color="#262626" /></template>
@@ -312,23 +314,6 @@ const columns = computed(() => {
       width: 50,
       fixed: 'left',
     },
-    // { colKey: 'serviceName', title: '服务单元', width: 160 },
-    // { colKey: 'sopNo', title: 'SOP流水号', width: 200 },
-    // { colKey: 'crmNo', title: '项目单号', width: 200 },
-    // { colKey: 'beginTime', title: '派单时间', width: 180 },
-    // { colKey: 'customManagerName', title: '客户经理', width: 140 },
-    // { colKey: 'customManagerTypeStr', title: '客户类型', width: 120 },
-    // { colKey: 'customName', title: '客户名称', width: 140 },
-    // { colKey: 'crmName', title: '项目名称', minWidth: 160 },
-    // { colKey: 'productName', title: '实施产品', width: 120 },
-    // { colKey: 'examStartTime', title: '考试开始时间', width: 180 },
-    // { colKey: 'examEndTime', title: '考试结束时间', width: 180 },
-    // { colKey: 'flowCreateName', title: '提交人', width: 140 },
-    // { colKey: 'flowCreateTime', title: '提交时间', width: 180 },
-    // { colKey: 'flowUpdateTime', title: '更新时间', width: 180 },
-    // { colKey: 'statusStr', title: '流程状态', width: 120 },
-    // { colKey: 'taskName', title: '流程节点', width: 160 },
-    // { colKey: 'pendApproveName', title: '当前节点负责人', width: 140 },
     {
       title: '管理',
       colKey: 'operate',
@@ -568,4 +553,6 @@ const toDeviceManage = (row) => {
   curSopData.value = row;
   showDeviceManage.value = true;
 };
+
+const saveFastOption = (name) => {};
 </script>