@ebiz/designer-components 0.1.89 → 0.1.90

package/src/components/LaunchInterview.vue

@@ -0,0 +1,403 @@
+<template>
+  <div>
+    <ebiz-tdesign-button
+      theme="primary"
+      size="medium"
+      class="component-base-style"
+      :content="btnText || '发起访谈'"
+      @click="openTalkDialog"
+    ></ebiz-tdesign-button>
+    <ebiz-dialog
+      width="800"
+      header="员工访谈"
+      body="对话框内容"
+      mode="modal"
+      placement="center"
+      confirmBtn="确认"
+      cancelBtn="取消"
+      :footer="false"
+      class="component-base-style"
+      v-model:visible="state.showTalkBox"
+      @cancel="closeTalkSave"
+      @close="closeTalkSave"
+      @confirm="formatData"
+    >
+      <template #default>
+        <ebiz-tabs theme="normal" placement="top" size="medium" class="component-base-style" v-model="state.actTab">
+          <ebiz-tab-panel value="add" label="添加访谈" style="padding-top: 12px" @change="tabChange">
+            <ebiz-s-form
+              layout="vertical"
+              labelAlign="right"
+              labelWidth="100px"
+              :showSubmitButton="false"
+              :showCancelButton="false"
+              ref="form"
+              :scrollToFirstError="true"
+              :showButtons="true"
+              class="component-base-style"
+              :data="state.interviewFormData"
+              :rules="state.interviewFormRules"
+            >
+              <template #default="{ formData }">
+                <ebiz-s-form-item
+                  label="访谈时间"
+                  name="interview_time"
+                  type="date"
+                  :multiple="false"
+                  v-model="state.interviewFormData.interview_time"
+                  :options="[]"
+                ></ebiz-s-form-item>
+                <ebiz-s-form-item
+                  label="访谈类型"
+                  name="type_id"
+                  type="select"
+                  :multiple="false"
+                  :isRemote="true"
+                  v-model="state.interviewFormData.type_id"
+                  :options="[]"
+                  :remoteApiConfig="{ key: 'interview_kind_get', apiId: 2954, apiType: 0 }"
+                >
+                  <template #default>
+                    <ebiz-remote-select
+                      placeholder="请选择"
+                      :clearable="false"
+                      :multiple="false"
+                      class="component-base-style"
+                      v-model="state.interviewFormData.type_id"
+                      :queryParams="state.queryParams"
+                      :optionsConfig="{}"
+                      :apiConfig="{ key: 'interview_kind_get', apiId: 2954, apiType: 0 }"
+                      @change="calcQuestion"
+                    ></ebiz-remote-select></template
+                  ></ebiz-s-form-item>
+                <div v-if="state.questionList.length" class="component-base-style">
+                  <span style="display: inline-block; font-size: 16px; margin-bottom: 12px" class="component-base-style"
+                  >问题列表</span
+                  >
+                  <div
+                    v-for="(item, index) in state.questionList"
+                    style="padding-left: 15px; margin-bottom: 12px"
+                    class="component-base-style"
+                    :key="index"
+                  >
+                    <div class="component-base-style">
+                      <span style="display: inline-block" class="component-base-style">{{
+                          `${index + 1}. ${item.name}`
+                        }}</span>
+                    </div>
+                    <div style="display: flex; align-items: center; gap: 10px" class="component-base-style">
+                      <span style="white-space: nowrap; display: inline-block; color: #999" class="component-base-style"
+                      >访谈情况:</span
+                      >
+                      <ebiz-textarea
+                        placeholder="请输入"
+                        :maxLength="200"
+                        :maxCharacter="true"
+                        :autosize="true"
+                        class="component-base-style"
+                        :modelValue="item.answer"
+                        @change="(...eventArgs) => syncVal(eventArgs, item, 'answer')"
+                      ></ebiz-textarea>
+                      <div
+                        style="display: flex; flex-direction: column; align-items: center"
+                        class="component-base-style"
+                      >
+                        <span style="display: inline-block; white-space: nowrap" class="component-base-style"
+                        >有问题</span
+                        >
+                        <ebiz-switch
+                          size="medium"
+                          theme="primary"
+                          class="component-base-style"
+                          :modelValue="item.need_follow"
+                          @change="(...eventArgs) => syncVal(eventArgs, item, 'need_follow')"
+                        ></ebiz-switch>
+                      </div>
+                    </div>
+                  </div></div></template
+              ></ebiz-s-form>
+            <div
+              v-if="state.actTab == 'add'"
+              style="display: flex; justify-content: flex-end; gap: 10px"
+              class="component-base-style"
+            >
+              <ebiz-tdesign-button
+                theme="default"
+                size="medium"
+                content="取消"
+                class="component-base-style"
+                @click="closeTalkSave"
+              ></ebiz-tdesign-button>
+              <ebiz-tdesign-button
+                content="确定"
+                theme="primary"
+                size="medium"
+                class="component-base-style"
+                @click="formatData"
+              ></ebiz-tdesign-button></div
+            ></ebiz-tab-panel>
+          <ebiz-tab-panel value="history" label="历史访谈">
+            <ebiz-s-data
+              :pageEnable="true"
+              :size="10"
+              fetchUrl=""
+              :split="true"
+              :stripe="false"
+              :async="false"
+              :defaultSearch="false"
+              :showDivider="false"
+              :showPageHeader="false"
+              labelKey="table"
+              class="component-base-style"
+              :defaultParams="state.gridParams"
+              :apiConfig="{ key: 'interview_record_get', apiId: 3007, apiType: 0 }"
+            >
+              <template #default="{ data }">
+                <Ttable
+                  :data="data"
+                  :columns="state.columns"
+                  row-key="id"
+                ></Ttable></template>
+              </ebiz-s-data></ebiz-tab-panel></ebiz-tabs></template
+      ></ebiz-dialog>
+    <ebiz-dialog
+      width="700"
+      header="问题列表"
+      body="对话框内容"
+      mode="modal"
+      placement="center"
+      confirmBtn="确认"
+      cancelBtn="取消"
+      :footer="false"
+      class="component-base-style"
+      v-model:visible="state.questionShow"
+      @close="closeQuestion"
+    >
+      <template #default>
+        <div style="display: flex; flex-direction: column; gap: 12px" class="component-base-style">
+          <div v-for="(item, index) in state.nowQuestions" class="component-base-style" :key="index">
+            <div style="display: flex; align-items: center; gap: 10px; margin-bottom: 8px" class="component-base-style">
+              <span
+                style="display: inline-block; font-size: 16px; color: #333; margin-right: auto"
+                class="component-base-style"
+              >{{ `${index + 1}. ${item?.question_id_info?.name}` }}</span
+              >
+            </div>
+            <div style="display: flex; gap: 10px; align-items: center" class="component-base-style">
+              <span style="display: inline-block; white-space: nowrap" class="component-base-style">访谈情况：</span>
+              <span style="display: inline-block" class="component-base-style">{{ item?.content }}</span>
+            </div>
+          </div>
+        </div></template
+      ></ebiz-dialog
+    >
+  </div>
+</template>
+
+<script setup lang="jsx">
+import { Table as Ttable} from 'tdesign-vue-next';
+import EbizRemoteSelect from './EbizRemoteSelect.vue'
+import EbizSwitch from './EbizSwitch.vue'
+import EbizTabs from './EbizTabs.vue'
+import EbizTabPanel from './EbizTabPanel.vue'
+import EbizTdesignButton from './TdesignButton.vue'
+import EbizTextarea from './TdesignTextarea.vue'
+import EbizDialog from './EbizDialog.vue'
+import EbizSData from './senior/EbizSData/index.vue'
+import EbizSForm from './senior/EbizSForm/index.vue'
+import EbizSFormItem from './senior/EbizSForm/item.vue'
+import EbizTag from './TdesignTag.vue'
+import * as vue from 'vue'
+import dataService from '../apiService/simpleDataService';
+   
+
+const props = defineProps({
+  employeeId: { type: Number, default: 0 },
+  no: { type: String, default: '' },
+  btnText: { type: String, default: '' },
+  kind: { type: String, default: 'DAILY' }
+})
+
+const emit = defineEmits(['api-success'])
+const form = vue.ref(null)
+
+const state = vue.reactive({
+  columns: [
+    { colKey: 'serial-number', width: 60 },
+    { colKey: 'employee_id_info.name', title: '员工', cell: 'employee_idSlot' },
+    { colKey: 'create_by_info.name', title: '创建人', cell: 'create_bySlot' },
+    {
+      colKey: 'type_id',
+      title: '访谈类型',
+      cell: 'type_idSlot',
+      slots: {},
+      cell: (h,{ row }) => {
+        return <EbizTag>{row?.type_id_info?.name}</EbizTag>
+      }
+    },
+    { colKey: 'interview_time', title: '访谈时间', cell:(h,{row})=>{
+      return calcTime(row.interview_time)
+    }},
+    {
+      title: '操作',
+      colKey: 'ops',
+      slots: {},
+      cell: (h,{ row }) => {
+        return (
+          <EbizTdesignButton
+            theme="primary"
+            size="medium"
+            content="问题"
+            ghost={false}
+            class="component-base-style"
+            loading={state.loading}
+            disabled={state.loading}
+            onClick={(...eventArgs) => openQuestion(eventArgs, row)}
+          ></EbizTdesignButton>
+        )
+      }
+    }
+  ],
+  showTalkBox: false,
+  actTab: 'add',
+  interviewFormData: { type_id: '', interview_time: '', content: [] },
+  interviewFormRules: {
+    interview_time: [{ required: true, message: '访谈时间必填' }],
+    type_id: [{ required: true, message: '访谈类型必填' }]
+  },
+  questionList: [],
+  queryParams: {
+    kind: props.kind,
+    status: true
+  },
+  gridParams: {
+    employee: props.employeeId
+  },
+  loading: false,
+  nowQuestions: [],
+  questionShow: false
+})
+function calcTime(timeStr = 0, type = null, dontFill = false) {
+  if (!timeStr) return '-';
+  let time = timeStr;
+  time *= String(time).length < 13 ? 1000 : 1;
+  const date = new Date(time);
+  const year = date.getFullYear();
+  let month = (date.getMonth() + 1).toString().padStart(2, '0');
+  let day = date.getDate().toString().padStart(2, '0');
+  let hour = date.getHours().toString().padStart(2, '0');
+  let min = date.getMinutes().toString().padStart(2, '0');
+  let sec = date.getSeconds().toString().padStart(2, '0');
+  if (dontFill) {
+    month = Number(month) + '';
+    day = Number(day) + '';
+    hour = Number(hour) + '';
+    min = Number(min) + '';
+    sec = Number(sec) + '';
+  }
+  if (!type) return `${year}-${month}-${day} ${hour}:${min}:${sec}`;
+  try {
+    return Array.from(type).map(i => {
+      switch (i) {
+        case 'y':
+          return year;
+        case 'M':
+          return month;
+        case 'd':
+          return day;
+        case 'h':
+          return hour;
+        case 'm':
+          return min;
+        case 's':
+          return sec;
+        default:
+          return i;
+      }
+    }).join('');
+  } catch (err) {
+    return `${year}:${month}:${day} ${hour}:${min}:${sec}`
+  }
+}
+function openTalkDialog(event) {
+  let {userId} = JSON.parse(localStorage.getItem('user') || '{}')
+  state.interviewFormData = {
+    employee_id: props.employeeId,
+    no: props.no,
+    create_by: userId,
+
+    interview_time: '',
+    interview_content: '',
+    files: []
+  }
+  state.showTalkBox = true
+}
+function closeTalkSave(event) {
+  state.actTab = 'add'
+  state.questionList = []
+  state.showTalkBox = false
+}
+function calcQuestion(type_id) {
+  state.questionList = []
+  dataService.fetch({
+    queryParams:{
+      type_id
+    }
+  },{
+    key: 'interview_question_get'
+  }).then((res) => {
+      state.questionList = (res?.data || []).map((i) => {
+        return {
+          ...i,
+          need_follow: false,
+          answer: ''
+        }
+      })
+    })
+}
+async function formatData(event) {
+  let valid = await form.value.formRef.validate()
+  if (valid !== true) return false
+  state.interviewFormData.content = state.questionList.map((i) => {
+    return {
+      question_id: i.id,
+      need_follow: i.need_follow,
+      answer: i.answer
+    }
+  })
+  dataService.fetch({
+    saveData: state.interviewFormData
+  },{
+    key: 'interview_record_save'
+  }).then(closeTalkSave)
+}
+function submitSuccess(event) {
+  emit('api_success')
+}
+function syncVal(eventArgs, args0, args1) {
+  args0[args1] = eventArgs[0]
+}
+function tabChange(event) {}
+function openQuestion(eventArgs, args0) {
+  console.log(args0)
+  state.loading = true
+  dataService.fetch({
+    queryParams:{
+      interviewId: args0.id
+    }
+  },{
+    key: 'interview_question_record_get'
+  }).then((res) => {
+      state.nowQuestions = res?.data || []
+      state.questionShow = true
+    })
+    .finally(() => {
+      state.loading = false
+    })
+}
+function closeQuestion(event) {
+  state.questionShow = false
+}
+
+</script>
+<style scoped></style>

package/src/components/MyComponent.vue

@@ -1,39 +1,39 @@
-<template>
-  <div class="my-component">
-    <t-input v-model="value" placeholder="请输入内容" @update:modelValue="change"></t-input>
-    <t-button size="small">查询数据</t-button>
-  </div>
-</template>
-
-<script>
-import { Input as TInput } from 'tdesign-vue-next';
-import { ref } from "vue";
-
-export default {
-  name: 'MyComponent',
-  components: {
-    TInput
-  },
-  props: {
-    modelValue: {
-      type: String
-    },
-    name: String
-  },
-  emits: ['update:modelValue'],
-  setup(props, { emit }) {
-    const value = ref(props.modelValue)
-
-    const change = (val) => {
-      value.value = val
-      console.log(val)
-      emit('update:modelValue', value.value)
-    }
-
-    return {
-      value,
-      change
-    }
-  }
-}
-</script>
+<template>
+  <div class="my-component">
+    <t-input v-model="value" placeholder="请输入内容" @update:modelValue="change"></t-input>
+    <t-button size="small">查询数据</t-button>
+  </div>
+</template>
+
+<script>
+import { Input as TInput } from 'tdesign-vue-next';
+import { ref } from "vue";
+
+export default {
+  name: 'MyComponent',
+  components: {
+    TInput
+  },
+  props: {
+    modelValue: {
+      type: String
+    },
+    name: String
+  },
+  emits: ['update:modelValue'],
+  setup(props, { emit }) {
+    const value = ref(props.modelValue)
+
+    const change = (val) => {
+      value.value = val
+      console.log(val)
+      emit('update:modelValue', value.value)
+    }
+
+    return {
+      value,
+      change
+    }
+  }
+}
+</script>

package/src/components/Table.vue

@@ -1,45 +1,45 @@
-<template>
-  <div class="my-component">
-    {{ value }}
-    <t-table row-key="key" :data="tableData" :columns="columns"></t-table>
-    <slot></slot>
-    <t-button @click="changeValue"> 修改数据</t-button>
-  </div>
-</template>
-
-<script setup>
-
-import { ref, defineEmits, defineProps, watch } from "vue";
-
-const props = defineProps(['modelValue', 'dataSource']);
-
-const tableData = ref([
-  { id: 1, name: '张三', age: 18 },
-  { id: 2, name: '李四', age: 20 },
-  { id: 3, name: '王五', age: 22 },
-]);
-const columns = [
-  { colKey: 'id', title: 'ID', width: '100' },
-  { colKey: 'name', title: '姓名', ellipsis: true },
-  { colKey: 'age', title: '年龄' },
-];
-
-const emit = defineEmits("update:modelValue");
-
-watch(() => props.dataSource, (val) => {
-  version.value = 0;
-  changeValue()
-})
-const value = ref(props.modelValue)
-
-const change = (val) => {
-  value.value = val
-  emit('update:modelValue', value.value)
-}
-
-const version = ref(0);
-const changeValue = () => {
-  change(props.dataSource + ' : ' + (version.value++))
-}
-
-</script>
+<template>
+  <div class="my-component">
+    {{ value }}
+    <t-table row-key="key" :data="tableData" :columns="columns"></t-table>
+    <slot></slot>
+    <t-button @click="changeValue"> 修改数据</t-button>
+  </div>
+</template>
+
+<script setup>
+
+import { ref, defineEmits, defineProps, watch } from "vue";
+
+const props = defineProps(['modelValue', 'dataSource']);
+
+const tableData = ref([
+  { id: 1, name: '张三', age: 18 },
+  { id: 2, name: '李四', age: 20 },
+  { id: 3, name: '王五', age: 22 },
+]);
+const columns = [
+  { colKey: 'id', title: 'ID', width: '100' },
+  { colKey: 'name', title: '姓名', ellipsis: true },
+  { colKey: 'age', title: '年龄' },
+];
+
+const emit = defineEmits("update:modelValue");
+
+watch(() => props.dataSource, (val) => {
+  version.value = 0;
+  changeValue()
+})
+const value = ref(props.modelValue)
+
+const change = (val) => {
+  value.value = val
+  emit('update:modelValue', value.value)
+}
+
+const version = ref(0);
+const changeValue = () => {
+  change(props.dataSource + ' : ' + (version.value++))
+}
+
+</script>